Necesito ayuda para hacer un rayo dirigido desde el centro del juego al cursor del mouse, pero hubo problemas con el desplazamiento de arriba a la izquierda. La línea está en algún lugar cerca del mouse y no entiendo con qué está conectada. Sitio: https://moomoo.io .
Código:
let line = document.createElement('div'); line.id = 'line'; document.body.appendChild(line); let x = 0; let y = 0; document.querySelector('html').onmousemove = function(event) { // I wrote in the html selector so you can run here. There should be a gameCanvas event = event || window.event; console.log(event.offsetX, event.offsetY); x = event.offsetX; y = event.offsetY; } let canvas = document.getElementById('gameCanvas') setInterval(function draw_line() { delta_x = x - (document.documentElement.clientWidth / 2); delta_y = y - (document.documentElement.clientHeight / 2); theta_radians = Math.atan2(delta_y, delta_x); console.log(theta_radians); line.setAttribute('style', `border: 2px solid lime; width: 200px; -webkit-transform: rotate(${theta_radians}rad); position: absolute; top: ${y}px; left: ${x}px; height: 0`); }, 1);