javascript - 如何去除 HighCharts 饼图中的白色边框？

Question

我正在使用 High-charts 来显示饼图，谁能告诉我如何去除半径周围的白色边框。我的代码也在下面给出了图表的屏幕截图。

我对 Highcharts 没有太多经验，如果有人知道这一点，请帮助我。文档也很难阅读和理解

$(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

您需要将 plotOptions.pie.borderWidth 属性设置为 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>