スポンサーリンク

GPSロガーのデータと写真をブログに掲載する

スポンサーリンク
スポンサーリンク

GPSロガーのデータとデジカメ写真をブログにアップする方法について書いてみます。

最近のツーリングや旅行のブログ等を見ると、回ったルートの軌跡を表示したり、さらに撮影した場所に写真をリンクさせたサイトをよく見かけます。

地図を表示するだけなら、下のように自分のPCで表示した地図を「画面キャプチャ」したものを貼り付けても出来ます。

【事例1 地図だけを「画像」として表示した例】

wadachi00.jpg

でもこれだけだと、地図の縮尺を変えてもっと詳しく見たり、あるいは写真とリンクさせる事は出来ません。

出来ればネットにあるGoogleMapにリンクさせて、地図を拡大したり画面上の撮影ポイントをクリックして写真が見られればもっと便利ですよね。

それを実現した例がこちらです。 ↓

【事例2 GoogleMapにリンクして、写真の撮影場所も表示した例】

 (※ 下の地図を左クリックしながらドラッグして見える範囲を動かしたり、左上の「+」「-」のクリックや、マウスのホイールを回転させて地図の縮尺を拡大・縮小する事が出来ます。 またルート上にある赤いマーカーはデジカメで撮影した場所を示していてクリックすると小さな写真を表示できます)



 

ここでは、お問い合わせの多かったGPSロガーを使った軌跡表示とデジカメ写真を同期させて、地図上に表示したGoogleマップをブログやホームページにアップする方法を紹介します。

使うGPSロガーは、私のi-gotUだけでなく他の機種や一部のバイクナビや携帯でも、走行軌跡ログが出力できれば同じような作業で公開できると思います。

使うソフトはいくつかの方法があると思いますが、ここでソフトを持っていない方でもタダで入手出来るフリーソフトの中から「轍」というものを利用した方法を紹介しています。

■準備編(1)

・GPSによる走行軌跡データの出力
 ・・・ ファイル形式はいろいろあり、相互に変換できるものもありますが、ここでは一般的なGPXファイル(*.gpx)を中心に解説します。

・撮影したデジカメ写真
 ・・・ 必ず撮影日付、時刻を合わせておいてください。
    あとでGPSデータで修正もできますが、出来ればカメラの内蔵時計の時刻を電波時計等で合わせておいた方があとの作業が楽です。

・フリーソフト「轍 Wadachi」を取得しておいてください。
 ・・・ 轍は「サイクル紀行」というサイトに掲載されているソフトで、これだけでGoogleマップに連動させた写真付図を作成する事ができます。

   サイトの左側「メインメニュー」の「ダウンロード」からから「カテゴリ:ソフトウェア 轍 Wadachi」の最新版を落すことができます。
   ファイルはzip形式ですので解凍して適当なディレクトリーに保存しておきます。
   「wadachi.exe」でソフトが起動します。

・Google Maps API キーを取得しておきます。
 ・・・ 自分のブログやwebサイトにGoogle Maps を掲載するにはここに登録して「API キー」というのを取得しておく必要があります(無料)
    まずGoogle アカウントを取得し、次に「Google MAPS API に登録する」から、利用規約の同意をチェックして、アップしたい自分のサイトのurlを入力して「API キーを生成」をクリックすると、
    「Thank You for Signing Up for a Google Maps API Key!」 と表示され
    「Your key is:」に続けて、
       「ABQIAAAA******************************************************************************」
    といった長いキーが表示されます。
    これをメモ帳などにコピーして保存しておきます。
    注)イントラネットや非公開サイト(会員限定サイト、SNSはどうなんでしょう?)に掲載する場合は、Google Maps API Premierへの登録が必要です。

■準備編(2)

・これで作業を始められますが、その前に走行軌跡ログをチェックします。

 GPSロガーを起動し、終了した場所はどこでしょうか?

 もし自宅だと、ネットの上に自宅の位置を公開してしまう事になってしまいます。

 それは困りますので不要な軌跡ログを削除します。

 この作業は、GPSロガーに付属の「@trip PC」を使います。
 (他の機種をお使いの方はご自分のソフトを確認してください)

 「@trip PC」を立ち上げたら「ウイザードをインポートする」から「ファイルからデータをインポートする(*.gpx,*.gpx)でgpxデータを選び、通常どおりマップを作成します。

wadachi01.jpg

 データを右クリックして「編集」メニューを選びます。

wadachi02.jpg

 「ウェイポイント」のタグを選び、地図をみながら、削除したい部分のデータを選択して(青くなる)、「選択したウェイポイントを除去する」で削除します。

wadachi03.jpg

 同様にしてスタート地点、終了地点を修正します。

 出来たデータを保存します。

