How to Move canvas object ? | Sololearn: Learn to code for FREE!
New course! Every coder should learn Generative AI!
Try a free lesson
0

How to Move canvas object ?

How can i move any canvas object on screen touch mobile in same direction by moving the object

20th Mar 2020, 4:17 PM
ABHISHEK
ABHISHEK - avatar
3 Answers
+ 5
ABHISHEK , you can use TouchEvent interface. an example : let canvas = document.querySelector('canvas'); canvas.addEventListener('touchstart',touchResponce); function touchResponce(e){ //e is TouchEvent object. let x= e.touches[0].clientX; let y= e.touches[0].clientY; //e.touches is TouchList. use [0] if you need first initiated Touch. console.log(x,y); } This gives you touch coordinates relative to viewport (not the element). In order to get coordinates relative to element use canvas.getBoundingClientRect(). You'll need to do some calculations using values returned by this method ,off course. I have added eventlistener for touchstart event. In this game you'll need to trigger events for touchstart, touchend, and touchmove. If you want to make accessible from computer you'll also need handlers for mouse or keypress.
20th Mar 2020, 4:48 PM
🇮🇳Omkar🕉
🇮🇳Omkar🕉 - avatar
+ 5
-clear canvas -draw somewhere else. Question is unclear. If you can provide the code in which you are trying to do this we can give more detailed answer.
20th Mar 2020, 4:20 PM
🇮🇳Omkar🕉
🇮🇳Omkar🕉 - avatar
0
I want to make a ping pong game in which i have to move paddle by touching screen
20th Mar 2020, 4:32 PM
ABHISHEK
ABHISHEK - avatar