Unable to open a Popup via clicking on the Marker inside Cluster

[debotos]

Inside Cluster, a popup doesn't open if I click on a marker.

When I am zoomed and at that point, there is no cluster point only the marker then if I click on the marker it should open a popup(i setup an onClick listener in Marker child component)

[stepankuzmin]

Hey @debotos! Could you please provide a code example for this issue?

[debotos]

Hey @stepankuzmin! Thanks for the response.
Basically, I am trying to reproduce https://www.heirizon.com/ this with Cluster.
But when I am clicking on the single marker it behaves differently and multiple marker it just crash.

[stepankuzmin]

Could you please provide a reproducible example for this issue? What are you trying to do? How do you render Markers with Cluster?

[debotos]

Here is the repo, https://github.com/debotos/urbica-react-map-gl

[debotos]

In short, I want to show a popup when clicking on a particular marker at a low level(zoom in).

[stepankuzmin]

I think that you have to move your this._renderPopup() method out of Cluster's children. You should not render anything but Markers that you want to clusterize as Cluster's children.

Consider example:

<MapGL ...>
  <Cluster ...>
    {data.map(this._renderMarker)}
  </Cluster>
  {gotUserLocation && this._renderUserLocation()}
  {this._renderPopup()}
</MapGL>

[debotos]

Hey @stepankuzmin!
Really thanks! Now the single marker is working but not the multiple markers.
Kindly will you please have a look on it (i attached a video link)- https://www.useloom.com/share/fafcfbc8f4d54f1dbe6be8d54daa4cfd

[debotos]

Hey @stepankuzmin!
Multiple markers working now!
The problem was this lib doesn't support null for an empty element, [] represent an empty element.
But in (https://uber.github.io/react-map-gl/) null represent empty element.
Please have a look at the video what I expected...
https://www.useloom.com/share/1d1f1c05ab49456fad953fd481b42df5