Javascript Recharts:关闭条形图的背景悬停
有没有办法关闭中条形图悬停时显示的灰色背景 使用版本1.4.1。代码(简化)如下所示:Javascript Recharts:关闭条形图的背景悬停,javascript,reactjs,d3.js,recharts,Javascript,Reactjs,D3.js,Recharts,有没有办法关闭中条形图悬停时显示的灰色背景 使用版本1.4.1。代码(简化)如下所示: 从“React”导入React //雷查特 从“recharts”导入{Bar,BarChart,CartesianGrid,ResponsiveContainer,Tooltip,XAxis,YAxis} 从“./CustomTooltip”导入CustomTooltip 常量条形图=({chartData,chartInfo})=>( {chartInfo.map(条=>( ))} ) 导出默认条形图
从“React”导入React
//雷查特
从“recharts”导入{Bar,BarChart,CartesianGrid,ResponsiveContainer,Tooltip,XAxis,YAxis}
从“./CustomTooltip”导入CustomTooltip
常量条形图=({chartData,chartInfo})=>(
{chartInfo.map(条=>(
))}
)
导出默认条形图
我已经浏览了一遍,也浏览了源代码。这似乎不是一种实现它的方法,但是一些演示已经禁用了它,比如
我试着用像那个演示一样的自定义形状设置我的,并用
单元格
而不是条形图
进行渲染,但背景仍在悬停状态。背景颜色为#ccc
,但使用该关键字搜索存储库时,没有明确的方法或道具可尝试覆盖或连接。您可以使用
上的光标道具来实现所需:
<Tooltip cursor={{fill: '#f00'}} />
正文{
保证金:0;
}
#容器{
-webkit框大小:边框框;
-moz框大小:边框框;
框大小:边框框;
填充:10px;
宽度:800px;
高度:800px;
背景色:#fff;
}
您提到的灰色区域称为光标。引用API文档:
如果设置为false,则工具提示处于活动状态时不会绘制光标
因此,你的问题的答案是:
<Tooltip cursor={false} />
顺便说一句,我正在使用recharts@1.7.1太棒了!我想我以前肯定试过,但我想不是因为我刚才试过,而且效果很好。非常感谢。使用以下代码关闭背景色,这应该在文档中。非常感谢你。