饼图颜色变化高图库

Question

我正在为我的项目使用 High Chart Js 库。 我创建了饼图。 它运作良好。 我需要如何更改饼图颜色。 我怎么做？ 请检查我的javascript代码

Highcharts.chart('false-positive-graph', { chart: { type: 'pie' },

            title: {
                  text: 'False Positive % Suspicious incidents',
                style: {fontSize: '12px',
                    fontFamily :"'Helvetica Neue', 'Helvetica', 'Arial', sans-serif",
                    fontWeight: 'bold',
                    color: '#black',
                    position:'top'
                  }

            },
            credits: {enabled: false},
            legend: {enabled: false},
            tooltip: {
                headerFormat: '<span style="font-size:11px">{series.name}</span><br>',
                pointFormat: '<span style="color:{point.color}">{point.name}</span>: <b>{point.percentage:.1f}%</b> of total<br/>'
            },
  
            series: [
                {
                    name: "",
                    colorByPoint: true,
                    data: $scope.actionCount
                     
                }
            ],
            drilldown: {
                drillUpButton: {
                    position: {
                        relativeTo:"plotBox",
                        verticalAlign: 'right'
                    }
                },
              
                series: [
                    {
                        name: "REPORT",
                        id: "REPORT",
                        data: $scope.reportCount
                        
                    },
                    {
                        name: "DISCOUNT",
                        id: "DISCOUNT",
                        data: $scope.discountCount
                    }
                    
                ]
               
            }
        });

我的图表视图如下图所示。

Answer 1

您需要将颜色属性添加到图表选项，如下所示

  Highcharts.setOptions({
     colors: ['#50B432', '#ED561B']
  });

示例演示

 $(function () { Highcharts.setOptions({ colors: ['#50B432', '#ED561B'] }); var chart; $(document).ready(function() { chart = new Highcharts.Chart({ chart: { renderTo: 'container', }, title: { text: 'Browser market shares at a specific website, 2010' }, series: [{ type: 'pie', name: 'Example', data: [ ['One', 45.0], ['Two', 26.8], ] }] }); }); });

 <script src="https://code.highcharts.com/highcharts.js"></script> <script src="https://code.highcharts.com/modules/exporting.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <div id="container" style="min-width: 400px; height: 400px; margin: 0 auto"></div>