バージョン３は基本的にＩＥ７以上ですが内容によってはＩＥ６でも表示できます。
マップキーを取得しないで利用できます。
アイコンはpngファイルで作成
地図の移動、拡大縮小のナビゲーションコントローラー（大）は400x350px以上のとき表示
javascript
function onLoad() {
var mapdiv = document.getElementById('map');
var myOptions = {
zoom: 16,
center: new google.maps.LatLng(33.9・・・,131.9・・・),
mapTypeId: google.maps.MapTypeId.ROADMAP,
scaleControl: true,
mapTypeControl: false,
streetViewControl : false,
scrollwheel: false
};
var map = new google.maps.Map(mapdiv, myOptions);
var image = 'オリジナルマーカーへのパス';
var marker = new google.maps.Marker({
position: new google.maps.LatLng(33.9・・・,131.9・・・),
map: map,
icon: image,
title: 'マーカーのタイトル'
});
var infowindow = new google.maps.InfoWindow({
content: '<p style="margin:0;padding:0;width:280px;height:70px;font-size:100%;">名称<br />住所<br />TEL:00-000-0000</p>',
size: new google.maps.Size(200, 60)
});
google.maps.event.addListener(marker, 'click', function() {
infowindow.open(map,marker);
});
}
html head [Google Maps API を読み込む]
記述に「&language=ja」を入れるとＩＥで日本語の地図を表示
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false&language=ja"></script>
html body [bodyにonload=”onload();” 地図を表示したい位置にdiv=”map”]
<body onload="onLoad();"> <div id="map" style="width:650px; height:370px; margin:10px 0px 50px 10px; padding:0px;"></div>
onloadが使えない場合body内に
<script type="text/javascript">
//<![CDATA[
google.maps.event.addDomListener(window,'load',function(){
var mapdiv = document.getElementById("map");
var myOptions = {
zoom: 17,
center: new google.maps.LatLng(35.693893857904364, 139.74984884262085),
mapTypeId: google.maps.MapTypeId.ROADMAP,
scaleControl:true,
streetViewControl : false,
scrollwheel: false
}
var map = new google.maps.Map(mapdiv, myOptions);
var image = 'http://kdcs-web.com/wp-content/themes/newxhtml/images/sale_icon.png';
var myLatLng = new google.maps.LatLng(35.693893857904364, 139.74984884262085);
var saikyoMarker = new google.maps.Marker({
draggable:false,
position: myLatLng,
map: map,
icon: image,
title: "sample"
});
});
//]]>
</script>