2016-08-08 15 views
0

円グラフの周りの境界線を削除する方法。円グラフの周りの境界線をハイチャートで削除します

enter image description here

私は、次のオプションを試してみましたが、それはうまくいきませんでした:

plotOptions.pie.borderWidth:0
plotOptions.pie.borderColor: '#f2f2f2の' はまた、動作しませんでした。

$('#PreQualifiedChart').highcharts({ 
    chart: { 
     plotBackgroundColor: '#f2f2f2', 
       plotBorderWidth: 0, 
         plotShadow: false, 
         height: 300, 
        widht: 250, 
       }, 
    credits: { 
      enabled: false 
    }, 
    exporting: { 
     buttons: { 
      contextButton: { 
       enabled: false 
      } 

     } 
    }, 
    title: null, 
    tooltip: { 
       headerFormat: '', 
        pointFormat : '{point.name}: <b>{point.y} ({point.percentage:.1f}%)</b>' 
      }, 
    plotOptions: { 
       pie: { 
       dataLabels: { 
      enabled: true, 
         distance: -50, 
         style: { 
          fontWeight: 'bold', 
           color: '#f2f2f2', 
           textShadow: '0px 1px 2px black' 
           } 
           }, 
       center: ['50%', '50%'], 
       borderWidth: 0, 
       borderColor: '#f2f2f2' 
        } 
           }, 
     series: [{ 
            dataLabels: { 
           enabled: false, 
      }, 
          type: 'pie', 
          name: '', 
           innerSize: '50%', 
         data: [ 
        { 
      name: 'Submitted All Docs', 
      y: SAD, 
      color: '#4B99D2', 
        labels: { 
       enabled: false 
       }, 
       }, 
       { 
        name: 'Submitted Missing Docs', 
        y: SMD, 
         color: '#e5a34a', 
          labels: { 
         enabled: false 
       }, 
       }, 
       { 
        name: 'Not Submitted', 
        y: NS, 
        color: '#844b03', 
        labels: { 
        enabled: false 
       }, 
       } 
      ] 
      }] 
         }); 
+3

私は私が正しくあなたを理解してかどうかわからないけど、私は1つのアイデアがあると思いますあなたのケースではmarginTop、marginBottomなどを使う:http://jsfiddle.net/pe4csrr7/3/そしてもう一つはplotBackgroundColorの代わりにbackgroundColorを設定することだ:http://jsfiddle.net/pe4csrr7/4/ –

+0

あなたが作成したあなたの背景色で "境界線"を設定します。チャートとプロット領域の両方に背景色のオプションがあり、チャートの背景はデフォルトで白です。リファレンス:http://api.highcharts.com/highcharts#chart.backgroundColor | http://api.highcharts.com/highcharts#chart.plotBackgroundColor – jlbriggs

+0

@GrzegorzBlachliński働いていただきありがとうございます。あなたが答えの下に同じものを置くことができれば、それを正しい答えとしたいと思います。 –

答えて

1

私はあなたがあなたのケースでmarginTop、marginBottomなどを使用することができると思います。

はここで完全なコードです。ここでは、Highcharts APIでこのパラメータに関する情報を見つけることができます。

http://api.highcharts.com/highcharts#chart.marginTop http://api.highcharts.com/highcharts#chart.marginBottom http://api.highcharts.com/highcharts#chart.marginLeft http://api.highcharts.com/highcharts#chart.marginRight

ここでは、あなたのチャートは、このアプローチでも動作する方法の例を見つけることができます。

chart: { 
     marginTop: 0, 
     marginBottom: 0, 
     marginLeft: 0, 
     marginRight: 0, 
     plotBackgroundColor: '#f2f2f2', 
     plotBorderWidth: 0, 
     plotShadow: false, 
     height: 200, 
     widht: 150, 
    }, 

http://jsfiddle.net/pe4csrr7/3/

もう1つのアイデアは、背景色の代わりplotbackgroundColorは、ここであなたはそれを動作できるかの例を見ることができます:

chart: { 
    backgroundColor:'#f2f2f2', 
    plotBorderWidth: 0, 
    plotShadow: false, 
    height: 200, 
    widht: 150, 
}, 

http://jsfiddle.net/pe4csrr7/4/

よろしく、

関連する問題