Chartjs-Pie Chart Label is not visible in ReactJS

3👍

Adding this works for me.

label={(props) => { return props.dataEntry.title;}}

Example

    <PieChart
    label={(props) => { return props.dataEntry.title;}}
    data={[{ title: "One", value: 10, color: "#E38627" },
           { title: "Two", value: 15, color: "#C13C37" },
           { title: "Three", value: 20, color: "#6A2135" },
    ]}
    />

Its works at least for display labels, but you can customize it for showing percentage as well.

2👍

A good way to solve it is to provide a label function

<PieChart ... 
label={props => { return props.data[props.dataIndex].label;}}
/>    

You can also just provide label={true} but then it will show te value not the label in the data array.

Leave a comment