Question

我很抱歉，如果有答案的某个地方...但我不明白如何解析一个简单的CSV文件为Highcharts。

我有这个简单的CSV文件：

日期，站点，萨姆
  十一分之二千零十三/ 26，NON-US，12345
  十一分之二千零十三/ 26，美国，12355个
  十一分之二千零十三/ 26，ALL，24700
  十一分之二千零十三/ 28，NON-US，12355
  十一分之二千零十三/ 28，美国，12365个
  十一分之二千零十三/ 28，ALL，24720个

我想要一个折线图，但我不明白如何正确解析csv-File ...

我希望x轴为“Date”，y轴为“Sum”，系列为“Site”。

你能帮帮我吗？

我真的需要你的帮助！我是Javascript的新手。

现在我有一个代码，但我无法正常运行：

var options = {
    chart: {
        renderTo: 'container',
        defaultSeriesType: 'line'
    },
    title: {
        text: 'Legal'
    },
    xAxis: {
        categories: []
    },
    yAxis: {
        title: {
            text: 'Size'
        }
    },
    series: []
};

$.get('test_statistic.csv', function(data) {
// Split the lines
    var lines = data.split('\n');


    $.each(lines, function(lineNo, line) {
        var items = line.split(',');


        if (lineNo == 0) {
            $.each(items, function(itemNo, item) {
                if (itemNo > 0) options.xAxis.categories.push(items[0]);
            });
        }

        else {
            var series = {
                data: []
            };
            $.each(items, function(itemNo, item) {
                if (itemNo == 0) {
                    series.name = items[1];
                } else {
                    series.data.push(parseFloat(items[2]));
                }
            });

            options.series.push(series);

        }

    });

    // Create the chart
    var chart = new Highcharts.Chart(options);
});

我得到以下内容 Chart

BR 菲利普

Answer 1

你需要从这里修改脚本：http://www.highcharts.com/docs/working-with-data/preprocessing-data-from-a-file-csv-xml-json#1但需要通过split函数解析日期，这允许提取每天/每月然后使用返回时间戳的Date.UTC（）函数（正确的格式） of highcharts的日期）

Answer 2

如果您正在寻找阅读CSV文件的选项，SuperCSV是最好的选项。你有很好的文件记录，可以让你在几分钟内完成工作。

关于根据您的要求制作图表非常简单。使用SuperCSV，您可以解析数据并转换为bean http://supercsv.sourceforge.net/apidocs/org/supercsv/io/CsvBeanReader.html

转换成bean之后，您可以使用Jackson将bean数据转换为json格式Tutorial，并根据Example，您可以使用JSON数据轻松构建图形

Highcharts解析CSV

2 个答案: