Как установить скорость обновления mousemove?

im генерирует функцию, где ему необходимо установить легкую и быструю подпись. Я пишу подпись в поле холста. Я использую jQuery для него, но частота обновления координат mousemove не достаточно быстра. Что происходит, так это то, что если вы быстро напишите свою подпись, вы увидите белые пробелы между поданными пикселями.

Как установить скорость обновления mousemove быстрее?

$("#xx").mousemove(function(e){

    ctx.fillRect(e.pageX - size, e.pageY - size, size, size);

    $("#pagex").html(e.pageX - size);
    $("#pagey").html(e.pageY - size);

}

Ответы

Ответ 1

Вы не можете. События mousemove генерируются браузером, поэтому вы получаете их так же быстро, как их генерирует браузер.

Браузер не обязан генерировать события с любой заданной скоростью (либо перемещенными пикселями, либо по истечении времени): если вы быстро перемещаете мышь, вы увидите, что сообщается о "скачке" в координатах, поскольку браузер сообщает, что "мышь переехала, и теперь она здесь", а не "... и прошла через эти пиксели". Фактически, браузер на медленном компьютере может генерировать меньше событий mousemove, чтобы страница не замедляла сканирование.

Что вы можете сделать, так это подключить последовательные позиции из событий mousemove с прямой линией - это, очевидно, не даст вам больше точности, но это может уменьшить влияние.

Ответ 2

Вам нужно сделать ваш обработчик быстрее.

Браузеры могут отбрасывать события, если обработчик для этого события все еще работает, поэтому вам нужно выйти из обработчика mousemove как можно скорее. Вы можете попытаться оптимизировать код там или отложить работу до завершения движения мыши. Рисование, вероятно, самое медленное, что вы делаете, поэтому вы можете хранить движения мыши в памяти и рисовать позже. Это не обновляло бы дисплей до завершения рисования, но в противном случае он работал бы лучше.

Ответ 3

Вы можете запустить собственное событие на основе таймера, возможно, плохую идею, но лучше, чем ничего, если вам это действительно нужно.

Ответ 4

Я бы предложил (усиление ответа @river):

В обработчике событий mousemove просто сохраняйте те точки мыши, которые перемещаются в некоторый буфер (массив), поэтому ваш обработчик событий будет как можно быстрее
создайте свою другую функцию, которая будет считывать эти точки из буфера и нарисовать ее на холсте как lineTo() → lineTo() → lineTo(), чтобы все точки были подключены, между ними не было пробелов.
назначьте эту функцию рисования в setInterval(), чтобы рисунок вашей подписи не дождался, пока пользователь закончит "рисование", но будет рисовать эту подпись с некоторой небольшой задержкой после движения пальцев пользователя.