How can I remove the white border from HighCharts pie chart?

Question

I am using High-charts to show pie charts, can any one tell me how can I remove this white border around the radius. My code is given below also the screen shot image of chart.

I have no lot of experience with high-charts if anyone know this please help me. The documentation is also very tough to read and understand

 $(function () { $('#cashflow_graph').highcharts({ chart: { type: 'pie', backgroundColor:'red', }, title: { text: false }, yAxis: { title: { text: false } }, plotOptions: { pie: { dataLabels: { enabled: false }, shadow: false, center: ['50%', '50%'] }, series: { states: { hover: { enabled: false, halo: { size: 0 } } } }, }, credits: { enabled: false }, tooltip: { enabled: false, valueSuffix: '%' }, series: [{ name: 'Cash Flow', data: [ { name: 'Incoming', y: 40, color: '#87b22e' }, { name: 'Outgoing', y: 30, color: 'black' }, { name: '', y: 30, color: 'white' } ], size: '80%', innerSize: '80%', dataLabels: { enabled: false, formatter: function () { return false; } } }] }); }); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/highcharts/4.1.5/highcharts.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/highcharts/4.1.5/highcharts-more.src.js"></script> <div id="cashflow_graph" style="height: 300px; width:100%;"></div> 

Answer 1

You need to set the plotOptions.pie.borderWidth property to 0 :

 $(function() { $('#cashflow_graph').highcharts({ chart: { type: 'pie', backgroundColor: 'red', }, title: { text: false }, yAxis: { title: { text: false } }, plotOptions: { pie: { dataLabels: { enabled: false }, shadow: false, center: ['50%', '50%'], borderWidth: 0 // < set this option }, series: { states: { hover: { enabled: false, halo: { size: 0 } } } }, }, credits: { enabled: false }, tooltip: { enabled: false, valueSuffix: '%' }, series: [{ name: 'Cash Flow', data: [{ name: 'Incoming', y: 40, color: '#87b22e' }, { name: 'Outgoing', y: 30, color: 'black' }, { name: '', y: 30, color: 'white' } ], size: '80%', innerSize: '80%', dataLabels: { enabled: false, formatter: function() { return false; } } }] }); }); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/highcharts/4.1.5/highcharts.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/highcharts/4.1.5/highcharts-more.src.js"></script> <div id="cashflow_graph" style="height: 300px; width:100%;"></div>