Highcharts Pie动态系列颜色

时间:2018-09-07 12:58:13

标签: highcharts pie-chart

我有代码,凡事都能工作,但仅适用于图表类型“ column”。

http://jsfiddle.net/Blooder/02bncux6

<div id="first">
</div>
<button id="but">Change to red</button>

$(document).ready(function(){
loadBarChart();
$("#but").on("click",function() {
    var series = chart.highcharts().series[2];
    series.update({
        color: 'red' 
    });
 });
});
function loadBarChart(){
chart = $('<div class="widget barchart"></div>');
$("#first").append(chart);
chart.highcharts({
    chart: {
        type: 'column'
    },
    title: {
        text: ""
    },
    credits: {
        enabled: false
    },
    legend: {
        enabled: false
    },
    xAxis: {
        categories: ['33%', '66%', '100%']
    },
    yAxis: {
        title: {
            text: null
        }
    },
    series: [{
    name: 'Year 1800',
    data: [107, 31, 635, 203, 2]
    }, {
    name: 'Year 1900',
    data: [133, 156, 947, 408, 6]
    }, {
    name: 'Year 2000',
    data: [814, 841, 3714, 727, 31]
    }, {
    name: 'Year 2016',
    data: [1216, 1001, 4436, 738, 40]
     }]
    });
    }

但是,当您尝试将此类型更改为图表Pie时,此操作将无效。 我该如何解决?

1 个答案:

答案 0 :(得分:0)

饼图类型只有一个系列,因此要更改颜色,必须在一个点上使用update方法:

$("#but").on("click", function() {
  var point = chart.series[0].points[1];
  point.update({
    color: 'red'
  });
});

实时演示:https://jsfiddle.net/BlackLabel/tLk65vf8/

文档:https://www.highcharts.com/docs/chart-and-series-types/pie-chart