如何在所有图表中创建React Recharts工具提示模式？
如何在所有图表中创建React Recharts工具提示模式？
提问于 2016-10-19 13:49:09
我正在使用React Recharts (http://recharts.org)来绘制带有自定义工具提示的条形图。
<BarChart width={400} height={300} data={data}
margin={{top: 5, right: 30, left: 10, bottom: 5}}>
<XAxis dataKey="name"/>
<YAxis/>
<CartesianGrid strokeDasharray="3 3"/>
<Tooltip content={<CustomTooltip/>}/>
<Legend />
<Bar dataKey="pv" barSize={20} fill="#8884d8" />
</BarChart>但我的工具提示框非常大，如下所示：
http://jsfiddle.net/jiangzhang/zjbbbdtj/11/
我发现工具提示框的一部分隐藏在第二张图表后面。如何使其成为所有图表中的模式？
回答 2
Stack Overflow用户
发布于 2021-03-16 06:13:31
您可以在自定义内容呈现器<Tooltip content={renderTooltip} />中使用React Portals来完成此操作
下面是一个没有门户的基本示例：http://recharts.org/en-US/examples/CustomContentOfTooltip
在此处重新绘制问题以使其成为默认值：https://github.com/recharts/recharts/issues/2458
Stack Overflow用户
发布于 2016-10-19 19:05:00
您可以尝试使用css来设置tooltip元素的z顺序的样式，以便它高于文档中的所有其他元素。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/40123182
复制相关文章
相似问题
腾讯云开发者
