更改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，但我改变了标记的颜色，而不是系列。

接口参考：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()一次。