Question

我无法在我的csv文件中显示图表。它不会绘制图表。也许我的解析器是问题所在。萤火虫说没有重大错误，但我卡住了我不知道如何让它工作。请帮忙..

这就是我的csv的样子：

1437931522,30

1437931555,30.25

1437931768,30.25

1437931785,29.75

1437931802,30.25

1437932702,30.5

1437933601,29.75

1437933974,30

文件的结尾是\ n，但似乎没有在这里显示，所以我插入了额外的输入

这是代码：

    $(document).ready(function() {

Highcharts.setOptions({
    global: {
      useUTC: true
    }
  });
  var mydata = [];
  var times = [];
$.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(',');
        if(lineNo=>0)
        {
            times.push(new Date(items[0]*1000).toUTCString());
            mydata.push(items[1])
        }

    });
});

$('#container').highcharts({
    title: {
      text: 'Temperature',
      x: -20 //center
    },
    subtitle: {
      text: 'test1',
      x: -20
    },
    xAxis: {
      type: 'datetime',
        dateTimeLabelFormats: {
        month: '%b %e, %Y',
        year: '%Y'
      },
      categories: times
    },
    yAxis: {
      title: {
        text: 'Temperature (°C)'
      },
      plotLines: [{
        value: 0,
        width: 1,
        color: '#808080'
      }]
    },
    tooltip: {
      valueSuffix: '°C'
    },
    legend: {
      layout: 'vertical',
      align: 'right',
      verticalAlign: 'middle',
      borderWidth: 0
    },
    series: [{
      name: 'Temp',
      data: mydata

    }]
  });
});``

没关系，如果csv与'data.csv'相同，如果它在同一个目录中，或者我必须设置整个网址？

这是我的小提琴： http://jsfiddle.net/skoky2/yw25z6ow/1/

Answer 1

您应该在主模块中使用以下代码

        data: {
            csv: csv
        },

参考：data-module

Answer 2

1）如果您使用日期时间类型的xAxis，则不应使用类别。您可以定义tickPositions

2）点值应该是数字而不是字符串，所以替换：

 mydata.push(items[1])

带

 mydata.push(parseFloat(items[1]))

Answer 3

我设法让它发挥作用。但我注意到这个图表仅适用于IE 8，而不适用于Firefox或Chrome。 fire tab with ie tab aslo works

Highcharts数据csv加载

3 个答案: