X & Y Marking Table Using Php - php

Question

I'm trying to make an x and y marking table using PHP. I used array and loops to this task.
Please refer to the sample code and image. I almost spent 2hrs finding some solutions still need help.
Very much appreciated for some ideas.
<?php
$x_arr = array();
$y_arr = array();
$n_arr = array();
$x_arr = [5,5,9,14];
$y_arr = [1,4,3,3];
$n_arr = [1,1,1,1];
$x = 16;
$y = 4;
$gap = 3;
$data = "";
?>
<div style="padding:30px; background:#242424;">
<table style="border:20px solid #660000;" align="center">
<?php
//STRIP
for($i=$y; $i>=1; $i--){
?>
<tr style="background:#fff;">
<?php
for($ii=$x; $ii>=1; $ii--){
//echo "<td style='border:1px solid black;'>x".$ii." : y".$i."</td>";
for($iii=0; $iii<=count($x_arr); $iii++){
if(isset($x_arr[$iii]) && isset($y_arr[$iii])){
$x_tmp = $x_arr[$iii];
$y_tmp = $y_arr[$iii];
if($i==$y_tmp && $ii==$x_tmp){
$data= "<td style='border:1px solid black; width:50px; height:30px; text-align:center;'><span data-feather='circle'></span></td>";
echo $data;
}else{
$data = "";
}
}
}
if($data == ""){
echo "<td style='border:1px solid black;'>x".$ii." : y".$i."</td>";
}
//echo "<td style='border:1px solid black;'>&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp</td>";
//echo "<td style='border:1px solid black; width:50px; height:30px; text-align:center;'><span data-feather='circle'></span></td>";
if($ii>$gap){
$gap = $gap+$gap;
}
}
?>
</tr>
<?php
}
?>
</table>
</div>
Result Error :
Current Result
Expected Result :
Target Result