在Highcharts中，如何使箱线图离群值从浅色过渡到深色？

Question

是否可以让异常值的颜色由浅变深？我正在使用 Highcharts 的箱形图，并希望我的离群值从浅红色呈现为深红色。任何超过 100k 的异常值都需要以深红色显示。

https://jsfiddle.net/samwhite/9amz3y7x/1/

    Highcharts.chart('container', {
        chart: {
            type: 'boxplot',
            zoomType: 'xy'
        },
        title: {
            text: 'Boxplots for Buzz'
        },
        credits: {enabled: false},
        legend: {
            enabled: false
        },

        xAxis: {
            categories: categories,
            title: {
                text: 'Stock Symbol'
            }
        },

        yAxis: {
            title: {
                text: 'Buzz'
            },
        },

        plotOptions: {
            boxplot: {
                fillColor: 'red',
                // medianColor: '',
                // stemColor: '',
                // whiskerColor: ''
            }
        },

        series: [{
            name: 'Buzz',
            data: box_dat,
            color: 'red',
        }, {
            name: 'Outliers',
            color: 'red',
            type: 'scatter',
            data: outliers,
            marker: {
                fillColor: 'white',
                lineWidth: 1,
                lineColor: 'red'
            },
            tooltip: {
                pointFormat: 'Observation: {point.y}'
            }
        }]

    });

Answer 1

您应该使用区域或色轴，但它们只会改变 point.color，在您的情况下，它被替换为 marker.lineColor。添加以下插件以允许按区域更改线条颜色。

(function(H) {
    H.wrap(H.Point.prototype, 'getZone', function(proceed) {
        proceed.apply(this, Array.prototype.slice.call(arguments, 1));

        this.options.marker = {
            lineColor: this.color
        };
    });
}(Highcharts));

现场演示： https://jsfiddle.net/BlackLabel/sc2hk1b9/

文档： https://www.highcharts.com/docs/extending-highcharts/extending-highcharts

在Highcharts中，如何使箱线图离群值从浅色过渡到深色？

In Highcharts, how to make box plot outliers transition from light to dark colors?

javascript

jquery

boxplot

highcharts