Skip to content

Add click output to clusterer #22020

@maartenvanasperen

Description

@maartenvanasperen

What are you trying to do?

I am trying to create a listener on a marker cluster. So I can get all markers from that clicked cluster event.
But It doesn't seem to work with a google maps example and I cant find any documentation about cluster clicks on https://github.com/angular/components/blob/master/src/google-maps/map-marker-clusterer/README.md.

What troubleshooting steps have you tried?

I tried to add a listener to the MapMarkerClusterer, see code below. The listener code is from this example: https://github.com/googlemaps/js-markerclustererplus/blob/df5fcb3dca33051ad6690093a5ca51e4d5c81de9/examples/events_example.html#L65
I also tried the default (click) from Angular, but I don't get an event.

Current code (not working)

// map.component.html

<map-marker-clusterer (click)="clusterClick()" [zoomOnClick]="false">
            <map-marker #marker="mapMarker" *ngFor="let result of results"
                        [position]="result.position"
                        [options]="markerOptions"
                        (mapClick)="selectMarker(marker, result)"
            >
            </map-marker>
       </map-marker-clusterer>
// map.component.ts

@ViewChild(MapMarkerClusterer, { static: false }) markerClusterer: MarkerClusterer;

for (const markerCluster of this.markerClusterer.getClusters()) {
          google.maps.event.addListener(markerCluster, 'click', c => {
              console.log(c.getMarkers());
          });
 }

Environment

  • Angular: 8
  • Browser(s): Chrome
  • Operating System (e.g. Windows, macOS, Ubuntu):

So how can I get a cluster click event to work, so I can get all the markers from that cluster and implement that in my code?

Metadata

Metadata

Assignees

Labels

P3An issue that is relevant to core functions, but does not impede progress. Important, but not urgentarea: google-mapsfeatureLabel used to distinguish feature request from other issues

Type

No type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions