[BUG] hide/show advanced markers does not work

[vicb]

Environment details

I am using the beta channel of Google Maps and @googlemaps/markerclusterer at 2.1.3

I am adding a bunch of marker to a clusterer:

      for (const launch of this.launches) {
        markers.push(
          new google.maps.marker.AdvancedMarkerElement({
            position: { lat: launch.lat, lng: launch.lon },
            title: launch.title,
          }),
        );
      }
      this.clusterer.addMarkers(markers);
      this.clusterer.setMap(this.map);

At this point everything works fine.

Then I hide the markers:

      this.clusterer.setMap(null);

After that all the markers are hidden as expected

Then I want to show the markers again:

      this.clusterer.setMap(this.map);
      this.clusterer.render(); // calling that makes no difference

That has no effect.
I would effect the marker the show after this call.
But I have to zoom (either in on out) for the marker to re-appear.

I would be up to create a repro if you have a starter template - all the GMaps starters for the JS API website seem to have an issue with the API key.

[wangela]

If you would like to upvote the priority of this issue, please comment below or react with 👍 so we can see what is popular when we triage.

@vicb Thank you for opening this issue. 🙏
Please check out these other resources that might help you get to a resolution in the meantime:

• Check the issue tracker - bugs and feature requests for Google Maps Platform APIs and SDKs
• Open a support case - Get 1:1 support in Cloud Console.
• Discord - chat with other developers
• StackOverflow - use the google-maps tag

This is an automated message, feel free to ignore.

[vicb]

I have done a screencast of the issue.
You can see that when I re-enable the sites nothing happens until I zoom on the map.

Also I tried to setMap(null) / setMap(map) on an advanced marker and it works well w/o the Clusterer -see this jsfiddle

[novakand]

Good afternoon. Same problem. Already have a solution?

[askurat]

Was there ever a fix for this? I am having the same issue.

[amuramoto]

Did a little debugging on this. The MarkerClusterer.clusters array is being emptied when MarkerClusterer.setMap() is called, regardless of whether it's being called with map or null. Not sure why this would be happening since as far as I can tell MarkerClusterer.setMap() is just OverlayView.setMap(), which should just add and remove the overlay from the map. I would think the members of the MarkerClusterer instance would remain intact, but that doesn't seem to be the case.

[amuramoto]

A workaround is to iterate MarkerClusterer.clusters and call setMap on each Cluster.marker rather than on MarkerClusterer:

clusterer.clusters.map(cluster => cluster.marker.setMap(null))
clusterer.clusters.map(cluster => cluster.marker.setMap(map))

See ln 47-53 of this jsFiddle.

[t53m1]

@amuramoto your fiddle is working as expected but in my code I am receiving a ts error. I have attached the screenshot below. Any way to work around this?

[t53m1]

I got it working by ignoring the warnings/errors. This does hide the markers and clusters, but once you zoom in/out, they rerender

[FlorianBruniaux]

Hello, any news on this ?