2012-03-06 18 views
22

私はHTML5キャンバスをテストし、Javascriptを使用してタッチ対応デバイスを描画しています。 iOSデバイスで動作させている間に、Androidで動作させることはできません。私はevent.pageXに座標を返さず、代わりに0を返すか、または(ブラウザに基づいて)未定義に絞り込んだ。AndroidデバイスのJavascriptでtoucheventの座標を取得できません

私はOpera MobileとDolphinブラウザのCyanogen 7.1を実行している携帯電話で、また標準ブラウザを実行しているGalaxy Tab 10.1(Android 3.1)でもテストしました。

event.pageX、event.layerX、event.clientX座標を表示するタッチスタートイベントでアラートを表示するようにコードを変更しました(clientXはiOSでのみ動作するはずです)。

canvas.addEventListener('touchstart', function(e) { 
if (readyToDraw){ 
    alert("PageX: "+e.pageX+","+e.pageY+"\n LayerX: "+e.layerX+","+e.layerY+"\n + clientX: "+e.clientX+","+e.clientY); 
    // prevent the browsers default action! 
    e.preventDefault(); 
    paint = true; 
    // Get coordinates 
    var c = getCoords(e); 
    addClick(c.x, c.y, false); 
} 
}); 

私はiOSで作業している完全な図を持っていますが、座標を登録するためにAndroidを取得することさえできません。

最終編集:私は問題を解決しました、受け入れられた答えを見てください。

+0

[this](http://stackoverflow.com/questions/6099268/does-html5-support-touch-on-mobile-phones)を参照してください。まだそれを動作させることができない場合、私はphoneGapが動作すると思います。 – toto2

+0

ありがとう、これは私を助けてくれました! –

+0

@Stuいいですね。この質問が「未回答の質問」タブから離れるように、あなたの編集から答えを出すことができますか? :)ありがとう! –

答えて

27

最終編集:もし誰かがこれを見つけて、イベント内でタッチアレイにアクセスするのに必要な同様の問題がある場合、私はそれを稼働させました。そして(マルチタッチではなく)配列のうち、以下のように、あるいはそれが正確でない場合は、あなたがそれを相殺する必要がある場合があります

var touch = event.touches[0]; 
var x = touch.pageX; 
var y = touch.pageY; 
// or taking offset into consideration 
var x_2 = touch.pageX - canvas.offsetLeft; 
var y_2 = touch.pageY - canvas.offsetTop; 
+0

聖なるくそ私は私の髪を引っ張っていた。ありがとう – user151496

+1

ここで終わるjQueryユーザーには、代わりに 'event.originalEvent.touches [0]'を使用してください... – Shikkediel

+0

あなたは私の人生を救った。私はコードバのアプリで何時間もエラーを見つけようとしました。最後に、すべてのプラットフォームでリリースすることができます。 – kaiserkiwi

関連する問題