Jak mogę usunąć białą ramkę z wykresu kołowego HighCharts?

Question

Używam wysokich wykresów do wyświetlania wykresów kołowych, czy ktoś może mi powiedzieć, jak mogę usunąć białą ramkę wokół promienia. Mój kod jest podany poniżej również zrzutu ekranu wykresu.

Nie mam dużego doświadczenia z wysokimi wykresami, jeśli ktoś o tym wie, pomóż mi. Dokumentacja jest również bardzo trudne do odczytania i zrozumienia

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

Musisz ustawić plotOptions.pie.borderWidth nieruchomość do 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>