PHP & JavaScript Room :: 設置サンプル

実行結果







ソース

<script src="http://maps.google.com/maps?file=api&amp;v=2&amp;key=ABQIAAAAvABrzCnRluKK0Cj97fTMThTNR7aHVSEFb0WbViWwc6F-_w9PjBSogZu_7UgOTbx25ka46X-fnGmyvw" type="text/javascript"></script>
<script type="text/javascript">
//<![CDATA[
var map,ctrlGLarge,ctrlGSmall,ctrlGSmallZoom,ctrlGScale,ctrlGMapType,ctrlGOverview;
function load() {
    if(GBrowserIsCompatible()){
        /* 地図インスタンス生成 */
        map=new GMap2(document.getElementById("map"));

        /* 中心地点 */
        map.setCenter(new GLatLng(35.658421,139.699069), 17);

        /* コントロール追加 */
        ctrlGLarge=new GLargeMapControl(); /* 大きなコントロール */
        ctrlGSmall=new GSmallMapControl(); /* 小さなコントロール */
        ctrlGSmallZoom=new GSmallZoomControl(); /* ズームコントロール */
        ctrlGScale=new GScaleControl(); /* スケールコントロール */
        ctrlGMapType=new GMapTypeControl(); /* 地図タイプ切替コントロール */
        ctrlGOverview=new GOverviewMapControl(); /* 概観地図 */

        map.addControl(ctrlGLarge);
        map.addControl(ctrlGScale);
        map.addControl(ctrlGMapType);
        map.addControl(ctrlGOverview);
    }
}
function swCtrl(ctrl, id){
    var obj=document.getElementById(id);
    if(obj.value.indexOf("削除")>-1){
        /* コントロール削除 */
        map.removeControl(ctrl);
        obj.value=obj.value.replace("削除","追加");
    }else{
        /* コントロール追加 */
        map.addControl(ctrl);
        obj.value=obj.value.replace("追加","削除");
    }
}
window.onload=load;
window.unload=GUnload;
//]]>
</script>
<div id="map" style="width:425px;height:300px"><!-- 地図描画領域 --></div><br>
<form action="#">
    <input type="button" value="GLargeMapControl(大きなコントロール)削除" onclick="swCtrl(ctrlGLarge,this.id);" id="btnGLarge" /><br>
    <input type="button" value="GSmallMapControl(大きなコントロール)追加" onclick="swCtrl(ctrlGSmall,this.id);" id="btnGSmall" /><br>
    <input type="button" value="GSmallZoomControl(ズームコントロール)追加" onclick="swCtrl(ctrlGSmallZoom,this.id);" id="btnGSmallZoom" /><br>
    <input type="button" value="GScaleControlI(スケールコントロール)削除" onclick="swCtrl(ctrlGScale,this.id);" id="btnGScale" /><br>
    <input type="button" value="GMapTypeControl(地図タイプ切替コントロール)削除" onclick="swCtrl(ctrlGMapType,this.id);" id="btnGMapType" /><br>
    <input type="button" value="GOverviewMapControl(概観地図)削除" onclick="swCtrl(ctrlGOverview,this.id);" id="GOverview" />
</form>

polarized women