wadachi04.jpg

 データを「GPXにエクスポートする」で、任意の場所に保存しておきます。

 これでデータが揃いました。

■轍によるおおまかな作業の流れ

  1. 轍に軌跡データを読み込ませる

  2. 写真データを追加する

  3. 写真の撮影場所をウェイポイントとして自動登録(地図とマッチング)する

  4. 出力したい項目・表・データを選ぶ

  5. データをhtmlで保存する

 そして、ブログ等にアップするには、

  6. そのhtmlファイルと縮小(サムネイル化)されたフォルダーをサイトにアップする

  7. 表示したい記事の中に、<frame>形式で埋め込む

以上のようになります。

■轍による作業

1. 轍に軌跡データを読み込ませる

  轍を起動し、「メニュー」の「ファイル」から「インポート」で表示したい軌跡(上の、スタート・終了を修正したログデータ)を選びます。

wadachi05.jpg

  ここでは*.gpx以外にも、
     GPXファイル(*.gpx)
     ウェイポイントファイル(*.wpt)
     ルートファイル(*.rte)
     トラックファイル(*.trk)
     NMEAファイル(*.log *.rmc *.gps *.nme *.nmea)
  をインポートする事が出来ます。

2. 写真データを追加する

  「画像」タブから「画像追加…」から、写真のあるフォルダーを探し、取込みたい写真を選択します。

wadachi06.jpg

3. 写真の撮影場所をウェイポイントとして自動登録(地図とマッチング)する

  ここで「ウェイポイント自動作成」をクリックすれば地図に取込まれます。

  出来たら「ウェイポイント」タグをクリックしてみるとちゃんと登録されているのがわかります。

wadachi07.jpg

  では実際にマップで見てみましょう。

  右上の「マッププレビュー」をクリックします。

wadachi08.jpg

wadachi09.jpg

  一見、ちゃんと出来ていそうですが、拡大して見てみます。

wadachi10.jpg

  実はこの「画像4」というダム名の書かれた岩の前でハーレーを撮った写真ですが、地図の上では「龍泉寺」と交差点の間で撮影したように赤いポイント表示が出ていますが、実際に撮影したのはそこではなくてもっと左の「有間ダム」の角のところで撮影したものです。

  なぜこんな事が起きてしまうのでしょうか。

  それはデジカメ本体の内蔵時計が正確なら問題ないのですが、数秒から数分程度のズレがあるからなのです。

  歩きながら撮影したデータ(数秒程度では位置の変化が少ない場合です)とかなら特に大きな問題にはならないのですが、バイクや自動車で走りながら撮影した写真だと、実際に撮影した場所と地図上で表示される場所が大きくズレてしまう事があります。

  例えば交差点に入る前に撮影したのにそのはるか手前やずっと先で撮影したようになってたり、登山のとき、山頂で撮った筈なのにまだその一歩手前!なんて事が起きてしまいます。

  でもこれもちゃんと修正する事が出来るのです。

  それをやってくれるのが「画像」タブにある右上の「カメラの時刻補正」です。

wadachi11.jpg

  ここの数字を+や?、それにずらしたい時間分だけ写真の表示をずらす事ができます。

  どれくらいズラしたらいいかは、作成した「ウェイポイント」をすべて削除し、すこしずつ数字を変えてその都度新たに「ウェイポイントの自動作成」「マッププレビュー」で確認します。

  今回は、「? 1分 7秒」のズレでした。

  修正した結果がこちらです。 ちゃんと撮影場所と一致しました。

wadachi12.jpg

  次に写真に表示する説明分を修正します。

  今のままですと「画像1」「画像2」なので場所の名前もわかりませんし、説明にもなっていません。

  「ウェイポイント」タブの中の修正したい画像をクリックします。

  「ウェイポイントの編集」画面が開きます。

  ここで地点名や説明分を入力します。

wadachi13.jpg

4. 出力したい項目・表・データを選ぶ

  「出力設定」タブで、表示する項目を選びます。

wadachi14.jpg

  ここの設定を変えると出力される内容が変わります。

  いろいろ試してみて好きな項目を表示させてください。

  「マッププレビュー」で確認できます。

  デフォルトの設定に「表題」だけ入れるとこんな感じです。

wadachi15.jpg

  参考までに私の設定はこんな感じの、非常にシンプルなものにしています。

wadachi16.jpg

  「APIキー」欄には必ず最初に取得した長いキーを入力しておいてください。

5. データをhtmlで保存する

  htmlデータを作成します。

  メニューの「ファイル」「エクスポート」と選び、「Google Maps HTML…」を選びます。

