Есть PHP цикл, который рисует таблицу
<table border="1">
<?php
$i = 1;
$k = 1;
while ($i <= $v_value) {
echo "<tr>";
$t = 1;
while ($t <= $g_value) {
echo "<td align='center' id=".$k." ondblclick='postCell()' onclick='selectCell(".$k.")'></td>";
$t++;
$k++;
}
echo "</tr>";
$i++;
}
?>
</table>
Для каждой ячейки задаётся уникальный ID по порядку. Можно кликнуть на любую ячейку, и выполняется JS скрипт
Хочу сделать игру на подобии пиксельной змейки (По порядку закрашиваются нужные ячейки нужным цветом). Подскажите, как можно это таблицу отрисовать в canvas?
Я нашёл код шахматной доски
<script>
var canvas = document.getElementById("chessboard");
var context = canvas.getContext('2d');
// Размеры холста
canvas.width = 300;
canvas.height = 300;
// Внешняя рамка для доски
context.strokeRect(15, 15, 266, 266);
// Внутренняя рамка для доски
context.strokeRect(18, 18, 260, 260);
// Закрашиваем внутреннюю область черным цветом
context.fillRect(20, 20, 256, 256);
for (i = 0; i < 8; i += 2)
for (j = 0; j < 8; j += 2) {
context.clearRect(20 + i * 32, 20 + j * 32, 32, 32);
context.clearRect(20 + (i + 1) * 32, 20 + (j + 1) * 32, 32, 32);
}
</script>
Но не получилось там отрисовать таблицу