1. ホーム
  2. Web制作
  3. html5

html5 地図の現在位置の矢印の作り方の例

2022-01-14 15:01:59

機能ポイント

  • 現在の位置の取得
  • 現在のデバイスの向きを常時表示する

ハイライト

h5を開くたびに、単純に取得したデバイスの向きが正しく表示されない。これは、開くたびにマップ自体がデバイスの向きに影響されるためです。

そのため、コンパスの向きを再度取得して修正する必要があります。

アプレットがデバイス、コンパスの方向を取得し、h5が位置決め矢印をレンダリングする例を考えてみましょう。

関連する計算式

// The direction of the update arrow should be based on the difference between the device and compass directions
const newAngle = 360 - ( deviceAngle - compassAngle )

以上が今回の記事の内容ですが、皆様の学習の一助となり、スクリプトハウスをより一層応援していただければ幸いです。