Rato absoluta Posições sobre Processamento

Question

Esta é uma cópia colar de um post que fiz sobre o fórum de processamento (onde eu não tenho uma resposta até agora) pensei que eu poderia muito bem tentar aqui.

O processamento é uma maneira muito legal para desenhar coisas, especialmente para as páginas da web. Assim como uma referência http://processing.org

Ei, eu sou novo para o processamento, eu estou usando-o para fazer um site sem Flash, então eu estou praticamente desenho em uma tela.

Eu estou tendo um problema com a posição do mouse, embora as coordenadas, ao desenhar, considere o canto superior esquerdo para ser posição 0,0; as coordenadas reais do rato considerar a 0,0 a ser o no canto superior esquerdo da janela do navegador.

Então, meu problema é este, a tela está operando em uma página web centrada, sempre que o navegador muda de tamanho, o mesmo acontece com as coordenadas do mouse dentro da tela.

Existe alguma maneira de fazer as coordenadas do mouse em relação à tela? Para que eu possa alterar o tamanho da janela do meu navegador e no canto superior esquerdo será sempre 0,0 para as coordenadas do mouse?

Então esse é o problema, eu não sei quantos ppl aqui em stackoverflow tem experiência com isso, mas espero que alguém poderia me ajudar:)

graças à comunidade de estouro de pilha de antecedência.

Answer 1

Eu não estou familiarizado com o processamento, mas você não pode simplesmente calcular a diferença entre o canto esquerdo superior da janela do navegador e no canto superior esquerdo da tela?
isto é, (usando jquery)

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

Em seguida, você pode fazer algo como:

 relativeMouseLeftPosition = mouseLeftPosition() - window.canvasLeft;

Você deve substituir #canvas com um seletor CSS para a sua área de lona.

Além disso, observe que a janela é o objeto global, eu usá-lo aqui para lidar com possíveis problemas de escopo.

Answer 2

Processamento realmente não se destina para a criação de páginas web .. É de pior que o Flash para sites (processamento de esboços sendo applets Java - Java sendo menos comum, muito mais recursos e lento para carregar .. )

Dito isto, não é Processing.js , uma porta Javascript de Processamento.

O exemplo cobra acessa o mouse. Uma vez que é Javascript, ea tela é uma div, as coordenadas devem ser um pouco mais são do que Java (que vive em seu próprio mundo VM), mas posso estar errado ..

Answer 3

Você pode perguntar ao usuário para calibrar o sistema, antes do uso. Não é totalmente uma resposta para a pergunta, mas um sollution para o problema.

Basta desenhar um ponto vermelho no centro da tela, superior esquerdo e bottem direita. Peça ao usuário a clicar sobre eles, e recuperar as coordenadas. Então, você sabe onde os cantos da tela é.