在 r-highcharter 中更改图表元素的颜色

Question

假设我有 25 条线的折线图，但只想给其中 3 条上色，而其他的则为灰色，我该怎么做？

Answer 1

您可以使用 Highcharter 的 hc_chart 函数来包含 chart.events.load 事件，您可以在其中触发自定义 JavaScript 代码。使用 JS("") 函数将 JavaScript 代码注入 R。 在该 JavaScript 代码中，您可以遍历所有系列并使用 series.update() 方法更新它们的颜色。

我今天在这里做的完全一样： How to change the color of marker-points dynamically based on y-position 但我没有更改系列，而是更改了标记的颜色。

API 参考：https://api.highcharts.com/highcharts/chart.events.load https://api.highcharts.com/class-reference/Highcharts.Series#update

这是一个展示它的 JavaScript 演示：https://jsfiddle.net/BlackLabel/cyhd5Ln2/

var series = [];

for (let i = 0; i < 15; i++) {
    series.push({
        data: [5 + i, 6 + i, 3 + i, 4 + i]
    });
}

Highcharts.chart('container', {

    chart: {
        events: {
            load: function () {
                this.series.forEach(function (series, i) {
                    if (i < 3) {
                        series.update({
                            color: 'red'
                        }, false);
                    } else {
                        series.update({
                            color: 'grey'
                        }, false);
                    }
                });
                this.redraw();
            }
        }
    },

  series: series

});

我没有更新图表 15 次（当你有更多系列时这会降低性能），我更新了redraw flag: false，在for loop 之后我只更新了一次chart.redraw()。