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

Question

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

Как можно быстрее установить скорость обновления перемещения мыши?

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

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

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

}

Answer 1

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

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

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

Answer 2

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

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

Answer 3

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

Answer 4

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

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