Абсолютные позиции мыши при обработке

Question

Это копия поста, который я сделал на форуме по обработке (где я до сих пор не получил ответа) подумал, что я мог бы попробовать здесь.

Обработка - это очень крутой способ рисовать вещи, особенно для веб-страниц. Просто в качестве ссылки http://processing.org/

Эй, я новичок в обработке, я использую его для создания сайта без флеш-памяти, так что я в значительной степени рисую на холсте.

У меня проблема с позицией мыши, хотя координаты при рисовании считают верхний левый угол позицией 0,0; фактические координаты мыши считают 0,0 верхним левым углом окна браузера.

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

Есть ли способ сделать координаты мыши относительно холста? Чтобы я мог изменить размер окна моего браузера, а верхний левый угол всегда будет 0,0 для координат мыши?

Так что это проблема, я не знаю, сколько людей здесь в stackru испытывают с этим, но я надеюсь, что кто-то может мне помочь:)

благодаря сообществу переполнения стека заранее.

Answer 1

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

$(window).onresize = function() {
 //offset return position realive to the document.
 var offset = $('#canvas').offset();
 window.canvasLeft = offset.left;
 window.canvasTop = offset.top;
}

Тогда вы можете сделать что-то вроде:

 relativeMouseLeftPosition = mouseLeftPosition() - window.canvasLeft;

Вы должны заменить #canvas селектором css для вашей области холста.

Также обратите внимание, что окно является глобальным объектом, я использую его здесь для решения возможных проблем области видимости.

Answer 2

Обработка действительно не предназначена для создания веб-страниц. Это хуже, чем Flash для сайтов (обработка эскизов - это Java-апплеты - Java менее распространена, гораздо более ресурсоемка и медленна для загрузки...)

Тем не менее, существует processing.js, порт обработки Javascript.

Пример со змеей обращается к мыши. Так как это Javascript, а холст - это divкоординаты должны быть немного более нормальными, чем Java (которая живет в своем собственном мире виртуальных машин), но я могу ошибаться..

Answer 3

Вы можете попросить пользователя откалибровать систему перед использованием. Это не полностью ответ на вопрос, но решение проблемы.

Просто нарисуйте красную точку в центре экрана, вверху слева и внизу справа. Попросите пользователя нажать на них и получить координаты. Затем вы знаете, где находятся углы экрана.