Google Mapsに走行軌跡とウェイポイントを表示させる
[ GPS ] : Category
[ Google Maps, KML, TRK, trk2googlemapsl, カシミール3D, トラックログ, ワンダースワン, 走行軌跡 ] : Tag
掲示板に「グーグルマップにルート表示とウェイポイントの表示＋画像の貼り込み」の方法について質問があり、自分自身のまとめの為にも備忘録として方法を掲載します。
質問の元となったグーグルマップにルート表示とウェイポイントの表示＋ウェイポイント名+コメント+画像の貼り込みしたものは以下の地図。
高尾山登山ルート軌跡
上記のシンプルな地図の作成方法を以下の手順で説明していきます。
- ウェイポイントを作成
- カシミール3DでTRKファイル、WPTファイルを書き出し
- TRKファイル、WPTファイルをtrk2googlemaps ＆ kmlでKMLファイルに変換
- KMLファイルをテキストエディタで編集
- KMLファイルを自分のレンタルサーバー上にアップロードしGoogle Mapsにアクセス
1. ウェイポイントを作成（カシミール3D、GPS機器、テキストエディタで作成）
Waipointを作成する方法は大きく分けて3つの方法があります。
1-1. カシミール3Dでウェイポイントを作成
カシミール3Dの地図上でウェイポイントを作成したい所で右クリックすると上のメニューが出てくるので、新規作成>ウェイポイントを作成を選択します。
すると上のダイアログが出てくるので、「名前」にウェイポイント名を入れておきます。
1-2. GPS機器でツーリング途中にそのポイントをGPSに保存しておく
GPS機器とカシミール3Dを通信させ、カシミール3DにGPS機器に保存したウェイポイントをダウンロードしたものを使用します。
ダウンロードしたウェイポイントは上で新規作成したウェイポイントと扱いは同じですので、「名前」」にウェイポイント名が入っているか確認しておきましょう。
また日本語対応GPS機器を使っている場合「GPSでの名前」に日本語が入っているかもしれませんが（持っていないので分からない）、もしこの部分に日本語（2バイト文字）が入っていた場合、日本語以外（半角英数字、半角記号、半角カタカナ）を入力するか空欄にしておきましょう。
（trk2googlemaps ＆ kmlではここに日本語（2バイト文字）が入っていた場合エラーが発生し読み込めない為）
例：上の画像はポケナビミニからカシミール3Dにダウンロードしたウェイポイントの一つ。
自動で「名前」と「GPSでの名前」にウェイポイント名が入っています。
1-3. テキストエディタで作成
私はこの方法で行っています。
カシミール3Dで使用している書籍付属の地図ではウェイポイントを作成するには粗すぎるし、GPS機器では誤差があり何より私の使用しているポケナビミニはウェイポイント名が半角カタカナで文字数制限があるという問題がある為です。
ウェイポイントをテキストエディタで作成する場合、直接KMLファイルの形式に則って作成していきます。
そして後で説明するトラックログのKMLファイルにここで作成したデータをコピペしてやれば、一つのKMLファイルにトラックログとウェイポイントを含ませる事ができます。
最低限必要なウェイポイントを表示させるセットは以下の通り。<Placemark>の括り一つがウェイポイント一つになりますので、ウェイポイントを増やしていく場合、<Placemark>の括りを増やしていけばいいのです。
<Folder>
<name>ウェイポイント</name>
<Placemark>
<name>高尾山山頂西側</name>
<description><![CDATA[広場を西に移動すると富士山が展望できる。<br /><img src="http://photolife-sd10.hp.infoseek.co.jp/spot/photo/takaozan_santyou_nishi.jpg" width="240" height="360" />]]></description>
<Point>
<coordinates>139.24317955970764,35.624581960718366,0</coordinates>
</Point>
</Placemark>
</Folder>
各タグの説明
↑クリックすると大きい画像が見られます。
<name>ウェイポイント</name>
- Google Mapsではウェイポイントをまとめているフォルダの名前になります。
<name>高尾山山頂西側</name>
- Google Mapsではウェイポイント名になります。
<description><![CDATA[広場を西に移動すると富士山が展望できる。<br /><img src="http://photolife-sd10.hp.infoseek.co.jp/spot/photo/takaozan_santyou_nishi.jpg" width="240" height="360" />]]></description>
- Google Mapsではウェイポイントの吹き出し部になります。
<description><![CDATA[と]]></description>の間にコメント、画像のHTMLタグなどを記入します。<description>の中に<![CDATA[と]]>があるのは、<description>内でHTMLタグを使用するためです。<![CDATA[と]]>を使用することによって<と>を使って記述することができます。
もし<![CDATA[と]]>を使いたくないのであれば、<と>は<と>と記述しなくてはいけません。 <coordinates>139.24317955970764,35.624581960718366,0</coordinates>
- ウェイポイントの緯度経度と高度になります。
データは経度、緯度、高度の順番でそれぞれカンマ（ , ）で区切り、緯度経度はDEG形式（度分秒ではなくすべて度で表す）、高度はメートルで入力します。
緯度経度の調べ方ですが、私は自作した緯度経度チェックツールを使い、クリックした位置の緯度経度を調べています。
高度は0にしておけば地図の面に着いた状態になります。
一通り作成し終わったら3. TRKファイル、WPTファイルをtrk2googlemaps ＆ kmlでKMLファイルに変換で出力したKMLファイルにコピペします。
どこにコピペするかなどは4. KMLファイルをテキストエディタで編集で説明します。
2. カシミール3DでTRKファイル、WPTファイルを書き出し
カシミール3Dに読み込んだトラックログと、1-1または1-2で作成したウェイポイント(1-3でウェイポイントを作成している場合を除く)をtrk2googlemaps ＆ kmlが読み込めるTRKファイルおよびWPTファイルに書き出します。
トラックログやウェイポイントを書き出す場合、[編集]→[GPSデータの編集]でGPSデータエディタを開きトラックフォルダやウェイポイントフォルダをクリック、書き出したいファイルを選択した後、[ファイル]→[選択したGPSデータの書き出し]を選択し、「ファイルの種類」でトラックログなら「TRKファイル」、ウェイポイントなら「WPTファイル」を選択、「緯度経度形式」はどれでもかまいませんが、KMLファイルではDEGを使用しているので「DEG」を選択。
「保存するデータを次の測地系で統一する」を「WGS84」にして保存する。
3. TRKファイル、WPTファイルをtrk2googlemaps ＆ kmlでKMLファイルに変換
trk2googlemaps ＆ kmlを使ってGoogle Mapsで表示できるKML形式のファイルに変換します。
trk2googlemaps ＆ kmlはGPSデータをGoogle Mapsを使って表示させるために特化されたソフトウエアで、KML形式への変換の他にHTML書き出し機能を使って自分のHPにGoogle Mapsを表示させ走行軌跡などを表示させたり等、機能は沢山あります。
Etの趣味への扉 > GPSへの扉 > trk2goolemaps ＆ kml
以下のようにTRKファイルとWPTファイルをtrk2goolgemaps & kmlに追加します。(1-3でウェイポイントを作成している場合を除く)
ドラッグアンドドロップまたはトラックログタブでTRKファイルを追加します。
ドラッグアンドドロップまたはウェイポイントタブでWPTファイルを追加。(1-3でウェイポイントを作成している場合を除く)
次に「ウェイポイントの編集」ボタンを押して、ウェイポイント名などを編集していきます。
カシミール3Dでウェイポイントを作成した内容はtrk2googlemaps ＆ kmlでは上の画像のように反映されますのでウェイポイント名と一行説明を編集します。
上の画像のままtrk2googlemaps ＆ kmlでKMLファイルに出力した場合、このウェイポイント部は
<Folder>
<Placemark>
<name>_ </name>
<description>高尾山<br /><br />E139°14′36.60″<br />N35°37′30.61″<br />599m<br />東京都八王子市南浅川町<br /><br clear="all" /></description>
<vivibility>1</vivibility>
<Point>
<extrude>1</extrude>
<altitudeMode>clampedToGround</altitudeMode>
<coordinates>139.2435,35.62517,599</coordinates>
</Point>
</Placemark>
<Placemark>
<name>_ </name>
<description>清滝駅：高尾登山電<br /><br />E139°15′57.60″<br />N35°37′49.98″<br />225m<br />東京都八王子市高尾町<br /><br clear="all" /></description>
<vivibility>1</vivibility>
<Point>
<extrude>1</extrude>
<altitudeMode>clampedToGround</altitudeMode>
<coordinates>139.266,35.63055,225</coordinates>
</Point>
</Placemark>
<name>waypoints</name>
<description>ウェイポイント数：2箇所</description>
</Folder>
と出力され、Google Mapsのウェイポイントの吹き出し部に当たる<description> 内に一行説明、緯度経度高度、場所と「コメント」で入力した内容が表示されるようになっています。
この出力内容がデフォルトですので、もっとシンプルなデータにしたい場合は4. KMLファイルをテキストエディタで編集の説明を参照してください。
後で編集する場合<description>内を一度空にする都合上コメントを入れてあると編集が面倒になるので、コメント等はいれないでおき、後でテキストエディタで編集する時にコメントを入れます。
また<description>内を一度空にするとそのウェイポイントが何なのかの頼りはウェイポイント名だけになるので、trk2googlemaps ＆ kmlでウェイポイント名は必ず編集しておきます。
上の出力結果に <vivibility> とありますが、<visibility> の出力ミス（2008/5/6に作者に連絡済み）なのでこれは修正しておきます。
ただこれはウェイポイントの表示・非表示をコントロールするタグで、このタグがない場合標準で表示するようになっているので、そのままにしておいても問題なし。
trk2googlemaps ＆ kmlの下段に移りKMLファイル(Google Earth用表示形式)タブを選択し、Google Mapsで表示するときの設定をしてきます。
「線の接続の仕方」はトラックログが分かれている場合(カシミール3Dで複数のトラックログを選択してTRKファイルで書き出した場合がこれに当たる)に線をつなげるかどうかの設定で、時間が離れてログが記録されている場合遠くの線と線が直線でつながってしまうので、「グループ毎に分ける」にしておいた方が無難でしょう。
「ウェイポイントの編集」「線のスタイルを設定」「KMLに関する情報の設定」を設定し終えたら「出力(kml, kmz)ファイルを設定」でkmlファイル(テキストXML形式)を選択し、変換開始ボタンを押すとKMLファイルが出力されます。
kmzファイルでもGoogle Mapsで表示できますが、テキストエディタで編集できないので私はKMLファイルを選択しています。
4. KMLファイルをテキストエディタで編集
trk2googlemaps ＆ kmlによって出力されたKMLファイルを編集します。
trk2googlemaps ＆ kmlで出力したKMLファイルだけでも完成しているのですが、ここではサンプルのようにウェイポイントの吹き出し部をウェイポイント名＋コメント＋写真のみを表示させるシンプルなものにします。
また1-3でウェイポイントをテキストエディタで作成している場合、trk2googlemaps ＆ kmlで出力したKMLファイルにウェイポイントを追加する場所を説明します。
4-1. ウェイポイントの吹き出しをシンプルなものにする
trk2googlemaps ＆ kmlで出力したKMLファイルのウェイポイント部の吹き出し部は、一行説明、緯度経度、高度、場所が強制的に出力されています。
これを一度すべて消去してしまいます。
具体的には一つの<description>から</description>を選択した後、[検索]→[置換]を選択。
すると検索する文字列に選択する部分が入るので、<description>.*</description> に変更。
次に置き換える文字列を<description></description> もしくは<description></description>（）とします。
そして「選択領域のみ」「正規表現」にチェック。
ウェイポイント部分すべてを選択しなおして
置換を行います。
<description><![CDATA[ ]]></description>で置換した場合以下のようになります。
この場合、 HTMLタグがそのまま使用できるメリットがあります。もし<description></description>で置換した場合、 < と > はそれぞれ < と > に変更してHTMLタグを入れていかなくてはいけないので、見づらくて面倒です。（trk2googlemaps ＆ kmlはこの方法を使用していますが）
<Folder>
<Placemark>
<name>高尾山</name>
<description><![CDATA[]]></description>
<vivibility>1</vivibility>
<Point>
<extrude>1</extrude>
<altitudeMode>clampedToGround</altitudeMode>
<coordinates> 139.2434720, 35.6251670,599</coordinates>
</Point>
</Placemark>
<Placemark>
<name>清滝駅：高尾登山電鉄</name>
<description><![CDATA[]]></description>
<vivibility>1</vivibility>
<Point>
<extrude>1</extrude>
<altitudeMode>clampedToGround</altitudeMode>
<coordinates> 139.2659830, 35.6305500,225</coordinates>
</Point>
</Placemark>
<name>waypoints</name>
<description>ウェイポイント数：2箇所</description>
</Folder>
<description><![CDATA[ と ]]></description> の間にコメントと画像のURLを以下のように入力していきます。
サーバーに置いた画像を使う場合、そのサーバーが外部からの呼び出しに対応している必要があります。
fc2やninjaなど無料レンタルサーバーの多くはは対応していないので(infoseekのiswebライトはOK)、有料レンタルサーバーを使う必要があります。
<Folder>
<Placemark>
<name>高尾山</name>
<description><![CDATA[ここの頂上から富士山が見えます。<br />毎年冬至前後の16時～16時半にはダイヤモンド富士を見ることができます。<br /><img src="http://photolife-sd10.hp.infoseek.co.jp/spot/photo/takaozan_santyou_nishi.jpg" width="240" height="360" />]]></description>
<vivibility>1</vivibility>
<Point>
<extrude>1</extrude>
<altitudeMode>clampedToGround</altitudeMode>
<coordinates> 139.2434720, 35.6251670,599</coordinates>
</Point>
</Placemark>
<Placemark>
<name>清滝駅：高尾登山電鉄</name>
<description><![CDATA[高尾山の途中までこのケーブルカーで上っていける。<br />秋にはケーブルカーに乗りながら紅葉も楽しめる。<br /><a href="http://www.takaotozan.co.jp/">高尾登山電鉄HP<a><p><img src="http://photolife-sd10.hp.infoseek.co.jp/spot/photo/takaozan_cable.jpg" width="360" height="240" /></p>]]></description>
<vivibility>1</vivibility>
<Point>
<extrude>1</extrude>
<altitudeMode>clampedToGround</altitudeMode>
<coordinates> 139.2659830, 35.6305500,225</coordinates>
</Point>
</Placemark>
<name>waypoints</name>
<description>ウェイポイント数：2箇所</description>
</Folder>
4-2. テキストエディタで作成しておいたウェイポイントをKMLファイルにコピペする
1-3でウェイポイントをテキストエディタで作成している場合のtrk2googlemaps ＆ kmlで出力したKMLファイルにウェイポイントを追加する場所を説明します。
</Placemark>
<name>track log</name>
<description>2007/12/04 8:11～2007/12/04 10:38</description>
</Folder>
</Document>
</kml>
トラックログのみをtrk2googlemaps ＆ kmlで出力したKMLファイルのトラックログ部分の終わりは上のように </Folder> なので、</Folder> と </Document>の間に作っておいたウェイポイントを挿入します。
<Folder>
<name>ウェイポイント</name>
<Placemark>
<name>高尾山山頂西側</name>
<description><![CDATA[広場を西に移動すると富士山が展望できる。<br /><img src="http://photolife-sd10.hp.infoseek.co.jp/spot/photo/takaozan_santyou_nishi.jpg" width="240" height="360" />]]></description>
<Point>
<coordinates>139.24317955970764,35.624581960718366,0</coordinates>
</Point>
</Placemark>
<Placemark>
<name>清滝駅：高尾登山電鉄</name>
<description><![CDATA[高尾山の途中までこのケーブルカーで上っていける。<br />秋にはケーブルカーに乗りながら紅葉も楽しめる。<br /><a href="http://www.takaotozan.co.jp/">高尾登山電鉄HP<a><p><img src="http://photolife-sd10.hp.infoseek.co.jp/spot/photo/takaozan_cable.jpg" width="360" height="240" /></p>]]></description>
<Point>
<coordinates> 139.2659830, 35.6305500,0</coordinates>
</Point>
</Placemark>
</Folder>
上のようなウェイポイントを作成していた場合、以下のように挿入します。
</Placemark>
<name>track log</name>
<description>2007/12/04 8:11～2007/12/04 10:38</description>
</Folder>
<Folder>
<name>ウェイポイント</name>
<Placemark>
<name>高尾山山頂西側</name>
<description><![CDATA[広場を西に移動すると富士山が展望できる。<br /><img src="http://photolife-sd10.hp.infoseek.co.jp/spot/photo/takaozan_santyou_nishi.jpg" width="240" height="360" />]]></description>
<Point>
<coordinates>139.24317955970764,35.624581960718366,0</coordinates>
</Point>
</Placemark>
<Placemark>
<name>清滝駅：高尾登山電鉄</name>
<description><![CDATA[高尾山の途中までこのケーブルカーで上っていける。<br />秋にはケーブルカーに乗りながら紅葉も楽しめる。<br /><a href="http://www.takaotozan.co.jp/">高尾登山電鉄HP<a><p><img src="http://photolife-sd10.hp.infoseek.co.jp/spot/photo/takaozan_cable.jpg" width="360" height="240" /></p>]]></description>
<Point>
<coordinates> 139.2659830, 35.6305500,0</coordinates>
</Point>
</Placemark>
</Folder>
</Document>
</kml>
挿入したら文字コードをUTF8にして保存し、KMLファイルは完成。
5. KMLファイルを自分のレンタルサーバー上にアップロードしGoogle Mapsにアクセス
まず完成したKMLファイルを自分のレンタルサーバーにアップロードします。
その後「http://maps.google.co.jp/maps?q=」の後ろにサーバーにアップしたKMLファイルのURLを続けて、ブラウザのURL欄に入れてアクセスすると、Google Mapsにトラックログとウェイポイントが表示されます。
サーバーにアップしたKMLファイルのURLが
http://photolife-sd10.hp.infoseek.co.jp/spot/071204_takaozan_wpoint.kml
だったら、
http://maps.google.co.jp/maps?q=http://photolife-sd10.hp.infoseek.co.jp/
spot/071204_takaozan_wpoint.kml
とする。(文字が長いため改行しています。)
ちなみに今回作成したKMLファイルはGoogle Earthでも表示できます。
説明はだらだらと長くなってしまいましたが、一度順を追ってやってみると簡単な事が分かると思います。
また今回Google Mapsのウェイポイントの吹き出し部をシンプルなものにするためKMLファイルをテキストエディタでいじっていますが、先日作者に
「出力すると
と要望を出し次回検討するとの回答をいただいたので、もしかしたらテキストエディタでいじる必要がなくなるかもしれません。
関連リンク
関連記事
Posted by toku
トラックバック
このエントリーのトラックバックURL:
URL
