Highcharts列更改颜色,但标记/点未更改

问题描述 投票:0回答:1

我创建highchart列,我更改了颜色栏,但标记/点未更改。

我希望标记/点与颜色条相同

进度:橙色

完成:绿色

目标:蓝色

我不知道如何解决,请看这张图片

enter image description here

请参阅我的演示Jsfiddle

这是我的代码

$(function () {
              $('#sales').highcharts({
                  chart: {
                      type: 'column'
                  },
                  title: {
                      text: 'Performance Sales'
                  },
                  xAxis: {
                      categories: ['Yulia','UUM','Sinta']
                  },
                  yAxis: {
                      min: 0,
                      title: {
                          text: 'Values'
                      }
                  },
                   credits: {
                        enabled: false
                    },
                  plotOptions: {
                      column: {
                          dataLabels: {
                              enabled: true,
                              formatter: function () {
                                  return this.point.custom;
                              }
                          },
                      },

                  },
                  series: [ 
                  {
                      name: 'Progress',
                      data: [
                             {
                              color:'orange',
                              custom:17,
                              y:16150000
                            },
                            {
                                color:'orange',
                                custom:4,
                                y:195449100
                             },
                            {
                              color:'orange',
                              custom:16,
                              y:128000000
                            }
                          ]
                  },
                  {
                      name: 'Done',
                      data: [
                        {
                           color:'#90ED7D',
                           custom:16,
                           y:9000000
                        },{
                          color:'#90ED7D',
                          custom:0,
                          y:0
                        },
                        {
                           color:'#90ED7D',
                           custom:8,
                           y:128000000
                        }                     
                      ]
                  },
                  {
                      name: 'Target',
                      data: [
                        {
                          color:'#7CB5EC',
                          custom:'',
                          y:50000000
                        },
                        {
                          color:'#7CB5EC',
                          custom:'',
                          y:30000000
                        },
                        {
                            color:'#7CB5EC',
                            custom:'',
                            y:70000000
                        }                    
                        ]
                  }
                  ]
              });
          });
highcharts
1个回答
0
投票

您需要为整个系列设置此颜色,而不仅是为特定点设置颜色。图例颜色是从系列颜色继承的。

演示:https://jsfiddle.net/BlackLabel/vsud1nky/

series: [{
    color: 'orange',
    name: 'Progress',
    data: [{
        custom: 17,
        y: 16150000
      },
      {
        custom: 4,
        y: 195449100
      },
      {
        custom: 16,
        y: 128000000
      }
    ]
  }....
]

API:https://api.highcharts.com/highcharts/series.column.color

© www.soinside.com 2019 - 2024. All rights reserved.