Google Maps APIの使い方－ポリゴン｜Google Maps JavaScript API v2｜Ajax

TOP AjaxGoogle Maps APIの使い方－ポリゴン

ポリゴンの各頂点の地理座標を取得
ポリゴンの面積を取得
地図からすべてのポリゴンを削除
地図にポリゴンを表示する
ポリゴンのクリックを有効化・無効化
ポリゴンの境界線を取得
地図から指定したポリゴンを削除
ポリゴンを削除した時のイベントを取得
ポリゴンの表示／非表示／非表示判定／表示状態取得
ポリゴンの頂点の数を取得

Google Maps JavaScript APIバージョン2は廃止され、バージョン3に移行しました。
» Google Maps JavaScript API v3の解説はこちら!

ポリゴンの各頂点の地理座標を取得

2008/5/5

GPolygon.getVertex(index)

GPolygonクラスのgetVertex()メソッドは、ポリゴンの各頂点の地理座標を返します。第1引数indexに、地理座標を取得したいポリゴンのインデックス番号を指定します（0始まり）。

サンプルを見る

<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[
function load() {
    if(GBrowserIsCompatible()){
        /* 地図インスタンス生成 */
        var map=new GMap2(document.getElementById("map"));
         /* 緯度、経度 */
         var lat=35.665246;
         var lng=139.712319;
         /* 中心地点 */
        map.setCenter(new GLatLng(lat, lng), 14);
        /* コントロール追加 */
        map.addControl(new GLargeMapControl()); /* 大きなコントロール */
        map.addControl(new GMapTypeControl()); /* 地図タイプコントロール */
        /* ポリゴン */
        var latOffset = 0.005;
        var lngOffset = 0.005;
        var polygon = new GPolygon([new GLatLng(lat, lng-lngOffset), new GLatLng(lat+latOffset, lng), new GLatLng(lat, lng+lngOffset), new GLatLng(lat-latOffset, lng), new GLatLng(lat, lng-lngOffset)],"#ff0000", 3, 1, "#ff6699", 0.3);
        map.addOverlay(polygon);
        map.addControl(new GMapTypeControl()); /* 地図タイプ切替コントロール */
        
        /* ポリゴンの頂点の数を取得 */
        var s="";
        for(var i=0; i<polygon.getVertexCount(); i++){
            s+="頂点["+i+"] = "+polygon.getVertex(i)+"\n";
        }
        document.getElementById("res").value=s;
    }
}
window.onload=load;
window.unload=GUnload;
//]]>
</script>
<div id="map" style="width:425px;height:300px"><!-- 地図描画領域 --></div><br>
<form action="#">
    <textarea cols="64" rows="4" id="res" style="width:421px;"></textarea>
</form>

ポリゴンの面積を取得

2008/5/5

GPolygon.getArea()

GPolygonクラスのgetArea()メソッドは、ポリゴンの面積（単位：平方メートル[㎡]）を返します。

サンプルを見る

<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,polygon;
function load() {
    if(GBrowserIsCompatible()){
        /* 地図インスタンス生成 */
        map=new GMap2(document.getElementById("map"));
         /* 緯度、経度 */
         var lat=35.665246;
         var lng=139.712319;
         /* 中心地点 */
        map.setCenter(new GLatLng(lat, lng), 14);
        /* コントロール追加 */
        map.addControl(new GLargeMapControl()); /* 大きなコントロール */
        map.addControl(new GMapTypeControl()); /* 地図タイプコントロール */
        /* ポリゴン */
        var latOffset = 0.005;
        var lngOffset = 0.005;
        polygon = new GPolygon([new GLatLng(lat, lng-lngOffset), new GLatLng(lat+latOffset, lng), new GLatLng(lat, lng+lngOffset), new GLatLng(lat-latOffset, lng), new GLatLng(lat, lng-lngOffset)],"#ff0000", 3, 1, "#ff6699", 0.3);
        map.addOverlay(polygon);
        map.addControl(new GMapTypeControl()); /* 地図タイプ切替コントロール */

        /* ポリゴンの面積を取得 */
        document.getElementById("res").value=polygon.getArea();
    }
}
window.onload=load;
window.unload=GUnload;
//]]>
</script>
<div id="map" style="width:425px;height:300px"><!-- 地図描画領域 --></div><br>
<form action="#">
    ポリゴンの面積：<input type="text" id="res" size="20" />&nbsp;㎡
</form>

地図からすべてのポリゴンを削除

2008/5/5

GMap2.clearOverlays()

地図からすべてのポリゴンを削除するには、GMap2クラスのclearOverlays()メソッドを使用します。

サンプルを見る

<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">
var map, polygon1, polygon2;
function load() {
    if(GBrowserIsCompatible()){
        /* 地図インスタンス生成 */
        map=new GMap2(document.getElementById("map"));
         /* 緯度、経度 */
         var lat1=35.658517;
         var lng1=139.701333;
         var lat2=35.665246;
         var lng2=139.712319;
         /* 中心地点 */
        map.setCenter(new GLatLng(35.662474,139.707556), 14);
        /* コントロール追加 */
        map.addControl(new GLargeMapControl()); /* 大きなコントロール */
        map.addControl(new GMapTypeControl()); /* 地図タイプコントロール */
        /* ポリゴン */
        var latOffset = 0.005;
        var lngOffset = 0.005;
        polygon1 = new GPolygon([new GLatLng(lat1, lng1-lngOffset), new GLatLng(lat1+latOffset, lng1), new GLatLng(lat1, lng1+lngOffset), new GLatLng(lat1-latOffset, lng1), new GLatLng(lat1, lng1-lngOffset)], "#ff0000", 3, 1, "#ff6699", 0.3);
        map.addOverlay(polygon1);
        polygon2 = new GPolygon([new GLatLng(lat2, lng2-lngOffset), new GLatLng(lat2+latOffset, lng2), new GLatLng(lat2, lng2+lngOffset), new GLatLng(lat2-latOffset, lng2), new GLatLng(lat2, lng2-lngOffset)], "#ff0000", 3, 1, "#ff6699", 0.3);
        map.addOverlay(polygon2);
        GEvent.addListener(map, "click", function(overlay,latlng) {
            if(overlay) map.removeOverlay(overlay);
        });
    }
}
window.onload=load;
window.unload=GUnload;
//]]>
</script>
<div id="map" style="width:425px;height:300px"></div><br>
<form action="#">
    <input type="button" value="すべてのポリゴンを削除" onclick="map.clearOverlays()" />
</form>

地図にポリゴンを表示する

2008/5/5

new GPolygon(points[, strokeColor[, strokeWeight[, strokeOpacity[, fillColor[, fillOpacity[, opts]]]]]])

地図にポリゴンを表示するには、GPolygonクラスを使用します。

サンプルを見る

<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">
function load() {
    if(GBrowserIsCompatible()){
        /* 地図インスタンス生成 */
        var map=new GMap2(document.getElementById("map"));
         /* 緯度、経度 */
         var lat=35.665246;
         var lng=139.712319;
         /* 中心地点 */
        map.setCenter(new GLatLng(lat, lng), 14);
        /* コントロール追加 */
        map.addControl(new GLargeMapControl()); /* 大きなコントロール */
        map.addControl(new GMapTypeControl()); /* 地図タイプコントロール */
        /* ポリゴン */
        var latOffset = 0.005;
        var lngOffset = 0.005;
        var polygon = new GPolygon([
            new GLatLng(lat, lng-lngOffset),
            new GLatLng(lat+latOffset, lng),
            new GLatLng(lat, lng+lngOffset),
            new GLatLng(lat-latOffset, lng),
            new GLatLng(lat, lng-lngOffset)
        ],
        "#ff0000", /* 枠線の色 */
        3, /* ピクセル単位の線の幅 */
        1, /* 枠線の有無 */
        "#ff6699", /* ポリゴン領域の色 */
        0.3 /* 透明度（0～１の間の数値） */
        );
        map.addOverlay(polygon);
    }
}
window.onload=load;
window.unload=GUnload;
//]]>
</script>
<div id="map" style="width:425px;height:300px"><!-- 地図描画領域 --></div>

ポリゴンのクリックを有効化・無効化

2008/5/5

GPolygonOptionsクラス（clickableプロパティ）

ポリゴンのクリック操作は、デフォルトで有効になっています。

ポリゴンのクリックを無効にする場合は、GPolygonのオプション引数optsのclickableプロパティにFALSEを指定します。 TRUEを指定すると、デフォルト同様、ポリゴンのクリックが有効になります。

サンプルを見る

<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[
function load() {
    if(GBrowserIsCompatible()){
        /* 地図インスタンス生成 */
        var map=new GMap2(document.getElementById("map"));
         /* 緯度、経度 */
         var lat=35.665246;
         var lng=139.712319;
         /* 中心地点 */
        map.setCenter(new GLatLng(lat, lng), 14);
        /* コントロール追加 */
        map.addControl(new GLargeMapControl()); /* 大きなコントロール */
        map.addControl(new GMapTypeControl()); /* 地図タイプコントロール */
        /* ポリゴン */
        var opts={clickable:false} /* ポリゴンのクリック無効化 */
        var latOffset = 0.005;
        var lngOffset = 0.005;
        var polygon = new GPolygon([new GLatLng(lat, lng-lngOffset), new GLatLng(lat+latOffset, lng), new GLatLng(lat, lng+lngOffset), new GLatLng(lat-latOffset, lng), new GLatLng(lat, lng-lngOffset)],"#ff0000", 3, 1, "#ff6699", 0.3, opts);
        map.addOverlay(polygon);
        map.addControl(new GMapTypeControl()); /* 地図タイプ切替コントロール */

        /* ポリゴンがクリックされた時  */
        GEvent.addListener(polygon, "click", function(latlng){
            alert("ポリゴンがクリックされました");
        });
    }
}
window.onload=load;
window.unload=GUnload;
//]]>
</script>
<p>
    下記の地図は、ポリゴンのクリックを無効にしています。<br>
    ポリゴンをクリックしても、クリック時に指定した処理が実行されません。
</p>
<div id="map" style="width:425px;height:300px"><!-- 地図描画領域 --></div><br>

ポリゴンの境界線を取得

2008/5/5

GPolygon.getBounds()

GPolygonクラスのgetBounds()メソッドは、ポリゴンの境界線を返します。

サンプルを見る

<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,polygon;
function load() {
    if(GBrowserIsCompatible()){
        /* 地図インスタンス生成 */
        map=new GMap2(document.getElementById("map"));
         /* 緯度、経度 */
         var lat=35.665246;
         var lng=139.712319;
         /* 中心地点 */
        map.setCenter(new GLatLng(lat, lng), 14);
        /* コントロール追加 */
        map.addControl(new GLargeMapControl()); /* 大きなコントロール */
        map.addControl(new GMapTypeControl()); /* 地図タイプコントロール */
        /* ポリゴン */
        var latOffset = 0.005;
        var lngOffset = 0.005;
        polygon = new GPolygon([new GLatLng(lat, lng-lngOffset), new GLatLng(lat+latOffset, lng), new GLatLng(lat, lng+lngOffset), new GLatLng(lat-latOffset, lng), new GLatLng(lat, lng-lngOffset)],"#ff0000", 3, 1, "#ff6699", 0.3);
        map.addOverlay(polygon);
        map.addControl(new GMapTypeControl()); /* 地図タイプ切替コントロール */

        /* ポリゴンの境界線を取得 */
        var bounds=polygon.getBounds();
        var s="";
        s+="【ポリゴンの境界線】\n"+bounds+"\n";
        var sw=bounds.getSouthWest();
        var ne=bounds.getNorthEast();
        s+="【南西（左下）】\n緯度："+sw.lat()+"\n経度："+sw.lng()+"\n";
        s+="【北東（右上）】\n緯度："+ne.lat()+"\n経度："+ne.lng();
        document.getElementById("res").value=s;
    }
}
window.onload=load;
window.unload=GUnload;
//]]>
</script>
<div id="map" style="width:425px;height:300px"><!-- 地図描画領域 --></div><br>
<form action="#">
    <textarea cols="64" rows="7" id="res" style="width:421px;"></textarea>
</form>

地図から指定したポリゴンを削除

2008/5/5

GMap2.removeOverlay(overlay)

地図から指定したポリゴンを削除するには、GMap2クラスのremoveOverlay()メソッドを使用します。第1引数overlayに、削除するポリゴンを指定します。

サンプルを見る

<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">
var map, polygon1, polygon2;
function load() {
    if(GBrowserIsCompatible()){
        /* 地図インスタンス生成 */
        map=new GMap2(document.getElementById("map"));
         /* 緯度、経度 */
         var lat1=35.658517;
         var lng1=139.701333;
         var lat2=35.665246;
         var lng2=139.712319;
         /* 中心地点 */
        map.setCenter(new GLatLng(35.662474,139.707556), 14);
        /* コントロール追加 */
        map.addControl(new GLargeMapControl()); /* 大きなコントロール */
        map.addControl(new GMapTypeControl()); /* 地図タイプコントロール */
        /* ポリゴン */
        var latOffset = 0.005;
        var lngOffset = 0.005;
        polygon1 = new GPolygon([new GLatLng(lat1, lng1-lngOffset), new GLatLng(lat1+latOffset, lng1), new GLatLng(lat1, lng1+lngOffset), new GLatLng(lat1-latOffset, lng1), new GLatLng(lat1, lng1-lngOffset)], "#ff0000", 3, 1, "#ff6699", 0.3);
        map.addOverlay(polygon1);
        polygon2 = new GPolygon([new GLatLng(lat2, lng2-lngOffset), new GLatLng(lat2+latOffset, lng2), new GLatLng(lat2, lng2+lngOffset), new GLatLng(lat2-latOffset, lng2), new GLatLng(lat2, lng2-lngOffset)], "#ff0000", 3, 1, "#ff6699", 0.3);
        map.addOverlay(polygon2);
        GEvent.addListener(map, "click", function(overlay,latlng) {
            if(overlay) map.removeOverlay(overlay);
        });
    }
}
window.onload=load;
window.unload=GUnload;
//]]>
</script>
<div id="map" style="width:425px;height:300px"></div><br>
<p>↑　ポリゴンをクリックすると、クリックしたポリゴンを削除します。</p>

ポリゴンを削除した時のイベントを取得

2008/5/5

GEvent.addListener(ポリゴンオブジェクト, "remove", function(){処理});

GPolygonクラスのremoveイベントは、GMap2.clearOverlays()メソッドあるいはGMap2.removeOverlay()メソッドで、地図からポリゴンが削除された時に発生します。イベントハンドラに渡される引数はありません。

サンプルを見る

<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, polygon;
/* ピクセル座標 */
var latlng_1=new GLatLng(35.670284,139.702685); /* 原宿駅 */
var latlng_2=new GLatLng(35.669508,139.70291); /* 神宮橋交差点 */
var latlng_3=new GLatLng(35.669073,139.703994); /* 明治神宮前駅 */
var latlng_4=new GLatLng(35.668467,139.705375); /* 神宮前交差点 */
var latlng_5=new GLatLng(35.665246,139.712319); /* 表参道駅 */
var latlngs=[latlng_1, latlng_2, latlng_3, latlng_4, latlng_5];

function load() {
    if(GBrowserIsCompatible()){
        /* 地図インスタンス生成 */
        map=new GMap2(document.getElementById("map"));
         /* 緯度、経度 */
         var lat=35.665246;
         var lng=139.712319;
         /* 中心地点 */
        map.setCenter(new GLatLng(lat, lng), 14);
        /* コントロール追加 */
        map.addControl(new GLargeMapControl()); /* 大きなコントロール */
        map.addControl(new GMapTypeControl()); /* 地図タイプコントロール */
        /* ポリゴン */
        var latOffset = 0.005;
        var lngOffset = 0.005;
        polygon = new GPolygon([new GLatLng(lat, lng-lngOffset), new GLatLng(lat+latOffset, lng), new GLatLng(lat, lng+lngOffset), new GLatLng(lat-latOffset, lng), new GLatLng(lat, lng-lngOffset)],"#ff0000", 3, 1, "#ff6699", 0.3);
        map.addOverlay(polygon);

        document.getElementById("res").value="";
        /* ポリゴンが削除された時 */
        GEvent.addListener(polygon, "remove", function(){
            document.getElementById("res").value+="ポリゴンが削除されました\n";
        });
    }
}
function fAddpolygon(polygon){
    map.addOverlay(polygon);
}
window.onload=load;
window.unload=GUnload;
//]]>
</script>
<div id="map" style="width:425px;height:300px"><!-- 地図描画領域 --></div><br>
<form action="#">
    <p>
        <input type="button" value="ポリゴン追加" id="swbtn" onclick="fAddpolygon(polygon);" /><br>
        <input type="button" value="ポリゴン削除（clearOverlays）" id="swbtn" onclick="map.clearOverlays();" />
        <input type="button" value="ポリゴン削除（removeOverlay）" id="swbtn" onclick="map.removeOverlay(polygon);" />
    </p>
     <p>
        <textarea cols="64" rows="7" id="res" style="width:421px;"></textarea>
    </p>
</form>

ポリゴンの表示／非表示／非表示判定／表示状態取得

2008/5/5

GPolygon.show()
GPolygon.hide()
GPolygon.isHidden()
GPolygon.supportsHide()
visibilitychangedイベント

GPolygonクラスのshow()メソッドは、ポリゴンを表示します。戻り値はありません。

GPolygonクラスのhide()メソッドは、ポリゴンを非表示にします。戻り値はありません。

GPolygonクラスのisHidden()メソッドは、ポリゴンが非表示かどうかを調べ、非表示の場合にTRUE、そうでない場合にFALSEを返します。

GPolygonクラスのsupportsHide()メソッドは、現在の環境でGPolygon.hide()メソッドがサポートされている場合にTRUE、そうでない場合にFALSEを返します。

GPolygonクラスのvisibilitychangedイベントは、ポリゴンの表示状態が「表示→非表示」あるいは「非表示→表示」に変更された時に発生します。引数にisVisibleをとります。

サンプルを見る

<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, polygon;
function load() {
    if(GBrowserIsCompatible()){
        /* 地図インスタンス生成 */
        map=new GMap2(document.getElementById("map"));
         /* 緯度、経度 */
         var lat=35.665246;
         var lng=139.712319;
         /* 中心地点 */
        map.setCenter(new GLatLng(lat, lng), 14);
        /* コントロール追加 */
        map.addControl(new GLargeMapControl()); /* 大きなコントロール */
        map.addControl(new GMapTypeControl()); /* 地図タイプコントロール */
        /* ポリゴン */
        var latOffset = 0.005;
        var lngOffset = 0.005;
        polygon = new GPolygon([new GLatLng(lat, lng-lngOffset), new GLatLng(lat+latOffset, lng), new GLatLng(lat, lng+lngOffset), new GLatLng(lat-latOffset, lng), new GLatLng(lat, lng-lngOffset)],"#ff0000", 3, 1, "#ff6699", 0.3);
        map.addOverlay(polygon);
        map.addControl(new GMapTypeControl()); /* 地図タイプ切替コントロール */

         /* ポリゴンの表示状態が変更された時 */
        document.getElementById("res").value="";
        GEvent.addListener(polygon, "visibilitychanged", function(isVisible){
            if(isVisible==true){
                document.getElementById("res").value+="ポリゴンが表示されました\n";
            }else{
                document.getElementById("res").value+="ポリゴンが非表示になりました\n";
            }
        });
    }
}
function swPolygon(){
    var obj=document.getElementById("swbtn");
    if(polygon.supportsHide()==true){
        if(polygon.isHidden()==true){
            /* 非表示→表示 */
            polygon.show();
            obj.value="ポリゴン非表示";
        }else{
            /* 表示→非表示 */
            polygon.hide();
            obj.value="ポリゴン表示";
        }
    }else{
        document.write("現在の環境では、Gpolygon.hide()メソッドが使えません！");
    }
}
window.onload=load;
window.unload=GUnload;
//]]>
</script>
<div id="map" style="width:425px;height:300px"><!-- 地図描画領域 --></div><br>
<form action="#">
    <p>
        クリックで表示・非表示切替　→　<input type="button" value="ポリゴン非表示" id="swbtn" onclick="swPolygon();" />
    </p>
     <p>
        <textarea cols="64" rows="7" id="res" style="width:421px;"></textarea>
    </p>
</form>

ポリゴンの頂点の数を取得

2008/5/5

GPolygon.getVertexCount()

GPolygonクラスのgetVertexCount()メソッドは、ポリゴンの頂点の数を返します。

サンプルを見る

<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[
function load() {
    if(GBrowserIsCompatible()){
        /* 地図インスタンス生成 */
        var map=new GMap2(document.getElementById("map"));
         /* 緯度、経度 */
         var lat=35.665246;
         var lng=139.712319;
         /* 中心地点 */
        map.setCenter(new GLatLng(lat, lng), 14);
        /* コントロール追加 */
        map.addControl(new GLargeMapControl()); /* 大きなコントロール */
        map.addControl(new GMapTypeControl()); /* 地図タイプコントロール */
        /* ポリゴン */
        var latOffset = 0.005;
        var lngOffset = 0.005;
        var polygon = new GPolygon([new GLatLng(lat, lng-lngOffset), new GLatLng(lat+latOffset, lng), new GLatLng(lat, lng+lngOffset), new GLatLng(lat-latOffset, lng), new GLatLng(lat, lng-lngOffset)],"#ff0000", 3, 1, "#ff6699", 0.3);
        map.addOverlay(polygon);
        map.addControl(new GMapTypeControl()); /* 地図タイプ切替コントロール */
        
        /* ポリゴンの頂点の数を取得 */
        document.getElementById("res").value=polygon.getVertexCount();
    }
}
window.onload=load;
window.unload=GUnload;
//]]>
</script>
<div id="map" style="width:425px;height:300px"><!-- 地図描画領域 --></div><br>
<form action="#">
    ポリゴンの頂点の数：<input type="text" id="res" size="3" />
</form>

Google Maps JavaScript API v2 Google Maps APIの使い方－ライン（線分）

Google Maps JavaScript API v2 Google Maps APIの使い方－情報ウィンドウ

独自ドメインがずっと無料！国内シェアNo.1【ロリポップ！】

Google Maps JavaScript API v2Google Maps APIの使い方－ポリゴン

ポリゴンの各頂点の地理座標を取得

ポリゴンの面積を取得

地図からすべてのポリゴンを削除

地図にポリゴンを表示する

ポリゴンのクリックを有効化・無効化

ポリゴンの境界線を取得

地図から指定したポリゴンを削除

ポリゴンを削除した時のイベントを取得

ポリゴンの表示／非表示／非表示判定／表示状態取得

ポリゴンの頂点の数を取得

関連コンテンツ

Google Maps JavaScript API v2Google Maps APIの使い方 － ポリゴン

ポリゴンの各頂点の地理座標を取得

ポリゴンの面積を取得

地図からすべてのポリゴンを削除

地図にポリゴンを表示する

ポリゴンのクリックを有効化・無効化

ポリゴンの境界線を取得

地図から指定したポリゴンを削除

ポリゴンを削除した時のイベントを取得

ポリゴンの表示／非表示／非表示判定／表示状態取得

ポリゴンの頂点の数を取得

関連コンテンツ

Google Maps JavaScript API v2Google Maps APIの使い方－ポリゴン