GoogleMap

Google Maps API V3 + Google Directions API

2010/10/07 GoogleMap No comments , ,

V3のマップにルート案内 (Directions API) を実装しよう。

GMap+DirectionAPI

APIで提供される交通手段は車・徒歩・自転車で、電車や飛行機を使う経路や発着時間を指定しての検索は出来ない。
なのでロサンゼルスから東京に移動するルートなんかを検索すると「太平洋をカヤックで横断する」と出たりする。
遠方の検索は公式の地図検索を使えって事なんだと思う。

解説は抜粋なのでソース全文は記事末尾からダウンロード出来るZipのjsファイルを見てください。

(さらに…)

[gmap] ‘document.body’ は Null またはオブジェクトではありません。

2010/09/10 GoogleMap No comments ,

Google MapsのIE6~IE7で発生する事があるエラー。
APIローダーからV3を呼び出そうとしていたときに出た。

メッセージ: 'document.body' は Null またはオブジェクトではありません。
ライン: 11
文字: 5
コード: 0
URI: http://maps.google.com/maps/api/js?key=notsupplied&v=3&callback=google.loader.callbacks.maps&hl=ja&sensor=false

ライン11に確かにdocument.bodyがある。
appendChildしようとしているが出来ないからエラーになっているようなので
headからbody内にGoogleMapsのscriptタグを移したら直った。
どうもクセでheadに入れたがってしまうんだけど、body閉じタグ直前に置くのが無難みたい。

[gmap v3] Googleマップのマーカーを動的に作成する

2010/08/05 GoogleMap 2 comments , , ,

マーカーデータ作成ツールでsessionStorageに保存されたポイントを表示する時に使っている1から始まる番号つきのマーカーは、
Google Chart APIで自動作成されたものです。

MapIconMakerというV2のライブラリが元ネタなんだけど、
V3はGIconとかが無くなってて使えなかったからドキュメント見ながらピンタイプのアイコンを出力する関数を書いてみた。
この関数使えばアイコン素材を用意する必要がなくてとてもお手軽です。

sample3-imageicon

(さらに…)

Google MapsにKMLのデータを表示する (v2,v3)

2010/06/11 GoogleMap 1 comment , , ,

KMLファイルを使えばGoogleMapsのマーカー設定とかが凄い簡単にできるっていう話。
KMLはXMLのように書式が決まってて手打ちはだいぶややこしいんだけど、GoogleEarth使えば簡単に作れる。

GooleEarthを開くと左側に「場所」ってのがあって、マークされた目印とかが表示されていると思う。
デフォルトだとお気に入りの中に観光ツアーというモノがあります。

GoogleEarth画面抜粋

自分でポチポチマーキングしてもいいんだけど、手順を解説するのは本題から外れるので割愛。
詳しくはマニュアル参照で。
「場所」タブの横にあるコンテンツを追加を押すと、ユーザーが作ったデータをギャラリーからインポート出来る。
とりあえずサンプルとして28日間で日本一周を読み込でみると、保留って所に表示されると思う。

ギャラリーからインポート

そしたら一番親のタイトルの所を右クリックして「名前をつけて場所を保存」を選ぶ。

kmlのエクスポート

ファイルタイプでkmlを選べばkmlファイルがエクスポートされます。

(さらに…)

[wp] GoogleMaps を記事本文内に埋め込むショートコードの作成(応用)

2010/03/31 wordpress 1 comment , , ,

基本編で適当に作ったショートコードを改変してマーカーを増やす。

Gmap shortcode

ショートコード間に書いたHTMLとかがそのまま出力されるのは同じで、

  • マーカーを増やす
  • タブ表示
  • 最大化表示
  • style属性でheightの設定
  • showMapBlowup()

以上を追加。

1記事1MAPで複数表示は(使う用事がなかったので)未対応。

(さらに…)