CODEWITHSUNDEEP
htmlgesture
Bryan P
Bryan P

Reputation: 4202

Gesture recognition for custom patterns (numbers) html5

I need to recreate an iPhone game using html5 and javascript and one of it's features is number recognition but all I'm seeing on the internet is only about detecting simple gestures like swipe to the left right top down circle etc.

But what I need is detecting gesture of numbers, I know it's possible but I really can't find anything in the internet about number recognition, any tutorials that you know of that can help me do this?

Upvotes: 1

Views: 2307

Answers (3)

Mario
Mario

Reputation: 36517

Gesture recognition isn't as complicated as you might think. The basic idea is to split your "writing" into several simple movements (like swipes).

I'd try the following:

  • Track finger/mouse movement.
  • As long as the movement is consistent (i.e. similar direction/speed), you add it up.
  • When there's a change in direction, store a new movement.
  • Then just analyze the last x movements to determine the number that has been written.

Some examples:

  • One: Only one movement south, or short move to northeast and then south.
  • Two: Short movement to northeast, short movement to southeast, long movement to southwest, Long movement to the east.
  • Three: Short movement to the southeast, southwest, southeast, southwest.
  • Four: Short movement to the southwest or south, short movement to the east, new line or move northwest, long move south

Of course you'll need some approximations and tolerance, and you might want to reuse an existing library, but this also depends on the actual task (e.g. you might be forced to write something from scratch).

Upvotes: 4

user2549873
user2549873

Reputation:

You can define your own gestures, by providing array of points, that defines shape and provide callback function for each shape.

Javascript gesture recognition:

http://webcodingeasy.com/JS-classes/Javascript-gesture-recognition

Upvotes: 1

user2861062
user2861062

Reputation:

Try this http://www.photonstorm.com/phaser

It said:

Talk to a Phaser.Pointer and it doesn’t matter if the input came from a touch-screen or mouse, it can even change mid-game without dropping a beat. Multi-touch, Mouse, Keyboard and lots of useful functions allow you to code custom gesture recognition.

I think you need that custom gesture recognition.

Upvotes: 1

Related Questions