Нарисуйте несколько серий в Highchart из одного JSON контейнера данных - PullRequest
0 голосов
/ 11 января 2020

Я пытаюсь нарисовать 2 строки в Highchart из файла JSON. Я читаю темы с похожими проблемами, но безрезультатно, так что теперь я публикую свою проблему. Мой JSON файл выглядит следующим образом

[[1578258092000, 109, 32], [1578258812000, 120, 34], [1578260104000, 123, 35],

, и я пытаюсь использовать код ниже, чтобы проинструктировать Highchart

Highcharts.getJSON(
    'temps.json',
    function (data) {

        Highcharts.chart('container', {
            chart: {zoomType: 'x'},
            title: {text: 'Values over time'},
            subtitle: {text: document.ontouchstart === undefined ? 'Pinch the chart to zoom in' : 'Pinch the chart to zoom in'},
            xAxis: {type: 'datetime'},
            yAxis: {title: {text: 'Value'}},
            legend: {enabled: false},
            plotOptions: {
                area: {
                    fillColor: {
                        linearGradient: {
                            x1: 0,
                            y1: 0,
                            x2: 0,
                            y2: 0
                        },
                        stops: [
                            [0, Highcharts.getOptions().colors[0]],
                            [1, Highcharts.Color(Highcharts.getOptions().colors[0]).setOpacity(0).get('rgba')]
                        ]
                    },
                    marker: {
                        radius: 2
                    },
                    lineWidth: 1,
                    states: {
                        hover: {
                            lineWidth: 1
                        }
                    },
                    threshold: null
                }
            },

            series: [{
                name: 'Value1',
                data: data.arr1
				},{
                name: 'Value2',
                data: data.arr2	
				}]
        });
    }
);

Я не знаю, как разбить данные из файла JSON на 2 серии. Может кто-нибудь привести пример?

1 Ответ

0 голосов
/ 13 января 2020

Прежде чем ваши данные будут инициализированы в диаграмме, вы можете выполнить некоторые операции анализа данных, чтобы создать два разных массива, например:

var data =[[ 1578258092000, 109, 32 ], [ 1578258812000, 120, 34 ], [ 1578260104000, 123, 35 ]];

var data1 = data.map(d => [d[0], d[1]]),
    data2 = data.map(d => [d[0], d[2]]);

Демонстрация: https://jsfiddle.net/BlackLabel/1Lsgcy7h/

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...