0
123
VistasLienzo Javascript. ¿Cómo animar un objeto dibujado para que gire en sentido horario o antihorario hasta que apunte a la dirección de una coordenada determinada?
Por favor, eche un vistazo al fragmento de código a continuación. Necesito rotar la bola blanca en la animación hasta que apunte en la dirección del círculo amarillo. Lo ideal es que gire en sentido horario o antihorario según el lado que esté más cerca.
var ctx = mycanvas.getContext("2d"), pWidth = 14, p1 = { x: 100, y: 100 }, p2 = { x: 300, y: 400 }, ball = { x: p1.x + pWidth, y: p1.y }; function drawCircle(x, y, w, color) { ctx.fillStyle = color; ctx.beginPath(); ctx.arc(x, y, w, 0, 2 * Math.PI); ctx.fill(); } function drawObjs() { ctx.clearRect(0, 0, mycanvas.width, mycanvas.height); drawCircle(p1.x, p1.y, pWidth, "blue"); drawCircle(ball.x, ball.y, 6, "white"); drawCircle(p2.x, p2.y, pWidth, "yellow"); } setInterval(drawObjs(), 1000); <head> <style> #mycanvas { border: solid 10px #060; } </style> </head> <body style="text-align:center"> <canvas id="mycanvas" width="640" height="480" style="background-color:green"></canvas> </body> <script> </script>Como esto
·
Juan Pablo Isaza
Responde la pregunta