angular/components

docs-bug(MapMarkerClusterer): The example doesn't work

thovo opened this issue ยท 10 comments

thovo commented

Documentation Feedback

I tried to follow the same example in the README and nothing works, no errors happens. Could you please check and update with a working example ? The docs is also referring to Google Map Marker Cluster which is a version using Typescript or Javascript. I am not sure which example that I need to follow to make the code work.

Another issue is when loading the library, it still required to import the old script to make it work. It happens when I use Angular 18.
<script src="https://unpkg.com/@googlemaps/markerclustererplus/dist/index.min.js"></script>

Affected documentation page

https://github.com/angular/components/blob/main/src/google-maps/map-marker-clusterer/README.md

If you're on v18, but looking at the doc from the main branch, you're looking at v19 documentation. In v19 we'll replace the clusterer so that it doesn't depend on a deprecated clustering library. The old clusterer docs are still available in these places:

  1. https://github.com/angular/components/blob/main/src/google-maps/deprecated-map-marker-clusterer/README.md
  2. https://github.com/angular/components/blob/18.2.x/src/google-maps/map-marker-clusterer/README.md
thovo commented

Yeah, but the docs stays almost the same. The example in the docs is not quite complete and follow that example doesn't work. Could you please check the example ? A working example is very appreciated.

The initial issue doesn't have any example of what you're trying to do so it's hard to say why you aren't seeing anything. Off the top of my head, the example has markerPositions as an empty array why means that there aren't any markers on the map so there's nothing to cluster.

thovo commented

I tried to follow the example in my project and have a lot of markers. Wrapping these markers with the new map-marker-clusterer doesn't work, should I need to use deprecated-map-marker-clusterer? I am also using MapAdvancedMarker instead of the deprecated version.

The current map-marker-clusterer in v18 doesn't support advanced markers which was the other reason why we deprecated it. You'll have to either use the map-marker instead of the advanced one, or update to v19 to use the new clusterer.

thovo commented

Thank you a lot for your reactive! So I need to upgrade Angular, and Angular Components to v19 to make it work ? It looks like a force update, for now I think I will stick to MapMarker and DeprecatedMapMarkerClusterer. Can you update the docs please? Because I didn't see any mention about MapAdvancedMarker can't be used. Is there any differences that I need to notice when updating to the new version ?

It's not really a forced update since the deprecated clusterer never supported the advanced markers. It was abandoned by the Maps team before advanced markers event existed.

The differences you should watch out when updating are:

  1. You need to load a different clustering library. It's mentioned in the readme.
  2. The new clusterer has a different set of APIs so some of the inputs from the old one aren't supported anymore.
thovo commented

I see, thank you a lot for your clarification. For the inputs of Clusterer, I just need to check the library, is it right ?

thovo commented

Many thanks! There is not too much Input for the new version and you already put a JSDoc so I think it would be fine. Otherwise, the old version is not well documented, should I just need to follow the reference to Deprecated Google Map Clusterer ?