谷歌地图的圆形不是完美的圆形。

11

我正在尝试在Google地图上绘制许多圆(每个屋顶有许多圆)。

我尝试使用Circle类,对于大型圆形似乎还可以,但是当绘制小圆时,它们根本不是圆形。

我正在使用的代码如下:

for(var i = 0; i < latitudes.length; i++)
    var newCircle = new google.maps.Circle({
        strokeColor: "#FFFFFF",
        strokeOpacity: 0,
        strokeWeight: 1,
        fillColor: "#FFFFFF",
        fillOpacity: 1,
        map: map,
        center: new google.maps.LatLng(latitudes[i], longitudes[i]),
        radius: 0.5
    });
    newCircle.setMap(map);

结果是:带有白圆圈的 Google 地图

我知道在 Google 地图上绘制点的其他方法,但如果有办法使它们看起来像应该是圆形的,我真的很想采用 Google 的解决方案。

2个回答

12

你可以使用符号,它们应该是完美的圆形。试试这个:

var whiteCircle = {
    path: google.maps.SymbolPath.CIRCLE,
    fillOpacity: 1.0,
    fillColor: "white",
    strokeOpacity: 1.0,
    strokeColor: "white",
    strokeWeight: 1.0,
    scale: 1.0
};

然后

for(var i = 0; i < latitudes.length; i++) {
    var latLng = new google.maps.LatLng(latitudes[i], longitudes[i])
    var newCircle = new google.maps.Marker({
        icon: whiteCircle,
        position: latLng
    });
    newCircle.setMap(map);
}

圆圈可能很大,因此可以尝试调整比例以使其正确。

我从未使用过Circle类。符号是在今年的Google I/O中引入的。它们是矢量图形,意味着您几乎可以定义自己的形状。以下是更多信息的链接: googlegeodevelopers.blogspot.com/2012/06/powerful-data-visualization-with.html


谢谢,它能够完成任务。但是,从性能方面来说它们并不是非常高效的(google.maps.Circle也一样)。 - Nicolas
就性能而言,我不太清楚。我最近才开始使用向量而不是图像。编辑它们比切换标记要容易得多。我不经常绘制这些图像,但从我在Gmaps的经验来看,太多的标记会使其变慢(除了Flash地图时代)。 - nevi_me
我最终选择了自定义制造商,使用不同的PNG文件来表示圆形颜色,并通过大小属性进行缩放。 - Nicolas
3
有人能举个例子展示如何画一个圆形符号并使其大小固定吗?它们似乎会自动缩放,但我想让一个圆始终覆盖相同的区域。 - Rob
1
唯一的问题是符号的比例尺是相对于视口而不是地图上的距离比例尺。 - Mike Kormendy
1
你如何在保持解决方案的前提下,为圆形符号指定特定的半径(以米为单位)? - Gerardo Figueroa

-2

抗锯齿是至关重要的。

g2d.setRenderingHint(RenderingHints.KEY_ANTIALIASING, RenderingHints.VALUE_ANTIALIAS_ON)

Google的解决方案对于较小的圆形不起作用。


10
抱歉,什么是 g2d - Nicolas
3
@Nicolas似乎是使用Java编程语言(参考链接:http://docs.oracle.com/javase/7/docs/api/java/awt/RenderingHints.html)。 - Stefan Rogin

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接