0

What makes the ball move in this example of collision detection...................................

<!-- Created by Elizabeth🎈--> <!DOCTYPE html> <html> <head><title>tithle</title> <meta name="viewport" content="width=device-width,initial-scale=1"> <style type="text/css"> body{ margin:0%; padding:0%; background-color:#000; } </style> </head> <body> <canvas></canvas> <script type="text/javascript"> var canvas=document.querySelector("canvas"); canvas.width=window.innerWidth; canvas.height=window.innerHeight; var context=canvas.getContext("2d"); var dx=4; var r=15; var x=Math.random()*(canvas.width-r*2)+r; var y=Math.random()*(canvas.height-r*2)+r; var dy=4; function animate(){ requestAnimationFrame(animate); context.beginPath(); context.clearRect(0,0,innerWidth,innerHeight); /*context.fillStyle = "rgba(0,0,0,0.3)";context.fillRect(0,0,innerWidth,innerHeight);*/ document.body.style.backgroundColor=bg(); context.arc(x,y,r,0,2*Math.PI,false); context.fillStyle="#0ff"; context.fill(); context.closePath(); if(x+r>innerWidth || x-r<0){ dx=-dx; } if(y+r>innerHeight || y-r<0){ dy=-dy; }

18th Apr 2019, 6:27 PM
SCP 251
SCP 251 - avatar
5 Antworten
+ 5
¿ ? Hey, var dx is for velocity x and dy is for velocity y. If you add objects x to velocity x and y to velocity y, well, you can move an object.
18th Apr 2019, 10:19 PM
r8w9
r8w9 - avatar
+ 4
Yes.
18th Apr 2019, 10:23 PM
r8w9
r8w9 - avatar
0
Can it be any variable like speedy and speedx
18th Apr 2019, 10:21 PM
SCP 251
SCP 251 - avatar
0
What about the getContext ("2d") what does it do
18th Apr 2019, 10:24 PM
SCP 251
SCP 251 - avatar
0
getContext() returns a drawing context on the canvas.
21st Apr 2019, 2:17 PM
Ren Lleshi
Ren Lleshi - avatar