wadachi17.jpg

  適当な名前を付けて保存します。(ここでは「20100nagurichichibu」)

  そうすると「20100nagurichichibu.html」というファイルと、「20100nagurichichibu_files」という名前のフォルダーが出来ています。

  試しにこの「20100nagurichichibu.html」をダブルクリックすると、ブラウザが立ち上がり、サムネイル写真のリンクされたGoogle マップを見ることが出来ます。

6. htmlファイルと縮小(サムネイル化)されたフォルダーをサイトにアップする

  作成したデータを自分のサイトで表示出来るようにします。

  ブログソフトやFTPソフトを使って、さっきの「20100nagurichichibu.html」というファイルと「20100nagurichichibu_files」を同じデレクトリーにアップします。

  私はブログのディレクトリーの中の「archives」に「maps」というディレクトリーを作ってここに保存しています。

7. 表示したい記事の中に、<frame>形式で埋め込む

  ブログやwebサイトの記事の中にさらにhtmlを埋め込むには、表示したいところに、

<iframe src=”http://biketoshumi.chips.jp/wp/wpcontent/maps/201007nagurichichibu.html” width=”560″ height=”500″ scrolling=”no” frameborder=”0″></iframe>

これですべてOKです。

文章にすると長くなりますが、この通りに一度やってみれば誰にでも出来ますよ。

 

 【関連記事】
   ※ このブログの「GPSロガー」に関連する記事は、 コチラ です。

 

 ※ 走行ルートを記録するなら「GPSロガー」がお勧めです。
 ※ バイクでの走行動画なら「GoPro HD HERO」がお勧めです
 ※ 仲間やタンデムツーリングでの会話なら高音質の「SENAインカム」がお勧めです

   

 

