尝试检查标记是否在边界内并触发onclick事件。但是,如果使用getPosition()和contains()来检查标记是否在绑定范围内,那就没有运气了。
有人可以指出如何检查标记是否在边界内?
function _onMapZoom () {
console.log('testing')
if(map.zoom < mcOptions.maxZoom){
return;
}
var mapMarkers = oms.markersNearAnyOtherMarker();
if (mapMarkers.length <= 0) {
return;
}
var bounds = map.getBounds();
var ne = bounds.getNorthEast(); // LatLng of the north-east corner
var sw = bounds.getSouthWest(); // LatLng of the south-west corner
var nw = new google.maps.LatLng(ne.lat(), sw.lng());
var se = new google.maps.LatLng(sw.lat(), ne.lng());
for (var i = 0; i < mapMarkers.length; i++) {
var element = mapMarkers[i];
//CHECK IF LAT LON OF MARKER IS WITHIN BOUNDS
var markerIsOrNotInBounds = map.getBounds().contains(mapMarkers.getPosition());
console.log(markerIsOrNotInBounds)
if (markerIsOrNotInBounds) {
continue;
}
gm.event.trigger(marker[i], 'click');
}
}
答案 0 :(得分:0)
可能只有一组蜘蛛标记,而且点击一个蜘蛛标记会取消当前的蜘蛛标记组。
解决方案:触发点击后立即离开该功能。
google.maps.event.addDomListener(window,'load',function() {
var gm = google.maps,
map = new gm.Map(document.getElementById('map_canvas'), {
center: new gm.LatLng(50, 0),
zoom: 6
}),
oms = new OverlappingMarkerSpiderfier(map,
{markersWontMove: true, markersWontHide: true}),
places=[{lat:50,lng:0},{lat:51,lng:-1},{lat:50,lng:1}];
//some random markers
for(var p=0;p<places.length;++p){
for (var i = 0; i < 10; i++) {
(function(index){
var marker=new gm.Marker({map:map,
position:{lat:(Math.random()*.1)+places[p].lat,
lng:(Math.random()*.1)+places[p].lng}});
oms.addMarker(marker);
})(i)
}
}
function _onMapZoom () {
var bounds = map.getBounds(),
markers = oms.markersNearAnyOtherMarker();
for(var i=0;i<markers.length;++i){
if(//when marker is within map-bounds
bounds.contains(markers[i].getPosition())
){
gm.event.trigger(markers[i],'click',{latLng:markers[i].getPosition()});
//no need to trigger further clicks
return;
}
}
}
//wait until map-projection is available until you set the listener
gm.event.addListenerOnce(map,'idle',function(){
gm.event.addListener(this,'zoom_changed',_onMapZoom)
gm.event.trigger(this,'zoom_changed');
});
});
html,body,#map_canvas{height:100%;margin:0;padding:0}
<script src="http://maps.google.com/maps/api/js?v=3.9&sensor=false"></script>
<script src="http://jawj.github.io/OverlappingMarkerSpiderfier/bin/oms.min.js"></script>
<div id="map_canvas"></div>