html5 canvas - touchmove - как рассчитать скорость и направление?

Итак, я хочу измерить, как быстро и в каком направлении пользователь проводит пальцем по холсту html5?

Кажется, для этого уже должно быть что-то написано, поэтому мне не нужно изобретать велосипед, но я ничего не могу найти. Кто-нибудь знает о функции JavaScript?

Если бы мне пришлось делать самому, я думаю так:

• захватить события касания x и y, сохранить их в переменной массива
• рассчитать наклон между двумя точками (возможно, усреднить его, если наклоны разные)
• не уверен, как измерить скорость, может быть, расстояние между точками?

любые другие идеи?

Вот мой холст и моя форма, и он слушает события касания. При прикосновении к моему iphone или симулятору iphone я обычно получаю 1 или 2 события. Я вижу координаты. Я использую кинетику для сцены и формы.

Чтобы попробовать, перейдите по этому адресу в своем iPhone, коснитесь кружка пальцем и нажмите на него куда-нибудь. (или если у вас есть симулятор iOS, вы также можете использовать его)

Вот моя скрипка: http://jsfiddle.net/jnylund/uRgZZ/16/

   function writeMessage(messageLayer, message) {
   var context = messageLayer.getContext();
   messageLayer.clear();
   context.font = '18pt Calibri';
   context.fillStyle = 'black';
   context.fillText(message, 10, 25);
   var div = document.getElementById('tevents');
   div.innerHTML = div.innerHTML + message + "<BR/>";

}

var stage = new Kinetic.Stage({
   container: 'container',
   width: 460,
   height: 320
});

var layer = new Kinetic.Layer();
var messageLayer = new Kinetic.Layer();

var circle = new Kinetic.Circle({
   x: stage.getWidth() / 2,
   y: stage.getHeight() / 2,
   radius: 40,
   fill: 'red',
   stroke: 'black',
   strokeWidth: 4 //,
   // draggable: true
});

circle.setX(230);
circle.setY(160);

circle.on('touchmove', function (event) {
   writeMessage(messageLayer, 'touch event length is ' + event.touches.length);
   for (var i = 0; i < event.touches.length; i++) {
       var touch = event.touches[i];
       writeMessage(messageLayer, 'event x: ' + touch.pageX + ', y: ' + touch.pageX);
   }

   var touchPos = stage.getTouchPosition();
   writeMessage(messageLayer, 'stage x: ' + touchPos.x + ', y: ' + touchPos.y);

});

// add the shape to the layer
layer.add(circle);

// add the layer to the stage
stage.add(layer);
stage.add(messageLayer);

спасибо Джоэл