コメント

  1. cancon さんヘ、
    私も自分でわかる内容でしたらお答えするのですが、
    今回のような内容だと、
    残念ながら私の手には負えないようでした。
    掲示板にご質問される際には、
    cancon さんの使われているプロバイダや
    OS、轍のバージョン等も書かれた方が
    回答を得やすいかもしれません。
    ちなみに轍のソフトの中にも、
    >以前のバージョンではブログ埋め込み用のテンプレートを添付していましたが、
    >管理が面倒なのでver.3.40から廃止しました。
    >Google MapsはJavaScriptを多用していますので、
    >ブログに埋め込むのは一般的に困難です。
    >またすべてのブログに埋め込めるわけではなく、
    >制約上できない場合もあります。
    >インラインフレームを利用して擬似的に埋め込むことは可能なのですが、
    >HTMLやCSSの知識が最低限必要です。
    >いずれにせよブログに埋め込むのは非常に面倒なので、
    >手軽にやりたい方はGoogleのマイマップや
    >LatLongLabを利用されることをおすすめします。
    >どうしてもやりたいという方は以下の説明にしたがって
    >自力でテンプレートを作成して下さい。
    >個別の質問は受け付けません。
    とありますね。

  2. お手数お掛けしまして、申し訳ありませんでした。
    メカ好きおじさんさんに質問をした後に、
    掲示板を見つけましたもので・・・m(__)m

    色々調べると、ブログにアップする段階でも、
    自分には難しそうです・・・

  3. cancon さんへ、
    私も一ユーザとしてこのソフトを
    使わせていただいているだけですので、
    詳細はわからない事が多いのです。
    ご質問いただいてから、
    いろいろ調べてみたのですが、
    同様の症例も見当たらず、
    解決策をご提案出来ません。
    cancon さんご自身が、
    轍の作者さんのサイトのサポート掲示板に
    同じ質問をされていらっしゃたので、
    作者の方からのご回答を待たれるのがいいかと思います。

  4. はじめまして。こんにちは。
    canconと申します。
    やっと、自分のしたい事をしている方を探せました。

    早速ですが、轍の使い方についてご教授下さい。

    写真を読み込んで、ウェイポイントの登録まで出来たのですが、
    マッププレビューをクリックすると、
    ①「スタイルシートのテンプレートが見つかりません。」
    ②「JavaScriptのテンプレートが見つかりません。」
    ③「テンプレートファイルが見つかりません。」
    と、三つのエラーが出てきてしまいます。

    お手数ですが、対処法を教えて頂きたいのですが。
    よろしくお願い致します。

  5. このメールをご覧になられている方々、こんにちは。

    我々はこのレビューへ、御社又はあなたを招待し、内容をご確認頂きたいと思っております。
    まずは当社最新のリリースイノベーション: i-gotU GT-600 GPS Data Logger w/ モーションセンサー, そのレベル(等級)の中では一番効率が良い。.これは小型で軽量、GPSデータロガーユニットやモーションセンサーを内蔵しており、防水処理もしておりますので、雨や水滴にも強くなっております。

    GT-600が特別な訳は?それはモーションセンサーを搭載している所です!!

    長期の旅行などに、多くのGPSロガーデータを長時間記録可能。
    それともあなたは頻繁にバッテリーを充電と変換しないと思いませんでしょうか?

    GT-600の区別革命のmotion detectionにより、あなたの動きを検出し、ログは自動的にログ記録をアクティブ状態へ変更します。また、しばらく動かずに静止していれば自動的にスリープモードへ移行し、賢く節電やメモリーを節約致します。

     一人旅や、サイクリング、ハイキング又は任意の行動中に休息を取りたい時などに自動的にログ記録を停止します。
    また、再度動きを検知すると、自動的にログ記録を開始します。

    Gt-600はバッテリーが80時間ほともち (15秒のログ記録設定にて)、1日6時間の活動であれば2週間ほど動作する計算となります。.

    また、GT-600はフラッシュメモリーを64MB搭載する事により最高262000のポイントを記録する事ができ、何週?何ヶ月に及ぶ旅行の履歴でさえも確実に記録致します。
    全てのi-gotU製品と同じ様にGT-600はマッピングプログラム(@tripPC)にて動作する事が使用やすいです。
    それにより、旅行ルートやデータをすばやくダウンロード可能となり、生き生きとしたデータがGoogle Maps又は3D Google アースにて見る事ができます。

    @tripPC上の新機能Poto Locatorを活用する事により、1分で何百もの写真の上に, 地理データとタグを付けや追加する事ができます。

    Photo Locatorは撮影者が大きく写真コレクションを編集したり、管理する時間を短縮出来る様に設計されております。

    “Where I Am” と “Sports Analyzer”と言う、さらに二つの強力なプログラムが提供されております。
    “Where I Am” はGoogle Maps, Yahoo! Maps やBing Mapsとリンクさせる事により、あなたのノートPC等に現在の位置情報をダイレクトに照合する事が可能となっております。

    “Sports Analyzer” はカレンダーレビューとして使用する事ができ、トレーニングの経過を追う事によってあなたの目標達成を助ける事が可能です。そしてそのルートの統計分析や役に立つチャートをGoogle Mapsに表示させる事が可能となっております。

    GT-600はあなたが辿った経路を楽しく画的な方法で表示致します
    i-gotU GT-600 GPS Data Loggerはコンピュータ チャルツアーがあった旅程とか、屋外活動のために、ツアーの指導になられていました。

    あなたの休暇中に、君の旅行のアルバム管理用にこの製品や機能をお役立てできます。。
    または、日常生活をより良く過ごす為にお役立てできます。.

    あなたが旅行中に発見した特別な場所やキャンプに適した場所をi-gotU GT-600にタグ付けにて記録させる事により、その場所までの経路とか、その場所はどこでとか、を覚えできまして、

    可能性は無限にあり、今現在でも色々な方々がi-gotU GT-600の新たな楽しい活用方法を見つけ出しています。
    もし、あなたがi-gotU GT-600レビューについて興味がある、お書き頂ける可能性があるのならば、私たちへ折り返し連絡を頂ければと思います。

    あなたよりのご連絡を今か今かと楽しみにお待ち致しております。

    これからも、よろしくお願いします。

    Kelly

    Mobile Action Technology Inc.
    Tel: 886-2-8913-1666
    Fax: 886-2-8913-1667
    Email: kellylee@mobileaction.com
    http://www.mobileaction.com

  6. KENT☆彡さんへ、
    GPSロガー、便利でオモシロイですよ。。。フフフ!
    なんて煽っちゃいました。
    でもツーリングで使うと、それだけ楽しめますよ。

    57歳のリターンライダーさんへ、
    そうですか、そこまで出来ていて、
    結局ダメでしたか。
    調べてみたら、gooブログは、「iframe」タグが
    使えないみたいですね。
    という事はブログの中への埋め込みが出来ないのですね。
    そうすると、例えばブログには、アイコンとかバナーにして、
    リンク先に、あの***.htmlを指定してみては
    いかがでしょうか。
    もっとスマートな方法があればいいのですが。

  7. 早速、詳細な解説ありがとうございます。

    @tripPC 轍 と解説の通りにやっていきますと、google mapに軌跡や写真データをリンクして貼りつけるところまではできるのですが、blog(goo)に埋め込みができません。
    gooのサポートセンターに問い合わせると「タグ」を送ってください…というので
    メールで送ると…このタグは使えません…今後の改良の参考にします…との返事でした。なかなか専門的な細かいところは解らない自分に情けないやら…
    まあーもう少し、色々とテストしてみたいと思ってます。

  8. や、やばいGPSロガー欲しくなってきた^^;
    ってか、以前から欲しいとは思ってたんですが。。。

    いずれ買ったら、参考にさせていただきます

タイトルとURLをコピーしました