Раскраска линий в Highchart занимает много времени - PullRequest
1 голос
/ 14 мая 2019

У меня есть Линейный график Highcharts с ~ 150 линиями. Я закрашиваю каждый градиент от синего до зеленого, от желтого до красного, обводя каждую строку и вызывая небольшую функцию javascript для вычисления значения для него.

Line chart with the colors

Однако на их вычисление всегда уходило довольно много времени - и с небольшого времени это действительно требует времени. Я бы не сказал, почему он так быстро замедлился, поскольку я не коснулся кода.

Код для циклического перемещения по строкам:

    function(chart)
    { 
        // number of line in graph; for the last year to highlight, this is important
        var chart = this;
        var n = chart.series.length; 


        // color the lines
        for(i = 0; i < n; i++)
        {
            var value=i/n;
            chart.series[i].update({color: getColor(value)});
        }


        chart.series[(n-1)].update({lineWidth: 4});
        chart.series[(n-1)].update({marker: {enabled: true}});
        chart.series[(n-1)].update({marker: {fillColor: '#000000'}})            
    });

И для получения правильного цвета:

    function getColor(value){
        //value from 0 to 1
        var hue=((1-value)*240).toString(10);
        return ["hsl(",hue,",100%,40%)"].join("");
    }

Любая идея, как это можно улучшить, поскольку график загружается сейчас через ~ 1 минуту или около того ... Действительно, чтобы замедлиться.

1 Ответ

1 голос
/ 14 мая 2019

Может, подождать, чтобы перерисовать график, пока вы не измените все серии?Возможно, вы захотите попробовать этот update вариант:

...
        // color the lines
        for(i = 0; i < n; i++)
        {
            var value=i/n;
            chart.series[i].update({color: getColor(value)}, false);
        }
        chart.redraw();
...
...