简体   繁体   中英

Javascript touch-event: how to increase trigger frequency?

There is an event listener that is triggered by "touchmove" and executes a function. Everything nice and tidy.

However, in my understanding, the function is triggered every (lets say) 500ms which is very slow frequency.

How can the "touchmove" trigger the function every 300ms or 100ms?

//this event listener is very slow
canvas.addEventListener('touchmove', draw_fn, false);

function draw_fn(e) { 
    getTouchPos(e);
    drawDot(canvas,touchX,touchY,12);
    event.preventDefault();
}

// tried to register touchmove with a bigger frequency
window.requestAnimFrame = (function (callback) {
    return window.requestAnimationFrame || window.webkitRequestAnimationFrame || window.mozRequestAnimationFrame || window.oRequestAnimationFrame || window.msRequestAnimaitonFrame ||
        function (callback) {
            window.setTimeout(callback, 20); //or 200 or 100 or 50 or...
        };
});

I found this tutorial

http://www.javascriptkit.com/javatutors/touchevents3.shtml

This is a different approach (the link is part 3, you will probably need to read parts 1 and 2 as well). Instead of picking up touchx and y from the event, you can pick up an array of the points passed through. This should give you the granularity you want.

Excellent tutorial, has great detail on touch event attributes

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM