Question

我想使用CSV文件作为highcharts图的源。

你可以给一些指导吗？我需要基本了解如何在网页中获取数据。

我是否需要将加载文本文件的函数放在js函数的“series”部分？

这是我到目前为止所做的：

<script type='text/javascript'>

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

$.get('test.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 == 1) {
                    series.name = item;
                } else {
                    series.data.push(parseFloat(item));
                }
            });

            options.series.push(series);

        }

    });

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

这是CSV文件中数据文件的结构：

Compound,Value
mix1,0.244
mix2,0.453
pureCu,1
pureAg,0.98

第1列的值基本上是一个ID，因此它们之间的距离可以被视为1.因此从技术上讲，第一列总是从1到15，例如，标签使用的是第一栏

我想把第二个字段放在Y上，而把X放在第一个字段上;但是使用粘贴的代码（这是Highcharts网站上的示例），我无法弄清楚如何正确设置图表每一侧的值。

由于

Answer 1

在这里，您可以从Highcharts中找到从外部文件加载数据的教程：http://www.highcharts.com/docs/working-with-data/preprocessing

关于刷新页面 - 是的，你可以每隔n秒刷新一次页面，但是我会更好（我认为）调用AJAX从服务器获取新数据然后在Highcharts中替换它（只需使用chart.series[0].setData( new_array_of_data ); < / p>

如何从文本加载高图中的数据

1 个答案: