Question

这可能听起来像一个非常简单的问题，但我花了好几个小时试图完成这个，这让我感到非常沮丧。

有人可以告诉我如何设置系列中名称的颜色吗？我能够完全配置我的图表的所有其他方面，但系列名称仍然是黑色。

我在此处保存了一个Highchart示例http://jsfiddle.net/ktnexbcr/如何将系列中的“气象数据”文本设置为蓝色或红色或黑色以外的任何其他内容。

    series: [{
        data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4],
        name: 'Meteorological data',
        color: "red",
        font-color: "blue" ??? <-- how
}]

这根本不可能吗？

谢谢，

丹

Answer 1

您需要使用legend.labelFormat或legend.labelFormatter。例如：

    legend: {
        labelFormat: '<span style="color:{color}">{name}</span>'
    },

演示：http://jsfiddle.net/ktnexbcr/2/

Answer 2

传奇就是您的追求，您需要查看文档http://www.highcharts.com/docs/chart-design-and-style/themes

$(function () {
    $('#container').highcharts({
        xAxis: {
            categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'],

        },

        series: [{
            data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4],
            name: 'Meteorological data',
            color: "red",

        }],

        legend: {
        itemStyle: {
            color: 'blue'
        }  
    }
    });
});

fiddle here

Answer 3

您可以使用以下代码跨图表设置常用样式

reset: function () {
        this.clear();
        for (var cb=0; cb<callbacks.length; cb++) {
            callbacks[cb].callback.apply(this, [
                    true,       //pass in a value indicating it is VALID
                    [],         //pass in empty collection
                    []]);       //pass in empty collection
        }
},

设置图例颜色

Highcharts.setOptions({
    chart: {
        style: {
            fontFamily: 'serif'
        }
    }
});

highcharts example

有关更多可用选项，请参阅此link

Highcharts设置系列文字颜色

3 个答案: