如何在我的Google地图中使用圈子而不是标记

Question

我创建了要点，以更清晰地包含我的代码：

我正在创建一个显示位置列表的基本应用，但我想使用半径为1000米的圆，而不是显示精确位置的标记。 目标是为这些位置增加一点隐私。 页面上的文字可能会产生以下效果：“地图上的圆圈反映了其他用户的大概位置”。 尽管隐私权不是至关重要的，但我不希望随便的人看着地图并知道其他用户的地址。

我正在使用两个宝石：Geocoder和Gmaps4rails。 地理编码工作正常。 标记工作正常，但我不知道如何移动到圈子。

gmaps4rails开发人员指出（ Github页面 ），圆圈是可能的，但我不确定要更改什么。

先谢谢您的帮助。

Answer 1

基本上，您只需要使用SVG圆形路径定义一个对象，并将其分配给标记的icon属性。 这是我执行类似操作的部分代码。 请注意，您将需要使用path定义和/或scale属性来获得所需的结果，但这演示了整体配方：

// Somewhere in your code you define an object you'll use as an icon.
// You only need to instantiate this once.
var circleIcon = {
    path: 'M 0, 0 m -10, 0 a 10, 10 0 1, 0 20, 0 a 10, 10 0 1, 0 -20, 0',
    fillColor: '#00FFFF',
    fillOpacity: 0.0,
    scale: 1,
    strokeColor: '#00FFFF',
    strokeWeight: 2,
    strokeOpacity: 0.8
};


// Then elsewhere in your code you can create markers like this.
// Many markers can reference the same icon object.
var latLng = new google.maps.LatLng(33.9958, -80.8896);

var circleMarker = new google.maps.Marker({
    icon: circleIcon
    position: latLng,
    map: map
});


// Optionally, you can use methods like these set marker properties.
//circleMarker.setPosition(latLng );
//circleMarker.setVisible(true);
//circleMarker.setMap(map);

另一方面，关于保留“一点点隐私”，听起来您的圆心仍然代表着用户的真实位置。 因此，您可能要考虑将一些微妙的随机偏移量引入到地理编码器中的LatLng坐标中。 根据对十进制度数的快速回顾，纬度和经度值的波动范围为0.001 +/- 0.001至0.009，应该使您有大约100至1000米的晃动，这可能足以满足您的目的。 如果我这样做的话，我可能会看一些样本点，然后将它们的真实位置与它们的“随机偏移”位置进行比较，然后再使用它，主要是为了对它进行真实性检查。