スポンサーリンク

gooブログでGoogleマップのgpsルートを記載する

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

私の、バイクでのツーリングや旅行の際に欠かせないアイテムとなったGPSロガー。

これで得られたツーリングや旅行中のルートや写真の撮影場所の地図上へのマークをブログで表現する事がもう普通の事としてやってきました。

ブログの上では上記のように表示されます。

過去にも私のやり方について書いた記事があります。

ただその時にもコメントをいただいた方やリンクを張っていただいた方から、「書いてあるとおりやってみたけど、自分のブログではリンクが張れなくて、地図が表示出来ません」というご意見をいただきました。

調べてみると、一部のブログでは「iframe」タグが使えないため、うまくいかないケースがあるようでした。

【参考】(間違っているものやその後変更になったものもあるかもしれません)
iframeが使えるブログ
・自宅サーバ+Movable Type (私の環境です)
・FC2ブログ

iframeが使えないブログ
・gooブログ
・楽天ブログ
・はてなダイアリー
・アメブロ
・Word Press(修正可能らしい)

私がブログの記事の中で記述しているのは、

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

というhtml文です。

サーバの中の「/archives/maps/」に置いた、別ファイル「20100718map.html」と別フォルダー「20100718map_files」の中の写真やcssファイルを参照して、ブログの中に埋め込んでいます。

プロバイダ系ブログの中にはセキュリティ強化のために「iframe」タグを無効にしているために表示されないようです。

他に方法がないか、やってみたのが次のような記述です。

【記述1】「object」タグを使う方法

<object type=”text/html” data=”http://biketoshumi.chips.jp/wp/wpcontent/maps/20100718map.html” width=”560″ height=”500″>GoggleMapsへの埋め込み地図</object>

この方法もプロバイダによっては、「iframe」同様に「object」も使用禁止にしているところもあるようなのでハネられる恐れがあります。

【記述2】イメージ図を表示して単にリンクを張る方法

<a href=”http://biketoshumi.chips.jp/wp/wpcontent/maps/20100718map.html”<img src=”http://biketoshumi.chips.jp/wp-content/uploads/googlemaptest01.jpg” border=0>GoggleMapsへの埋め込み地図</a>

別ウインドウ、あるいは同ウインドウが開くという、スマートでない方法ですが単純なリンクなのでとりあえず表示出来る可能性は高まります。
リンクを張る画像を用意する手間は増えます。

実際に、私のブログでやってみると

【記述1】
GoggleMapsへの埋め込み地図

【記述2】
GoggleMapsへの埋め込み地図

と、考えてみたのですが、ここで困った問題があります。

私のサーバ環境のブログでは、問題なく表示出来ているのですが、実際にgooブログ、楽天ブログ、アメブロ、はてなダイアリーを使っている方にテストしていただかないと、うまくいくかどうかわからないのですね。

どなたかご協力いただける方、結果を教えていただけませんでしょうか。—–

 

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

 

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

   

 

コメント

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