Estoy construyendo un juego de lienzo html5 y necesito una forma de hacer que mi sprite mire el cursor del mouse. Tengo las coordenadas X e Y para el sprite, y también las coordenadas X e Y del puntero. Todo lo que estoy atrapado es la matemática involucrada para hacer que el sprite mire al puntero. Todo está en un mundo 2D, por lo que no puedo imaginar que sea demasiado complicado, pero tengo muy poca experiencia con estas cosas.
Además, cualquier enlace útil a artículos / publicaciones de blog sobre este tipo de cosas sería increíble (programación de juegos 2D en general, no específicamente Javascript).
Para agregar, debo tener en cuenta que necesito un ángulo en grados que me apunte hacia el cursor usando su posición X e Y.
¿Cómo puedo saber las coordenadas del cursor y dónde coloco todo esto?
fuente
Respuestas:
Sin conocer las API a su disposición, aquí están las matemáticas básicas para obtener un ángulo en grados:
La
* 180 / math.pi;convierte de radianes a grados.fuente
atan2supone que el sistema de coordenadas es + x derecha y + y arriba . Si el suyo se cae, deberá negar el ángulo. También supone que el objeto estará orientado hacia la dirección (1, 0) (derecha) cuando el ángulo sea 0. Si está orientado en una dirección diferente, entonces necesita compensar el ángulo. Mi respuesta aquí explica cómo hacer eso.