ビューポート全体をどのように回転させるには？

私は、「画面回転」機能を必要とするタッチスクリーン用のWebアプリケーションを作成しています。 CSS変換を使ってすべてを回転させるのは簡単ですし、ほとんどのページで動作します。問題は、マウスイベントを使用するMapboxのようなプラグインがあり、イベントの位置がビューポートに相対的である場合です。たとえば、<body>を180度回転させて、ブラウザの右下にある地図の左上をクリックすると、マップボックスは地図の右下をクリックしたと考えられます。ドラッグするのと同じように、地図を反対方向に移動したばかりです。ビューポート全体をどのように回転させるには？

すべてのマウスイベントを含め、ページ全体を回転するより良い方法はありますか？または、回転に基づいてマウスイベントの座標を自動的に置き換えるように回避する方法がありますか？

出典

2016-10-21 J. Lu

モバイルの場合は、おそらくウェブビュー自体を回転しようとしているのでしょう。実際のブラウザウィンドウを回転させると、すべてが相対的なままになります。 –

いいえ、携帯電話ではありません。これは巨大なWindowsタッチスクリーンです。 –

問題がマップボックスライブラリにある可能性があります。それを確認しなければならない。 leaftlet.js（http://leafletjs.com/）やopenlayers（http://openlayers.org/）でも同じことを試してください。あなたが問題に直面しないことを願っています。 –

上記のPamblamの示唆するように、Web表示自体を回転することをお勧めします。 GL JS（ほとんどのJavascriptライブラリと同様）は、CSS変換のための入力にマップするようには設計されていません。

出典

2016-10-24 17:51:41

ありがとうございます。私はアプリ全体をiframeに入れて、ブラウザで回転させることができました。 –

ビューポート全体をどのように回転させるには？

答えて

関連する問題