HighCharts:是否可以自定义单个系列的颜色?

Tja*_*art 53 javascript graph highcharts

我正在使用HighCharts进行折线图报告.在这个特定的报告中,我被要求自定义每个系列的颜色.该系列将始终保持不变.例如:

约翰系列:蓝色虚线玛丽系列:纯红线

有谁知道如何做到这一点?

Eri*_*c C 105

可以为每个系列单独设置选项.

var chart = new Highcharts.Chart({
    chart: {
        renderTo: 'container'
    },
    xAxis: {
        type: 'datetime'
    },

    series: [{
        name: 'John',
        color: '#0066FF',
        dashStyle: 'ShortDash',
        data: [
            [Date.UTC(2010, 0, 1), 29.9],
            [Date.UTC(2010, 2, 1), 71.5],
            [Date.UTC(2010, 3, 1), 106.4]
        ]
    },{
        name: 'Mary',
        color: '#FF0000',
        data: [
            [Date.UTC(2010, 0, 1), 60.9],
            [Date.UTC(2010, 1, 1), 40.5],
            [Date.UTC(2010, 2, 1), 90.0],
            [Date.UTC(2010, 3, 1), 80.4]
        ]
    }]
});
Run Code Online (Sandbox Code Playgroud)

JsFiddle示例

  • 你能让这种颜色有条件吗?想知道你是否可以通过格式化器获得颜色. (2认同)

Ric*_*ann 9

如果你在这里阅读api ,你会看到以下文字.

意甲

附加到图表的实际系列.除了下面列出的成员之外,该plotOptions特定类型的绘图的任何成员都可以单独添加到系列中.例如,即使lineWidth指定了常规plotOptions.series,lineWidth也可以为每个系列指定个体.

所以你可以添加任何东西plotOptions.

演示:

series: [{
    name: 'serie1',
    data: [0,1,2,3,4,5,6,7,8,9],
    color: '#FFFF00',
    lineWidth: 4,
    id: 'serie1',
    step: true
}]
Run Code Online (Sandbox Code Playgroud)

工作演示