How to add an onClick event on cluster image ?

TapanPatra1 — Fri, 07 Jun 2024 06:20:46 GMT

Hi All,

I am facing difficulties to add an onClick event to the cluster image in ReactJs application,

Below image is the cluster example - If we manually zoom to the maximum level, the cluster is removing and showing three individual data points.

But here I want, when i click only on the cluster image, it should zoom to the maximum level and display only the individual three data,

How to add an event to the cluster image or any other way to do this ?

const clusterConfig = { type: "cluster", clusterRadius: "100px", clusterMinSize: "30px", clusterMaxSize: "50px", labelingInfo: [{ deconflictionStrategy: "none", labelExpressionInfo: { expression: "Text($feature.cluster_count, '#,###')" }, symbol: { type: "text", color: "#fff", font: { weight: "bold", family: "Noto Sans", size: "18px" }, }, labelPlacement: "center-center", }], symbol: { type: "picture-marker", url: "https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcQa88gtYlcIGYRv5X5yEs7NbJ5JkJdDvzCmLf41BtSCgHqCodZV2fa4ZIjCjroPj27SQCE&usqp=CAU", width: "50px", height: "50px", }, };

Re: How to add an onClick event on cluster image ?

TapanPatra1 — Mon, 10 Jun 2024 05:00:35 GMT

Hi All,

I found how to access the click event on a cluster, and upon clicking the cluster, I can zoom to the maximum level. However, I encountered an issue where the map center does not align with the points data; instead, it centers on a different area.

How can I display the center of the points data on the screen when a cluster is clicked?

Here is the click event code,

view.on("click", (event) => { view.hitTest(event).then(({ results }) => { if(results[0].layer?.featureReduction?.type === "cluster" ){ view.goTo(results[0].graphic.geometry).then(() => { view.zoom = 23; }) } }); });

topic Re: How to add an onClick event on cluster image ? in ArcGIS JavaScript Maps SDK Questions

How to add an onClick event on cluster image ?

Re: How to add an onClick event on cluster image ?