谷歌地图，基于缩放的刻度圈

Question

我有一个显示圆圈的 Google 地图，使用数据集索引（1、2、3、4..）缩小的半径：

 var radiusTest = 1 - (mapDataTrending[i].index) * .1;

 var populationOptions = {
  strokeColor: "#fdb913",
  strokeOpacity: 0.35,
  strokeWeight: 1,
  fillColor: "#fdb913",
  fillOpacity: 0.35,
  map: map,
  center: new google.maps.LatLng(mapDataTrending[i].lat, mapDataTrending[i].lng),
  radius: radiusTest * 800
};

cityCircle = new google.maps.Circle(populationOptions);

我希望当用户放大时圆圈不会变大。当用户放大时圆圈会缩放，并且如果用户放大到像 20 这样的整数，我希望它们不会变得那么大。

这是我制作地图的方法：

var mapOptions = {
    center: new google.maps.LatLng(30.26826, -97.743044),
    zoom: 14,
    panControl: false,
    zoomControl: false,
    scaleControl: false,
    disableDefaultUI: true,
    mapTypeControlOptions: {
        mapTypeIds: [google.maps.MapTypeId.ROADMAP, 'map_style']
    }
};

map = new google.maps.Map(document.getElementById('map_canvas'), mapOptions);

有没有办法可以根据地图缩放来控制圆半径？

Answer 1

如果您想要一个在不同缩放级别下保持相同大小的圆圈，最好使用符号。

如本示例所示，默认情况下它们会根据缩放级别缩放其大小。您还可以选择设置普通圆具有的属性，例如fillColor和strokeOpacity。

从我链接的示例中：

var marker = new google.maps.Marker({
  position: map.getCenter(),
  icon: {
    path: google.maps.SymbolPath.CIRCLE,
    scale: 10
  },
  draggable: true,
  map: map
});