我检查了我制作的 map 应用程序,发现我的标记已经转移,并且只有在页面缩小时才会显示在 Chrome 中。多边形渲染良好,但标记不再在 Firefox 中渲染,并在 Chrome 中移动(当它们出现时)。
在屏幕截图中,您可以看到标记不再像应有的那样位于曼哈顿上方。
最近对 Maps API 的哪些更改可能导致了这种情况?我查看了过去几个月的发行说明,似乎没有任何内容适用于这种突然的转变。
这是我如何创建标记的片段:
$.each(data[i], function(key, val){
var myLatlng = new google.maps.LatLng(val.lat, val.long);
var marker = new google.maps.Marker({
position: myLatlng,
icon: {
url: markerIcon,
anchor: new google.maps.Point(30,30),
},
map: map,
});
markers.push(marker);
});
我已经尝试指定发布 (3.25) 和卡住 (3.24) 版本,但遇到了同样的问题。几个月前,我一直在使用实验性的(未指定版本)并将标记加载到适当的位置。
编辑:
我发现使用 SVG 作为我的标记存在问题。
url: markerIcon,
中的 markerIcon
是 SVG 文件的路径。如果我使用 PNG 或 JPG 文件,问题就解决了。
研究使用 Symbols 代替我的 SVG。仍然不确定 Chrome、Firefox 或 Maps API 中的哪些更改会导致这个新错误。
最佳答案
更新我的标记以使用符号来保存 SVG 信息而不是链接到 SVG 文件有效:
var transparentCircle = {
path: 'M-5,0a5,5 0 1,0 10,0a5,5 0 1,0 -10,0',
fillColor: 'red',
fillOpacity: 0.5,
scale: 1,
strokeWeight: 0
};
...
var marker = new google.maps.Marker({
position: myLatlng,
icon: transparentCircle,
map: map,
});
但是,仍然不确定 Chrome、FF 或 Maps API 中的哪些更改破坏了原始 SVG 设置。
关于javascript - Maps API 中的哪些最新更改可能导致标记向右移动并消失?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/39382695/