@nivo/heatmap 库的 onClick 事件在反应中不起作用

问题描述

为@nivo/heatmap 添加 onClick 事件并使用 ReactHeatMapCanvas 不起作用,相同的事件处理程序仅适用于 SVG。 对此有任何帮助或建议。使用最新的 nivo/core 和 nivo/heatmap npm 包。


<ResponsiveHeatMapCanvas
      data={heatMapData.dataSample}
      keys={heatMapData.keys}
      indexBy="columnName"
      onClick={() => console.log('clicked')}
      margin={{ top: 200,right: 60,bottom: 100,left: 200 }}
      pixelRatio={1}
      minValue={0}
      maxValue={100}
      forceSquare={false}
      axisTop={{
        orient: 'top',tickSize: 19,tickPadding: 10,tickRotation: 51,legend: '',legendOffset: -12,}}
      axisRight={null}
      axisBottom={null}
      axisLeft={{
        orient: 'left',tickSize: 9,tickPadding: 5,tickRotation: -32,legendPosition: 'middle',legendOffset: -40,}}
      enableGridX={false}
      enableGridY={false}
      cellShape="rect"
      cellOpacity={1}
      cellBorderWidth={20}
      cellBorderColor={{ from: 'color',modifiers: [['darker','0']] }}
      enableLabels={true}
      labelTextColor={{ from: 'color','3']] }}
      motionStiffness={120}
      motiondamping={9}
      isInteractive={true}
      hoverTarget="cell"
      cellHoverOpacity={1}
      cellHoverOthersOpacity={0.1}
      colors="OrRd"
      padding={2}
    />

解决方法

暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!

如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@)