この記事は2013年11月の記事に加筆・変更を加えたものです。

使用量オーバーするサイトやアプリにはgoogleからビジネスAPIを取得して使用料を払うよう連絡きていた、Google Mapは2016年6月1日付けで従量課金制に以降します。リファラなしを選択たものでAPI keyが丸見えだと乗っ取りが起き支払いが発生する可能性がありますので気をつけてください。

使用制限

マップのロードが 24 時間あたり 25,000 回を超過するまで無料。… 使用制限と購入 – Google Maps JavaScript API v3 — Google Developers

API KEYの取得方法

キーの取得

API KEYの管理方法

既存キーの確認

APIの準備

緯度経度の取得

geocodingから探す
gooleMapから探す
goolemapで住所を検索し、赤いマーカーの上で右クリック「この場所について」をClick、ポップアップをClickしてlatとlocがわかる
住所とgooglemapの登録がずれている、古い場合の連絡先
マーカーで「この場所について」を開く、ポップアップをClickして「地図に乗っていない場所」をClickして手続き

シンプルな地図の表示

基本の地図を表示するのに必要なのは中心地点zoom値です。
中心地点は緯度経度で表示する必要が有ります。緯度経度の取得

地図のサンプル

地図のサンプル
*2016年5月時点

マーカーの表示


*2016年5月時点

アイコン画像を指定した特定の任意画像に差し替える

吹き出しの表示


*2013年11月時点

地図のカラーを指定


*2016年5月時点

さまざまなオプション

*2013年11月時点

パラメーター 意味 設定値 作用 地図
backgroundColor 描写待機時の背景色 文字列 読み込み待機中の背景色
disableDefaultUI UIの非表示 disables/Enables disablesでUI非表示
disableDoubleClickZoom ダブルクリックズーム操作 disables/Enables disablesでクリックでズームは不可(ホイールズームとUIズーム可)
draggable ドラック時、マウスオーバ時のカーソル変更 false/true falseにするとマップ移動禁止
draggableCursor カーソル設定 文字列 カーソル種類URL指定でオリジナルアイコン可
mapTypeControl マップタイプの有無 false/tru 表示/非表示
mapTypeControlOptions マップタイプオプション style position スタイルはDEFAULT、DROPDOWN_MENU、HORIZONTAL_BAR→ポジション詳細へ
mapTypeId マップタイプ選択 hybrid イラスト、航空写真、鉄道、サテライト表示等
minZoom 最小ズーム 数値 ズーム値
maxZoom 最大ズーム 数値 ズーム値
noClear 再描写時に前マップをクリアの有無 true/false 地図を再描写する際に前の地図を消さない
overviewMapControl オーバービュー表示の有無 true/false 右下に全体図を表示
overviewMapControlOptions オーバービューオプション true/false 全体図の初期開閉を設定
panControl パンコントローラーの有無 true/false 表示/非表示
panControlOptions パンコントロールオプション position →ポジション詳細へ
rotateControl 回転コントローラーの有無 true/false 表示/非表示(*対応している場所のみ)
rotateControlOptions 回転コントローラーオプション position →ポジション詳細へ
scaleControl スケール表示の有無 true/false 表示/非表示
scrollwheel マウスホイール操作 true/false 可能/禁止
setStreetView(panorama) パノラマストリートビュー設定 →パノラマストリートビューの詳細(*対応している場所のみ)
streetViewControl ストリートビューコントローラーの有無 true/false 表示/非表示
streetViewControlOptions ストリートビューコントローラーオプション position →ポジション詳細へ
zoomControl ズームコントローラーの有無 true/false 表示/非表示
zoomControlOptions ズームコントローラーオプション position →ポジション詳細へ
tilt サテライトマップ時の航空写真傾き 数値 (*対応している場所のみ)