如何解决@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 举报,一经查实,本站将立刻删除。