Положение мыши с учетом Windows 10 глобального масштабирования - PullRequest
0 голосов
/ 19 января 2020

На моей веб-странице используется событие mousemove и его свойства clientX и clientY. Он работает как задумано, и я нормализую координаты следующим образом:

    MousePos.x = ((event.clientX- Renderer.domElement.offsetLeft) / Renderer.domElement.width) * 2 - 1;
    MousePos.y = -((event.clientY - Renderer.domElement.offsetTop) / Renderer.domElement.height) * 2 + 1;  

Он работает, как задумано, и теперь x и y находятся в диапазоне от -1 до 1 вместо 0 до width / height.

Проблема возникает, когда машина имеет глобальное масштабирование; Windows 10 имеет такую ​​возможность. Допустим, мой экран имеет ширину 1920 пикселей, а масштабирование установлено на 100% (без глобального масштабирования), тогда максимальное значение event.clientX будет равно 1920. Если масштабирование является каким-то другим значением, оно не будет шириной экрана в его максимальное значение, которое не даст мне 1 значение, а нормализованное положение мыши будет неправильным.

Поэтому мой вопрос: как учитывать глобальное масштабирование windows 10?

Если бы я мог прочитать это значение, я мог бы исправить свое положение мыши следующим образом:

    let scale = 1.25;
MousePos.x = ((event.clientX * scale - Renderer.domElement.offsetLeft) / Renderer.domElement.width) * 2 - 1;
MousePos.y = -((event.clientY * scale - Renderer.domElement.offsetTop) / Renderer.domElement.height) * 2 + 1;  

Но мне интересно, есть ли лучшее решение.

1 Ответ

0 голосов
/ 19 января 2020

Очевидно, domElement обладает другим свойством: clientWidth (или высотой), которое следует использовать для нормализации.

Следующие функции работают как предполагалось:

    MousePos.x = ((event.clientX - Renderer.domElement.offsetLeft) / Renderer.domElement.clientWidth) * 2 - 1;
MousePos.y = -((event.clientY - Renderer.domElement.offsetTop) / Renderer.domElement.clientHeight) * 2 + 1; 
...