Mac って何?それって美味しいの?

マイコンと呼ばれた時代から現在まで、使用記から何から何でも。

GarminサイクルGPSデータを地図上に表示してWordPress投稿とリンク(Googleマイマップ編)

 

yummac.hatenablog.jp

 

FacebookからWordPressへ引っ越しで、並行して作業していた内容になります。

移行しようとしているFacebookの記事、
一番の目的は「日本の各地を自転車で走ったときの日記」
を別のサイトにまとめたいわけですが、
「自転車で走行したルートを日本地図に描いて、
それをクリックすると対応しているFacebookの記事ページに飛ぶ」ということを、
クリッカブルマップではなくFlashを使って作っていたようで、
それもWordPress移行時に実現してほしいとのことでした。

WordPressでも同様の機能を実現するにあたり
走行記録ごとに走行ラインをエディタで描きリンクを張る、
という面倒なことは避けたい。やりたくない。

なら、走行ルートのライン表示は、GarminのサイクルGPSのデータを使おう。
地図は、サイトに埋め込みやすいGoogleマップでどうだろう。
マイマップならGPXファイルをインポート可能だ。

記事リンク付きマップの作成手順

  1. GarminConnectからGPX形式でコースデータを出力
  2. Googleマイマップ「レイヤーを追加」「インポート」でGPXファイルをインポート
  3. 出発地と目的地は邪魔なため削除(ラインだけ残る)
  4. 「編集」で説明欄に投稿記事のURLを貼り付ける(自動でリンクになる)
  5. 必要なだけ1から4の繰り返し
  6. マイマップ「自分のサイトに埋め込む」でiframeのHTMLを生成
  7. WordPressの固定ページに生成したHTMLを埋め込む

f:id:yummac:20201231190511p:plain

Googleマイマップ


とりあえず、作りこみの手間をかけずに実現する方法で、暫定的に良しと思った。
が、しばらくして問題に直面する。

GPXファイルは5MBが上限で、それを超えるファイルはインポートできない。
また、レイヤーは10個までで、1つの地図上に10コースまでとなる。

10個じゃ、ぜんぜん足りない。あと、5MB超えるのも結構ある。

他の方法を調べているうちに、あるサイトのプレゼンテーション資料を目にする。

Cesium?3D Mapping?こんなのが無料で使えるの?!しかも簡単そう。

それから、Cesiumを使って目的の機能を開発していくことになります。 

yummac.hatenablog.jp