-1

How to realize clustering of markers on the map? Help me clear errors. necessary scripts are connected. Error: 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'});
user_211200
  • 1
  • 1
  • 6
  • possible duplicate of [How add circle Shape in Google maps custom icon?](https://stackoverflow.com/questions/46416883/how-add-circle-shape-in-google-maps-custom-icon) – geocodezip Apr 25 '18 at 12:08

1 Answers1

0

Please find this code snippet might help your cause.

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));  
}

}

TECHIE92
  • 11
  • 3