Heatmap Layer not displaying in Google Maps API (@react-google-maps/api)

[richardsondx]

Issue template

Please provide an explanation of the issue

The instruction provided in the docs for Heatmap layers are not working. When I follow the instruction the heatmap layer doesn't appear.

https://react-google-maps-api-docs.netlify.app/#!/HeatmapLayer/1

Related Stackoverflow issue: https://stackoverflow.com/questions/72219002/heatmap-layer-not-displaying-in-google-maps-api-react-google-maps-api

Your Environment

os: mac

node --version v16.13.1

react version

webpack version

@babel version

@react-google-maps/api version

"^9.4.5"

How does it behave?

The map appears with no errors and there are not heatmap layers. None of the point provided are showing.

How should it behave correctly?

The heatmaps points should appear on the map and the heatmap layer should appear.

Basic implementation of incorrect behavior in codesandbox.com

[diskomo]

Also experiencing this when trying to implement Heatmaps, or even Markers or any other children of the GoogleMap component.

[alexandre1921]

Also experiencing this, but only for Heatmaps.

[diskomo]

@alexandre1921 It's due to it being a class component, apparently. Some of the components have been converted to functional and some have not. I have a PR here adding the HeatmapLayerF component and my project now works with heatmaps :)

[JustFly1984]

closing an issue due to HeatmapLayerF implemented.

[olafkotur]

Fix proposed by @diskomo worked well! Thanks 👍🏽