Четверг, 28.11.2024, 11:35 | Приветствую Вас Гость

...

Код

Главная » Статьи » Js
заполнение матрицы кликом

<!DOCTYPE html>
<html>
<body onload="press(event)">
<canvas id="myCanvas" width="1000" height="500" style="border:1px solid #d3d3d3;" onclick="press(event)">
</canvas>
<div id="mytext"> </div>
<script>

let c = document.getElementById("myCanvas");
let ctx = c.getContext("2d");

ctx.clearRect(0,0,1000,500);
ctx.font = "30px Arial";

function getRandomInt(min, max) {
return Math.floor(Math.random() * (max - min + 1)) + min;
}

function press(event){


ctx.beginPath();
for (let y = 0; y < 500; y += 100) {
for (let x = 0; x < 1000; x += 100) {
ctx.moveTo(0, y);
ctx.lineTo(1000, y);

ctx.moveTo(x, 0);
ctx.lineTo(x, 1000);
}

ctx.stroke();
}

for (let y = 0; y <= 500; y += 100) {
for (let x = 0; x <= 1000; x += 100) {

if ((x >= event.pageX-10 && x <= event.pageX+90) && (y >=  event.pageY-10 && y <= event.pageY+90)) 
{
ctx.fillStyle = '#' + Math.floor(Math.random()*16777215).toString(16);


ctx.fillText(String.fromCharCode(getRandomInt(1072, 1103)).toUpperCase(),x-50,y-50);
}
}

}


}
</script>

</body>
</html>

Категория: Js | Добавил: moskov (21.02.2021)
Просмотров: 127 | Рейтинг: 0.0/0
Добавлять комментарии могут только зарегистрированные пользователи.
[ Регистрация | Вход ]

Меню сайта

Категории раздела

PHP [41]
C++ [71]
Autoit [108]
Processing [105]
Basic4GL [7]
Fasm [2]
PABC [7]
Js [236]
Gentee [1]
Python [204]
Java android [3]
Small Basic [9]

Мини-чат

Статистика

Онлайн всего: 5
Гостей: 5
Пользователей: 0

Форма входа

Друзья сайта

  • ЗОВ КОСМОСА

  • Хулиган Вселенной

  • Тюремная поэзия

  • Религиозная поэзия

  • Сайт клана ЛеГиоН

    • Поиск