地図の表示(1) 基本地図 -Google Maps-

もっとも基本的なGoogle Mapsの表示例です。東京タワーの周辺の地図を表示しています。

コード

head部

地図を表示するためにhead部分に挿入するJavascriptコードです。マップキー●●●はご自身のキーに置き換えてください。

<script src="http://maps.google.com/maps?file=api&amp;v=2&amp;key=●●●"
type="text/javascript" charset="utf-8"></script>

<script type="text/javascript">
//<![CDATA[
function load() {
if (GBrowserIsCompatible()) {
var map = new GMap2(document.getElementById("map"));
map.setCenter(new GLatLng(35.659057, 139.744442), 16);
map.addControl(new GLargeMapControl()); // 拡大縮小ボタン表示
map.addControl(new GMapTypeControl()); // 地図タイプ変更ボタン表示
}
}
//]]>
</script>

body部

body要素に挿入するHTMLコードです。

<div id="map" style="width: 500px; height: 300px">div>

関連記事
Google Maps
FC2ブログに設置 -Google Maps-
地図の表示(1) 基本地図 -Google Maps-
地図の表示(2) マーカー表示 -Google Maps-
地図の表示(3) 吹き出しの表示 -Google Maps-
地図の表示(4) タブ付吹き出しの表示 -Google Maps-
IEで発生するGoogle Mapsのエラー回避策
外部ファイル -Google Maps-
オリジナルアイコンを表示 -Google Maps-