Воскресенье, 24.11.2024, 21:54 | Приветствую Вас Гость

...

Код

Главная » Статьи » Js
Квадраты на канвасе

<!DOCTYPE html>
<html>
<body >

<canvas id="myCanvas" width="500" height="500" style="border:1px solid #d3d3d3;" onmousedown="myclick(event)">
</canvas>

<script>
let x = 0;
let y = 0;


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

function myclick(event){
ctx.fillStyle = '#' + Math.floor(Math.random()*16777215).toString(16);
const rect = canvas.getBoundingClientRect()
const x = event.clientX - rect.left
const y = event.clientY - rect.top
console.log("x: " + x + " y: " + y)

size_1 = Math.floor(Math.random()*100)+10;
size_2 = Math.floor(Math.random()*100)+10;
ctx.fillRect(x,y,size_1,size_2);

}

</script>

</body>
</html>

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

Меню сайта

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

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

Мини-чат

Статистика

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

Форма входа

Друзья сайта

  • ЗОВ КОСМОСА

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

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

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

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

    • Поиск