Black Lives Matter. Please consider donating to Black Girls Code today.

How to pass click event to plotly component (reactJs)

Greetings,
I want to create a click event or override the click event of plotly chart(type : choropleth).I passed the component like,


{chData? (
<Plot
className=“download_stat_map”
data={chData}
layout={layout}
config={{ showLink: false }}
plotly_click={this.onClick}
/>
) : null}

I tried with “onClick” and “onPlotlyClick” key also.

Can anybody tell me what’s the issue with this

1 Like

@aasthaTalwaria

Maybe, This is what you want!

      <Plot
        data={data}
        layout={layout}
        onClick={() => console.debug("onClick")}
        onHover={() => console.debug("onHover")}
        onUnhover={() => console.debug("onUnhover")}
      />

Plotly.js’ Event Handler and React props are attached here!

sample: https://codesandbox.io/s/4w1q9kpzm9

1 Like