javascript - 如何在叠加层上放置标记

标签 javascript google-maps google-maps-api-3 google-maps-markers panes

我有一个小的 Google map 页面,用于记录车祸的位置。如果事故发生在距办公室 65 英里以内,则处理方式不同。所以我用下面的代码在中心画了一个带有标记的圆。

var s25 = new google.maps.LatLng(53.3664887, -1.236279);
var el=document.getElementById("map_canvas");
map = new google.maps.Map(el, myOptions);

 var marker = new google.maps.Marker({
    map: map,
    position: s25
});

 var sunCircle = {
    strokeColor: "#c3fc49",
    strokeOpacity: 0.8,
    strokeWeight: 2,
    fillColor: "#c3fc49",
    fillOpacity: 0.35,
    map: map,
    center: s25,
    radius: 104607.36 // in meters
};
cityCircle = new google.maps.Circle(sunCircle);
cityCircle.bindTo('center', marker, 'position');

这工作正常,我用来在事故位置放置新标记的代码工作正常,但仅当位置在圆圈外时。 Google map 不允许我在圆圈内放置标记。

我做了一些研究并找到了一些关于 Map Panes 的信息这听起来很理想,但我不确定如何调用它,因为当我这样做时,我只是收到一个未定义的错误。

任何帮助将不胜感激:)

最佳答案

设置clickable:false在圆圈上。或者将 MouseEvents 的事件监听器添加到圆圈并使用它们来放置标记。

关于javascript - 如何在叠加层上放置标记,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/13602059/

相关文章:

javascript - HTML Canvas 缩放至图表上的区域

javascript - 将 $scope 放在 Cytoscape 点击事件中

javascript - 谷歌地图 API : Total distance with waypoints

javascript - AngularJS 与 Angular-Google-maps : Add Marker through fomr and Find me

ajax - 使用 url 编码获取拾取点的问题,而谷歌地图距离计算

javascript - ui 路由器不显示模板

javascript - 如何在启用 ES6 功能的情况下运行 Node.js 应用程序?

java - 带 map 的本地应用程序

火狐和谷歌地图 API v3 : IndexSizeError

google-maps - 如何防止 Google Maps API v3 DirectionsService 生成的结果受到当前交通状况的影响?