在GoogleMap上实现聚类

时间:2018-04-25 11:39:38

标签: javascript google-maps marker

如何在地图上实现标记的聚类?帮我清除错误。必要的脚本已连接。错误:enter image description here



function CustomMarker(latlng, map, imageSrc) {
    this.latlng_ = latlng;
    this.imageSrc = imageSrc;
    this.setMap(map);
}
CustomMarker.prototype = new google.maps.OverlayView();
   ...

var map = new google.maps.Map(document.getElementById("map"), {
    zoom: 17,
    center: new google.maps.LatLng(48.42216, 44.31308),
    mapTypeId: google.maps.MapTypeId.ROADMAP
});
var data = [{
    profileImage: "./images/1.jpg",
    pos: [48.42217, 44.31308]
}, {
    profileImage: "./images/2.jpg",
    pos: [48.42220, 44.31308]
}];
for(var i=0;i<data.length;i++){
    new CustomMarker(new google.maps.LatLng(data[i].pos[0],data[i].pos[1]), map,  data[i].profileImage)
}
var markerCluster = new MarkerClusterer(map, data,
    {imagePath: 'https://developers.google.com/maps/documentation/javascript/examples/markerclusterer/m'});
&#13;
&#13;
&#13;

1 个答案:

答案 0 :(得分:0)

请查找此代码段可能有助于您的事业。

function initialize(markers) {

  map = new google.maps.Map(document.getElementById('main-map'), {

  zoom:3,

  center: new google.maps.LatLng(markers[0].Latitude, markers[0].Longitude),

  mapTypeId: google.maps.MapTypeId.ROADMAP,
  mapTypeControl: false,
  streetViewControl: false,
  panControl: false,
  zoomControlOptions: {
    position: google.maps.ControlPosition.LEFT_BOTTOM
  }
});



for (var i = 0; i < markers.length; i++) {
  var image = '/Festool/media/Festool%20Images/Festool%20Icons/location-icon.png';
  var marker = new google.maps.Marker({

    position: new google.maps.LatLng(markers[i].Latitude, markers[i].Longitude),
    map: map,
    icon:image,
    title: 'Click to zoom'
  });
  var infowindow = new google.maps.InfoWindow({
    maxWidth: 250,

  });

  mar.push(marker);

  google.maps.event.addListener(marker, 'click', (function(marker, i) {

    return function() {
      infowindow.setContent( ContentString(i));
      infowindow.open(map, marker);


    }
      })(marker, i));  
}

}