我想在餅圖上添加陰影。我正在使用 recharts 庫。


如果您有任何解決方案,請告訴我。謝謝。
uj5u.com熱心網友回復:
您可以在組件上添加陰影過濾器Cell以添加此效果。我只是通過style道具傳遞了值,但你可以做任何最適合你的事情。

<PieChart width={800} height={400}>
<Pie
data={data}
cx={120}
cy={200}
innerRadius={70}
outerRadius={80}
fill="#8884d8"
dataKey="value"
>
{data.map((entry, index) => (
<Cell
key={`cell-${index}`}
fill={COLORS[index % COLORS.length]}
style={{
filter: `drop-shadow(0px 0px 5px ${COLORS[index % COLORS.length]}`
}}
stroke="0"
/>
))}
</Pie>
</PieChart>
作業示例 CodeSandbox:https ://codesandbox.io/s/pie-chart-with-drop-shadow-fxe8x?file=/src/App.tsx
轉載請註明出處,本文鏈接:https://www.uj5u.com/yidong/432824.html
上一篇:文本隱藏在SVG后面
