google.maps.Circle 类中的 getPath 函数

Question

google.maps.Circle 类中没有任何 getPath() 函数。如何使用 getRadius() 和 getCenter() 函数获得近似路径？

Answer 1

您可以使用该google.maps.geometry.spherical.computeOffset方法计算具有相同半径和中心的圆形多边形的路径（需要几何库）。

function circlePath(circle) {
  var numPts = 512;
  var path = [];
  for (var i = 0; i < numPts; i++) {
    path.push(google.maps.geometry.spherical.computeOffset(circle.getCenter(), circle.getRadius(), i * 360 / numPts));
  }
  return path;
}

代码片段：

function circlePath(circle) {
  var numPts = 512;
  var path = [];
  for (var i = 0; i < numPts; i++) {
    path.push(google.maps.geometry.spherical.computeOffset(circle.getCenter(), circle.getRadius(), i * 360 / numPts));
  }
  return path;
}

var geocoder;
var map;

function circlePath(circle) {
  var numPts = 512;
  var path = [];
  for (var i = 0; i < numPts; i++) {
    path.push(google.maps.geometry.spherical.computeOffset(circle.getCenter(), circle.getRadius(), i * 360 / numPts));
  }
  return path;
}

function initialize() {
  var map = new google.maps.Map(
    document.getElementById("map_canvas"), {
      center: new google.maps.LatLng(37.4419, -122.1419),
      zoom: 13,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    });
  var circle = new google.maps.Circle({
    map: map,
    radius: 1000,
    center: map.getCenter(),
    fillOpacity: 0.2
  });
  var polygon = new google.maps.Polygon({
    map: map,
    paths: [circlePath(circle)],
    fillColor: 'red',
    fillOpacity: 0.5,
    strokeColor: 'red'
  });
  google.maps.event.addDomListener(document.getElementById('circle'), 'click', function() {
    circle.setMap(circle.getMap() == null ? map : null);
  });
  google.maps.event.addDomListener(document.getElementById('polygon'), 'click', function() {
    polygon.setMap(polygon.getMap() == null ? map : null);
  });
}
google.maps.event.addDomListener(window, "load", initialize);

html,
body,
#map_canvas {
  height: 100%;
  width: 100%;
  margin: 0px;
  padding: 0px
}