Chartjs-How to remove the inside-border from a single-element doughnut chart? Chart.js

10👍

You can set borderWidth property to 0.

options: {
  elements: {
      arc: {
          borderWidth: 0
      }
  }
}

jsfiddle

Update

If you just want to remove only one border then you can do this using following code

datasets: [{
  data: [1, 2, 3, 4],
  backgroundColor: ["#BDC3C7","#9B59B6","#E74C3C","#26B99A"],
  borderWidth: [0, 1, 1, 0]
}]

jsfiddle

0👍

Just check how many segments you have.

const isMultipleSegment = seriesData.filter(val => val > 0).length > 1;

If more than one – remove border from chart config.

borderWidth: isMultipleSegment ? 2 : 0,

Leave a comment