React Google maps/ Markerclusterer multiple markers at same location

Question

I m using markerclusterer in my React-redux project to draw markers for all the companies. I have 3 companies having the same address. When I zoom in to the Map, I can see the number 3 (marker cluster) and when further zoomed i could see only 1 marker (for all the 3 companies). I need to display a single marker (filter companies from markerClusterer that have same address) and when marker is clicked, open dialog box to show company details. Initially when map is loaded, the markers are rendered (code below:)

      companies.map((company) => {
      this.marker = new google.maps.Marker({
      map: map,
      position: {lat: parseFloat(company.latitude),
                 lng: parseFloat(company.longitude)},
      icon: {url:'/src/images/blue_marker.png',
             size: new google.maps.Size(30, 30)},
      title: company.name + ' ' + company.vacancy.vacancy                  
      }); 
      options = {
        imagePath: '/src/images/m',
        maxZoom: 15,
        zoomOnClick: false
       };
       var markerCluster = new MarkerClusterer(map, markers, options);
       markerCluster.setMaxZoom(15);

Answer 1

https://medium.com/@robinttt333/google-maps-marker-clustering-part-2-a08f2789bc26

The above link will be help you. Issue is that when more than activities etc are coming on same location then we want to show cluster when you user click on cluster then map getting zooms to view the all activities or etc markers.

So the above blog is very helpfull you can check that.