2012-05-26 9 views
5

マップ内のポリゴンの面積を取得する必要があります。私はnew google.maps.geometry.spherical.computeAreaの例を探しましたが、それを動作させることはできません。理由はわかりません。ポリゴンの面積を計算する

function dibuV(area){ 
    var i; 
    var a = new Array(); 
    for(i=0; i<area.length; i++){ 
    var uno = area[i].split(","); 
    a[i] = new google.maps.LatLng(uno[0],uno[1]); 
    } 
    poligon = new google.maps.Polygon({ 
    paths: a, 
    strokeColor: "#22B14C", 
    strokeOpacity: 0.8, 
    strokeWeight: 2, 
    fillColor: "#22B14C", 
    fillOpacity: 0.35 
    }) 
    poligon.setMap(map);//until here is ok 
    var z = new google.maps.geometry.spherical.computeArea(poligon.getPath()); 
    alert(z); //this is not working 
} 

答えて

15

あなたのコードがあなたに与えているエラー:この内

概念:Google Maps v3 API documentationからgoogle.maps.geometry is undefined

を、幾何学関数は、デフォルトでロードされていないライブラリの一部でありますgoogle.maps.geometryライブラリ内の しか利用できない機能を参照してください。 Maps Javascript APIを読み込むときにこのライブラリは デフォルトで読み込まれませんが、ライブラリのブートストラップパラメータを使用して明示的に に指定する必要があります。

あなたのページ内のジオメトリつくをロードして使用するためには、あなたがlibraries=geometry含めることによって、あなたの初期のGoogle APIの呼び出しにそれを追加することによって、あなたはジオメトリライブラリを使用することをGoogleに通知する必要があります。

<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?libraries=geometry&sensor=false"></script> 

これでジオメトリライブラリが読み込まれ、z変数にオブジェクトが含まれます。作業コードと

テストページ:これはあなたが使用するため、「新しい」computeAreaメソッドを使用しているため、機能していない

<!DOCTYPE html> 
<html> 
<head> 
    <style type="text/css"> 
     html, body, #map_canvas { 
     margin: 0; 
     padding: 0; 
     height: 100%; 
     } 
    </style> 
<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?libraries=geometry&sensor=false"></script> 
<script type="text/javascript"> 
    var map; 
    function initialize() 
    { 
     var myOptions = { 
      zoom: 8, 
      center: new google.maps.LatLng(-34.397, 150.644), 
      mapTypeId: google.maps.MapTypeId.ROADMAP 
     }; 
     map = new google.maps.Map(document.getElementById('map_canvas'), myOptions); 
    } 

    google.maps.event.addDomListener(window, 'load', initialize); 
    </script> 
<script> 
function test() 
{ 
var arr = new Array() 
arr.push('51.5001524,-0.1262362'); 
arr.push('52.5001524,-1.1262362'); 
arr.push('53.5001524,-2.1262362'); 
arr.push('54.5001524,-3.1262362'); 
dibuV(arr); 
} 
function dibuV(area) 
{ 
var a = new Array(); 

for(var i=0; i<area.length; i++) 
{ 
    var uno = area[i].split(","); 
    a[i] = new google.maps.LatLng(uno[0],uno[1]); 
} 

poligon = new google.maps.Polygon({ 
    paths: a, 
    strokeColor: "#22B14C", 
    strokeOpacity: 0.8, 
    strokeWeight: 2, 
    fillColor: "#22B14C", 
    fillOpacity: 0.35 
}) 

poligon.setMap(map);//until here is ok 
var z = new google.maps.geometry.spherical.computeArea(poligon.getPath()); 
alert(z); //this is not working 
} 
</script> 
</head> 
<body onload="test();"> 
    <div id="map_canvas"></div> 
</body> 
</html> 
+0

彼はそのエラーをどうやって知っていますか?私の場合は、すでにロードされている図面ライブラリで、あなたが提案したスクリプトタグを追加すると、プロセスが失敗しました。多分図形ライブラリにジオメトリが含まれていますか?私のために働く。 (そして、レオナルドが言ったように、静的な方法の前で「新しい」を失う。) – fortboise

+0

ありがとう、私はこれに遭遇したときに頭を掻き回すのに多くの時間を費やした。私の場合は、ライブラリのこの部分がロードされる前にjquery loadイベントをトリガしていました。 –

+1

複数のライブラリが必要な場合は、カンマ区切りで '' libraries = geometry、visualization'などのように区切ります。 – elrobis

6

。 「google.maps.geometry.spherical.computeArea」を「新規」なしで使用します。 例:

var z = google.maps.geometry.spherical.computeArea(myPolyline.getPath().getArray()); 
alert(z); 

これは動作します。

関連する問題