4

これは、私がここで試してみたほうがいいと思った、処理フォーラム(これまでのところ回答がありません)で作成した投稿のコピーペーストです。

処理は、特にWebページのために、ものを描画するための非常にクールな方法です。参考としてhttp://processing.org

ねえ、私は処理に不慣れです、私はフラッシュレスのウェブサイトを作るためにそれを使っているので、私はほとんどキャンバスに描いています。

マウスの位置に問題がありますが、座標を描画するときは、左上隅を位置0,0と見なします。実際のマウス座標は、0,0をブラウザウィンドウの左上隅と見なします。

だから私の問題はこれです。ブラウザがサイズを変更するたびに、キャンバスは中央のWebページで動作し、キャンバス内のマウスの座標も変更されます。

キャンバスを基準にしてマウスの座標を作成する方法はありますか?ブラウザウィンドウのサイズを変更できるように、マウス座標の左上隅は常に0,0になりますか?

それが問題です、私はここでスタックオーバーフローで何人のpplがこれで経験されているかわかりませんが、誰かが私を助けてくれることを願っています:)

事前にスタックオーバーフローコミュニティに感謝します。

4

3 に答える 3

3

処理に詳しくないのですが、ブラウザウィンドウの左上隅とキャンバスの左上隅の差を計算することはできませんか?
すなわち(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 セレクターに置き換える必要があります。

また、window はグローバル オブジェクトであることに注意してください。ここでは、可能性のあるスコープの問題に対処するために使用します。

于 2009-01-31T13:10:02.250 に答える
-1

使用前に、ユーザーにシステムのキャリブレーションを依頼できます。質問に対する完全な回答ではなく、問題の解決策です。

画面中央の左上と右下に赤い点を描くだけです。それらをクリックして座標を取得するようユーザーに依頼します。次に、画面の隅がどこにあるかがわかります。

于 2009-01-31T13:08:15.327 に答える