Novo curso! Todo programador deveria aprender IA generativa!
Experimente uma aula grƔtis+ 41
Hand gesture recognition in JavaScript [swipe gesture]
Hi, I want to move a shape with hand gestures in JavaScript. for example when you click on top, it goes top and do the same for other directions. if there are some ways to write this, I want the most easiest and understandable way š thanks in advanceš
31 Respostas
+ 18
Sami Khan Yea I know JS but not professionally, I got what you said I've worked with touchmoves , but I don't know if I can do it or not š it takes some days for me to do thatšš
+ 16
Cbrā[ Exams ] thanks šyea, I'm looking forward to itš
+ 15
Sami Khan yesssss this is similar to hand gestures ššš I needed both of your codes ššš and it was so great that you wrote them in JavaScript not jQuery or... š because I don't know them yet . now I'm going to read them line by line and analyze them for myself šš thank you so muchššš¹
+ 13
Sami Khan I wanted this one tooš¤ and I also want the swipe gestures šš thanks alot šš¹š¹š¹
+ 13
Cbrā[ Exams ] šyeah, but I needed that too... I also want the gesture one, when you draw your finger on the screen the ball moves
+ 13
Mike Perkowski šššthanksss
+ 13
CalviÕ² šššwow,this is the one which Mike Perkowski said (hammer.js). Actually I was looking forward to your answer tooššš thanks alot genius ššš¹š¹š¹ššš
+ 12
Sami Khan do u know the swipe gesture too šš¶?
+ 12
Sami Khan was it obvious???ššš I didn't have the face to say it directly š
š
šsome JavaScript codes are hard for me and I can't write them without helpšš¹
+ 8
There are libraries for swipe gestures in the browser like hammer.js and you can probably use those, but if I were implementing this from scratch, Iād assign a mousedown and a touchstart event listener to any element I wanted to be āswipableā. In the event listener, Iād save the inital touch or mouse down point as the starting point and then use mouseup and touchend events to get the end point, then handle the logic to determine which direction to swipe by comparing the start and end x and y values.
If you wanted to have something happen depending on if you tocuhed the top, bottom, right or left of the element, you could use the same approach only use the .getBoundingClientRect() method to find the center point of the element and compare that point to the touch point.
I hope this helps! Good luck!
+ 4
CalviÕ² I especially liked the line from your code:
var mc = new Hammer(pad);
The pun is clever. šš¤£
+ 3
Ama Duka i dont get you right
+ 3
May be this one!!
https://code.sololearn.com/Wj9o4FdapC2p/?ref=app
+ 3
Sheida Hedayati I only showcased one of the gesture events, panning. There are other gesture such as zooming, check out the documentation..
+ 2
I hope this help to you
https://youtu.be/VD2bIMBu2y8
+ 1
use tensorflow.js for the machine learning part, theres a guide on this link https://towardsdatascience.com/handtrackjs-677c29c1d585
+ 1
I think it's possible with ReactJS framework.
+ 1
<!--Begin: Star-Clicks.com HTML Code--><script type='text/javascript' src='https://www.star-clicks.com/secure/ads.php?pid=55302067250395264'></script><!-- End: Star-Clicks.com -->