Как контролировать местоположение моего круга? - PullRequest
0 голосов
/ 22 ноября 2018

Итак, я использую CodeAvengers, чтобы научиться делать игры.Недавно он научил меня, как использовать onMouseDown, и еще нескольким подобным вещам.Он показал мне, какие атрибуты нужно использовать, чтобы что-то появилось или произошло, когда я нажимаю вниз, перетаскиваю мышь или другие подобные вещи.Мне удалось воссоздать это так, чтобы это работало на Notepad ++, но есть определенная часть, которую я не знаю, как это сделать.Как сделать так, чтобы круг появлялся там, где я щелкаю мышью, а не просто появлялся в углу?

Вот мой код

<!DOCTYPE html>
<html>
<body>
<canvas id = "gameCanvas" width="500" height="500" style="border:4px solid 
black"></canvas>
<script type = "text/javascript">
var myCanvas = document.getElementById("gameCanvas");
var ctx = myCanvas.getContext("2d");

window.onmousedown = function(event){
  ctx.beginPath();
  ctx.arc(100,75,50,0,2*Math.PI);
  ctx.stroke();
}
</script>
</body>
</html>

1 Ответ

0 голосов
/ 22 ноября 2018

Необходимо получить координаты мыши clientX и clientY события события и установить для них координату окружности (x, y).

ctx.arc(event.clientX, event.clientY, 50, 0, 2*Math.PI);
...