CustomLabel issue
DiyazY opened this issue · 2 comments
DiyazY commented
Hello i have an issue with CustomLabel, because it's not shown.
I want to use it as a ReactElement
const data = [
{ value: 20, key: 1, color: '#23e4ad',},
];
return <PieChart
data={data}
reveal={percantage}
lineWidth={10}
background="#555862"
lengthAngle={280}
totalValue={100}
startAngle={130}
labelPosition={0}
radius={40}
rounded
animate
label={<ChartLabel/>}
and here is my CustomLabel, ChartLabel
export default function ChartLabel(labelProps) {
console.log(labelProps );
return <div>
<span>100%</span>
<span>extra data</span>
</div>
}
Thanks)
toomuchdesign commented
Hi @DiyazY, since the chart renders into a svg
element, you have to use SVG elements instead of HTML elements to describe your label.
DiyazY commented
Thank you. It works for me