计算多边形的面积。

Question

计算多边形的面积。

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
}

- Hyper

3个回答

6

这个不起作用是因为您正在使用"new"来使用computeArea方法。请使用"google.maps.geometry.spherical.computeArea"而不使用"new"。例如：

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

这将有效。

- Leonardo Augusto Balzaretti

0

请看下面的代码。

var z = google.maps.geometry.spherical.computeArea(poligon.getPath());

- user13657753

1

欢迎来到 Stack Overflow，虽然这可能会回答您的问题，但最好为您的答案提供解释而不只是代码。 - gogaz

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- staticbeast · Accepted Answer

您的代码出现了一个错误：google.maps.geometry未定义。

根据Google Maps v3 API文档，几何函数是一个不被默认加载的库的一部分:

本文档中的概念仅适用于google.maps.geometry库中提供的功能。当您加载Maps JavaScript API时，默认情况下不会加载此库，但必须通过使用libraries引导参数明确指定。

为了在页面中加载和使用几何函数，您需要通过包含libraries=geometry将其添加到初始的Google API调用中，以通知Google您将使用几何库。

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

这将加载几何库，你的z变量将包含一个对象。

带有可工作代码的测试页面：

<!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>