FacebookからWordPressへ引っ越しで、並行して作業していた内容になります。
移行しようとしているFacebookの記事、
一番の目的は「日本の各地を自転車で走ったときの日記」
を別のサイトにまとめたいわけですが、
「自転車で走行したルートを日本地図に描いて、
それをクリックすると対応しているFacebookの記事ページに飛ぶ」ということを、
クリッカブルマップではなくFlashを使って作っていたようで、
それもWordPress移行時に実現してほしいとのことでした。
WordPressでも同様の機能を実現するにあたり
走行記録ごとに走行ラインをエディタで描きリンクを張る、
という面倒なことは避けたい。やりたくない。
なら、走行ルートのライン表示は、GarminのサイクルGPSのデータを使おう。
地図は、サイトに埋め込みやすいGoogleマップでどうだろう。
マイマップならGPXファイルをインポート可能だ。
記事リンク付きマップの作成手順
- GarminConnectからGPX形式でコースデータを出力
- Googleマイマップ「レイヤーを追加」「インポート」でGPXファイルをインポート
- 出発地と目的地は邪魔なため削除(ラインだけ残る)
- 「編集」で説明欄に投稿記事のURLを貼り付ける(自動でリンクになる)
- 必要なだけ1から4の繰り返し
- マイマップ「自分のサイトに埋め込む」でiframeのHTMLを生成
- WordPressの固定ページに生成したHTMLを埋め込む
とりあえず、作りこみの手間をかけずに実現する方法で、暫定的に良しと思った。
が、しばらくして問題に直面する。
GPXファイルは5MBが上限で、それを超えるファイルはインポートできない。
また、レイヤーは10個までで、1つの地図上に10コースまでとなる。
10個じゃ、ぜんぜん足りない。あと、5MB超えるのも結構ある。
他の方法を調べているうちに、あるサイトのプレゼンテーション資料を目にする。
Cesium?3D Mapping?こんなのが無料で使えるの?!しかも簡単そう。
それから、Cesiumを使って目的の機能を開発していくことになります。