【问题标题】:Highchart from CSV file with JavaScript使用 JavaScript 来自 CSV 文件的 Highchart
【发布时间】:2014-11-06 12:41:48
【问题描述】:

我创建了一个 JavaScript 函数,该函数可以从 CSV 文件中读取数据。

<script>
function Showgraph(){
var options = {
    chart: {
        renderTo: 'container',
        defaultSeriesType: 'line'
    },
    title: {
        text: 'Measurement data'
    },
    xAxis: {
        categories: [],
        title: {
            text: 'Measurement number'
            },
            labels: {
                enable: false,
            y:20, rotation: -45, allign: 'right'
            }
    },
    yAxis: {
        title: {
            text: 'Retro Reflection'
        }
    },
    series: []
};

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

    // Iterate over the lines and add categories or series
    $.each(lines, function(lineNo, line) {
        var items = line.split(',');

        // header line containes categories
        if (lineNo == 0) {
            $.each(items, function(itemNo, item) {
                if (itemNo > 0) options.xAxis.categories.push(item);
            });
        }

        // the rest of the lines contain data with their name in the first 
        // position
        else {
            var series = {
                data: []
            };
            $.each(items, function(itemNo, item) {
                if (itemNo == 0) {
                    series.name = item;
                } else {
                    series.data.push(parseFloat(item));
                }
            });

            options.series.push(series);

        }

    });

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

x 为数字的 CSV 文件。

Categories,xxx,
0.2,xxx,
0.33,xxx,
0.5,xxx,
0.7,xxx,
1.0,xxx,
1.5,xxx,
2.0,xxx,

然后我想从 CSV 文件中删除值:Categories, xxx,并修改 JavaScript 函数,使其仍然有效,但图表在 X 轴上不显示任何值。

新的 CSV 文件

0.2,xxx,
0.33,xxx,
0.5,xxx,
0.7,xxx,
1.0,xxx,
1.5,xxx,
2.0,xxx,

基本上是从最后一个 CSV 文件制作 Highchart。

【问题讨论】:

    标签: javascript csv highcharts


    【解决方案1】:

    使用这个解析器:

    $.each(lines, function(lineNo, line) {
        var items = line.split(',');
    
    
            var series = {
                data: []
            };
            $.each(items, function(itemNo, item) {
                    series.data.push(parseFloat(item));
            });
    
            options.series.push(series);
    
    
    });
    

    并从 xAxis 选项中删除 categories: []

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 2012-06-09
      • 2017-01-21
      • 2021-05-21
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2016-03-04
      • 1970-01-01
      相关资源
      最近更新 更多