来自不同 CSV 文件的动态多个系列答案

【问题标题】：dynamic multiple series from different CSV-files来自不同 CSV 文件的动态多个系列
【发布时间】：2019-08-26 14:32:55
【问题描述】：

我有多个定期更新的 CSV 文件。我可以使用“来自动态 CSV 的实时数据”示例 (https://www.highcharts.com/demo/live-data)，但它只使用 1 个 CSV 文件，而我需要使用单独的 CSV 文件显示多个系列。

目前我只能在图表中显示其中一个 CSV 文件。我希望有人可以例如向我展示如何在同一图表中显示示例 time-data.csv 两次作为 2 个单独的系列。

function createChart() {

    Highcharts.chart('container', {
        chart: {
            type: 'spline'
        },
        yAxis: {
        max: 40,
        min: 15
    },
        title: {
            text: 'Live Data'
        },
        data: {
            csvURL: 'https://demo-live-data.highcharts.com/time-data.csv',
            enablePolling:  true,
            dataRefreshRate: 2
        }
    });
}

【问题讨论】：

标签： csv highcharts

【解决方案1】：

Highcharts 没有从多个 CSV 源加载数据的内置功能。您需要手动获取数据并将其解析为 Highcharts 所需的格式。例如：

var url1 = 'https://demo-live-data.highcharts.com/time-data.csv',
    url2 = 'https://demo-live-data.highcharts.com/time-data.csv';

function parseData(data) {
    var parsedData = [],
        splittedData = data.split(/\n/),
        splittedRow;

    splittedData.shift();

    splittedData.forEach(function(row) {
        splittedRow = row.split(',');
        parsedData.push([new Date(splittedRow[0]).getTime(), Number(splittedRow[1])]);
    });

    return parsedData;
}

$.get(url1, function(data1) {
    $.get(url2, function(data2) {
        // parse data1
        var parsedData1 = parseData(data1)
        // parse data2
        var parsedData2 = parseData(data2)

        Highcharts.chart('container', {
            xAxis: {
                type: 'datetime'
            },
            series: [{
                data: parsedData1
            }, {
                data: parsedData2
            }]
        });
    });
});

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

有用的帖子： load data in highcharts from 2 different csv files

【讨论】：