「G-Mapsを Iframで関数的に使用する」の使い方

Lilux天然塾   
 Google Mapsの地図をホームページやブログ等に任意のサイズで組み込みたいと、パラメータ形式で関数的に使えるようにしてみました。

 サイズや座標だけでなく、地図の形式やスケール表示など一応の制御や、Google Earthなどで作成したKMLファイルも組み込めます。
 パラメータ無しの場合は、機能の確認用としてウィンドウ枠いっぱいと し、初期座標は紀伊半島南部の中央付近の「半作嶺山頂」としてあります。

 Iframeでの使い方などは、本ページのソースをご覧になるなりして下さい。

 地理座標の取得は、こ ちらでどうぞ! (このページもパラメータで制御できるようになっています。お試し下さい)

 ポインターの設定はGoogle Earthでも可能ですが、現状ではアイコンのサイズが調整出来ないので、こ ちらのアイコンに切り替えるなどされるとよいかもです・・・
 線や面の設定は、「月と6ペソ」さんの KMLエディタ(線とシェイプの描 画、KMLファイルの作成補助ツール) がよろしいかと思います。


例0) パラメータ無し
  http://homepage2.nifty.com/Tsubaki/G-Map/Smallmap.html
  これは画像イメージです。(クリックで起動します)

<ー 使 用方法の確認はブラウザから、上記のURLを指定してみて下さ い。左の画面がパラメータ無しのものです。

 パラメータは、URLに"?"をセパレータとし、複数のパラメータ間を"&"をセパレータで結合して与えます。

  例) http://homepage2.nifty.com/Tsubaki/G-Map/Smallmap.html?lat=33.635&lon=135.41&t

  パラメータについて

  座標  : 緯度は"lat=33.635"、経度は"lon=135.41"の如く、実数形式で与えます。サイズ : 横幅は"w=240px"もしくは"w=10%"、経度は"h=180px"もしくは"h=10%"の如く
       ピクセルまたは画面サイズの割合で指定します。

  ズームバー : "l"(小文字のエル)を指定すれば大きい ズームバー、省略は小さいズームバーとなります。
  ズームレベル: "z=n(1〜18の数字)。省略時はz= 12となります。

  地図タイプ : 省略時は一般的な地図のみ、"t"を指定で右上に「写真/地図+航空写真」の切り替えメニュー
           さらに、"p"で「地形」追加、"e"で「Google Earth版」をメニューに追加します。
  表示モード : "m=モード"指定で、省略時は一般地図、 "h"で「写真+地図」、"p"で「地形」、"e"で「GoogleEarth」
  距離スケール : "s"指定で、左下に距離スケールを表示しま す。
  ビューマップ : "v"指定で、右下にビューマップ (概観図)を表示します。

  kmlファイル : "kml=kmlファイルのURL"指定 で、地図上に各種ポインターを表示できます。


例1) 座標、サイズ、距離スケール、ビューマップ、地図タイプ に「地形」追加、kmlファイル指定
 http://homepage2.nifty.com/Tsubaki/G-Map/Smallmap.html?s&p&v&w=400px&h=300px&kml=http://homepage2.nifty.com/Tsubaki/Kmls/Tsubaki.kml&t&lat=33.635&lon=135.41

椿周辺の案内ポイントを表示させてみました。

パラメータ
?s&p&v&w=400px&h=300px&kml=http://homepage2.nifty.com/Tsubaki/Kmls/Tsubaki.kml&t&lat=33.635&lon=135.41

 ?s : 距離スケール
 &p : 地図タイプに「地形」追加
 &v : ビューマップ
 &w=400px&h=300px : 横幅=400ピクセル、縦幅=300ピクセル
 
 &kml=http://homepage2.nifty.com/Tsubaki/Kmls/Tsubaki.kml :  椿周辺の案内ポイントのkmlファイルのURL

 &t : 地図タイプのメニュー表示指定
http://homepage2.nifty.com/Tsubaki/G-Map/Smallmap.html?lat=33.635&lon=135.41&t
 &lat=33.635&lon=135.41 :  地理座標指定。 北緯と東経

 (地 理座標の取得は、URL=http://homepage2.nifty.com/Tsubaki/G-Map/Large-map.html? l&t&p&eでどうぞ!


例2) 座標、サイズ、距離スケール、ビューマップ、地図タイプ に「地形」追加、kmlファイル指定
 http://homepage2.nifty.com/Tsubaki/G-Map/Smallmap.html?m=p&lat=33.749&lon=135.611&w=400px&h=300px&z=12&t&kml=http://homepage2.nifty.com/Tsubaki/Kmls/Kumano.kml

旧大塔村・下川上の案内ポイントを表示させてみました。

パラメータ
?m=p&lat=33.749&lon=135.611&w=400px&h=300px&z=12&t&kml=http://homepage2.nifty.com/Tsubaki/Kmls/Kumano.kml

 ?m=p : 地形表示モード
 &z=12 : ズームレベル12
 &w=400px&h=300px : 横幅=400ピクセル、縦幅=300ピクセル
 
 &kml=http://homepage2.nifty.com/Tsubaki/Kmls/Kumano.kml :  南紀熊野・案内ポイントのkmlファイルのURL

 lat=33.749&lon=135.611 :  地理座標指定。 北緯と東経


例3) 複数のkmlファイル指定1
 http://homepage2.nifty.com/Tsubaki/G-Map/Smallmap.html?url=http://homepage2.nifty.com/Tsubaki/Kmls&kml=Tsubaki.kml,100meizan.kml&lat=34.309413&lon=135.933838



?url=http://homepage2.nifty.com/Tsubaki/Kmls&kml=Tsubaki.kml,100meizan.kml

複数のkmlファイルを指定したい場合、"kml=http://xxx.kml"を複数与えてもいいのですが、それらが同じディレクトリにある
場合には長くなりますので、上のようにディレクトリのURLとkmlファイルのパラメータに分けて指定すると簡便です。

  URL : "url=http://homepage2.nifty.com/Tsubaki/Kmls"の ようにします(最後に"/"は付けない)

  複数のkmlファイル : "kml=Tsubaki.kml,100meizan.kml"のように","で区切りいくつでも指定出来ます。


因みに"100meizan.kml" は,ju9choさんがGoogle Mapsにあげられている「日本百名山」への巡礼の記録だそうです。

  Heaven Site - 日本百名山

 「つれも てネッ ト」仲間の関連するポイントを試してみましたので参考にして下さい。 Iframeタグの部分です。 

つれもてネット南紀熊 野lat=33.715786&lon=135.406076
秋津野ガルテン】  lat=33.755726&lon=135.406752
霧の郷た か はら】  lat=33.796294&lon=135.533068
【峯鍼灸 院】  lat=33.730671&lon=135.378985
【ゆうゆう 河合塾】  lat=33.663581&lon=135.353896
【清川・中本梅農園】  lat=33.852802&lon=135.388706