首页 文章

修复HighCharts中图表的颜色

提问于
浏览 次
2

我有一个高图表，刷新动态数据被推入系列，但每次颜色改变如何修复图表的颜色 . 我使用角度js和我的高图配置对象如下

var chartConfig = {
            credits: {
                enabled: false
            },
            options: {
                colors: ['#058DC7', '#50B432', '#ED561B', '#DDDF00', '#24CBE5', '#64E572', '#FF9655', '#FFF263', '#6AF9C4'],
                chart: {
                    backgroundColor: '#EDEDED',
                    zoomType: 'x',
                    reflow: true
                },
                credits: false
            },
            series: [],
            tooltip: {
                headerFormat: '<span style="font-size:10px">{point.key}</span><table>',
                pointFormat: '<tr><td style="color:{series.color};padding:0">{series.name}: </td>' +
                    '<td style="padding:0"><b>{point.y:.1f} mm</b></td></tr>',
                footerFormat: '</table>',
                shared: true,
                useHTML: true
            },
            legend: {
                enabled: true
            },
            series: [],
            exporting: {
                csv: {
                    dateFormat: '%Y-%m-%d'
                }
            },
            title: {
                text: '',
                style: {
                    display: 'none'
                }
            },
            xAxis: {
                title: {}
            },
            func: function(chart) {
                $timeout(function() {
                    chart.reflow();
                }, 0);
            }
        };
angularjs highcharts

1 回答

  • 2

    而不是设置 chartConfig.series[index] = newSeries ，使用@jlbriggs提到的Highcharts对象和方法 . 您可以按照highcharts-ng FAQ（第二点）中的说明访问图表原始对象 .

    解释问题：每次highcharts-ng在更新到来时重新创建系列 . 这意味着系列颜色被视为 chart.colors 数组的新索引 . 因此，您可以：不使用上述解决方案，而是：

    • 直接在选项中为每个系列指定颜色：
    chartConfig.series[index] = { data: [...], color: 'red' };
    • 将 chart.colors 设置为与您在图表上使用的系列数相同的长度：
    colors: ['#058DC7', '#50B432', '#ED561B'], // for example only three series on the chart
    回复于

相关问题