javascript - Highcharts - 如何为系列设置自定义颜色

标签 javascript jquery charts highcharts

我正在使用 Highcharts 为项目呈现一些图表。我的问题是,当我尝试在 plotOptions.column 中设置 colors 数组时,它不起作用。虽然,它适用于 plotOptions.pie

我需要做的是为不同的系列类型设置不同的颜色预设。因此,当我添加相同类型的系列时,它们的颜色会从它们的 colors 数组中选取。但是现在,由于某些奇怪的原因,尽管我已经为每个系列类型定义了自己的 colors 数组,但仍会显示默认颜色。

这是更好地理解我的意思的 fiddle : http://jsfiddle.net/c5nhd/1/

官方文档链接如下: http://api.highcharts.com/highcharts#plotOptions.column.colors

最佳答案

DEMO 从我们自定义的颜色数组中为不同系列的柱形图使用不同的颜色,从而覆盖 highcharts 的默认颜色。

代码:

var colors = ['#FF530D', '#E82C0C', '#FF0000', '#E80C7A', '#E80C7A'];
$( '#container' ).highcharts({
    plotOptions: {
        pie: { //working here
            colors: colors
        }
    },
    colors:colors,
    series: [{
        type: 'column',
        data: [25, 34, 15, 17, 19],  
    },{
        type: 'column',
        data: [25, 34, 15, 17, 19],  
    },{
        type: 'column',
        data: [25, 34, 15, 17, 19],  
    }, {
        type: 'pie',
        data: [25, 34, 15, 17, 19],
        center: ['75%', '30%']
    }]
});

关于javascript - Highcharts - 如何为系列设置自定义颜色,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24688384/

相关文章:

javascript - (之后)jQuery获取脚本成功,我看不到(故意)错误

javascript - jQuery : dynamic events how to achieve

javascript - 使用注释移动Google图表列注释位置: line

jquery - float 条形图数据标签左偏移

java - 如何去除 iReport/Jasper 中多余的饼图?

javascript - 将自己的 JavaScript 模块导入转换后的 TypeScript

javascript - 预期有 1 个参数,但得到 0 个参数。TS2554 - 可选对象属性但不是对象?

javascript - 为什么 jQuery 类不适用于 AJAX 响应生成的 HTML 元素?

javascript - 在 jQuery 数据表中禁用 ctrl+click 选择

javascript - 如何让 AngularJS 和 KendoUI 协调工作?