javascript - 有没有办法在悬停时更改条形图中单元格的填充?- 图表
问题描述
我目前这样渲染图表:
<BarChart width={868} height={40} data={data}
margin={{top:0, bottom: 10, left:0, right:0}} barSize={5}>
<Tooltip
labelStyle={{ textAlign: 'left' }}
cursor={{fill: "blue"}}
position={{ x: this.state.mouseX - 20, y:-5 }}
/>
<Bar dataKey="blocks"
onMouseOver={e => this.getMouseX(e)} >
{
data.map((entry, index) => {
const result = entry.result > 4 ? TRASH : NO_TRASH;
return <Cell fill={result} key={index}/>;
})
}
</Bar>
</BarChart>
有没有办法在悬停栏时更改单元格/栏的颜色,而不是光标?
解决方案
我使用了这个示例并将 onClick 更改为 onMouseOver 事件。工作正常。
推荐阅读
- angular - 需要在执行另一个函数之前执行所有函数 - Angular
- python - 打印所有其他行值都小于 0.05 的行 ID
- android - Jfrog Xray 没有恢复 apk 的无 Violatoins/许可证问题
- windows - 为 tel 和 callto 协议注册 Windows 应用程序
- python - 如何在多线程进程中从搁置中“保存”归档数据?
- html - 我怎么知道父类是否有这个类 .child-div 使用 jQuery
- ios - Jenkins slather:找不到命令
- android - 如何在android compose中更改对话框的宽度
- python - 如何在 python pandas 中附加两个数据框
- ruby - 如何在 capybara 和 selenium 的 headless chrome 中使用剪贴板功能