Chartjs-Is it possible to remove the border between the segments but leave the border around the pie chart in react-chartjs-2?

by

1👍

✅

You need to set the borderWidth as 0 in the pie’s arc configuration which by default is set to 2.

The arc configuration can be used in polar area, doughnut and pie
charts and is set under the elements key.

You can change it by either:

1. Setting the global arc options

Chart.defaults.global.elements.arc.borderWidth = 0;

2. Or through the options object that you passed to the chart

var options = {
  elements: {
    arc: {
      borderWidth: 0
    }
  }
};

See docs for more info.

0👍

I am writing this because marked answer didn’t help me, I guess it was changed in meanwhile.

You need to set borderWidth inside datasets that you are passing to data prop.

Example:

const data = {
        datasets: [{
          borderWidth:0,
          data: [9, 1],
          backgroundColor: ['#ffffff', '#000000'],
        }],
    };
    
    return (
      <Pie data={data} />
    )

Leave a comment