Question

我不明白为什么这些数据不会在Highstocks中绘图：

foo.csv：

1391380000000,58.15,58.48,56.08,56.15,2929300 1391470000000,56.32,57.88,56.09,57.81,2911900 1391550000000,57.58,57.70,56.96,57.43,2283900 1391640000000,57.51,58.35,57.46,58.29,1609500 1391730000000,58.46,59.47,58.13,59.42,1966800 1391990000000,59.27,59.44,58.29,59.01,1760500 1392070000000,59.00,60.00,58.88,59.73,2135800 1392160000000,60.00,60.46,59.67,59.89,2346800 1392250000000,59.45,60.38,59.37,60.08,3092700 1392330000000,57.15,57.77,54.87,55.25,17844700 1392680000000,55.38,56.04,54.96,55.15,6553300 1392760000000,55.01,56.65,54.90,55.94,4838800 1392850000000,56.14,57.54,56.05,57.29,4629100 1392940000000,57.25,57.40,56.32,56.34,2407200 1393200000000,56.45,56.98,56.40,56.75,2392800 1393280000000,56.80,57.57,56.75,56.89,3375100 1393370000000,56.98,57.62,56.75,57.10,2400900

我的代码：`

  $.get('foo.csv', function(data) {

        // Split the lines
     var lines = data.split('\n');

// Iterate over the lines
     $.each(lines, function(lineNo, line) {
       var items = line.split(',');
     });

// create the chart
// split the data set into ohlc and volume
var ohlc = [],
  volume = [],
  dataLength = data.length;

for (i = 0; i < dataLength; i++) {
  ohlc.push([
    data[i][0], // the date
    data[i][1], // open
    data[i][2], // high
    data[i][3], // low
    data[i][4] // close
  ]);

  volume.push([
    data[i][0], // the date
    data[i][5] // the volume
  ])
}

// set the allowed units for data grouping
var groupingUnits = [[
  'week',                         // unit name
  [1]                             // allowed multiples
], [
  'month',
  [1, 2, 3, 4, 6]
]];


// create the chart
$('#container').highcharts('StockChart', {

    rangeSelector: {
    inputEnabled: $('#container').width() > 480,
        selected: 1
    },

    title: {
        text: 'Historical data'
    },

    xAxis: {
      ordinal: false
    },

    yAxis: [{
        labels: {
        align: 'right',
        x: -3
      },
        title: {
            text: 'OHLC'
        },
        height: '60%',
        lineWidth: 2
    }, {
      labels: {
        align: 'right',
        x: -3
      },
        title: {
            text: 'Volume'
        },
        top: '65%',
        height: '35%',
        offset: 0,
        lineWidth: 2
    }],

    series: [{
        type: 'candlestick',
        name: 'Stock',
        data: ohlc,
        dataGrouping: {
      units: groupingUnits
        }
    }, {
        type: 'column',
        name: 'Volume',
        data: volume,
        yAxis: 1,
        dataGrouping: {
      units: groupingUnits
        }
    }]
 });
});

` 我得到的是从1970-01-01开始的空白图表。我已经读过thread了，但它并没有真正帮助我，因为他们还没有真正将日期转换为时间戳。 .csv文件的格式有什么问题吗？我在网络浏览器的控制台中没有收到任何错误。

编辑：

事实上，我的代码存在一些问题。此代码现在有效：

var data = "1393280000000,56.80,57.57,56.75,56.89,3375100\n1393370000000,56.98,57.62,56.75,57.10,2400900"; 
var lines = data.split('\n');

var ohlc = []; var volume = [];

for(var i = 0; i < lines.length; i++){

var items = lines[i].split(',');

ohlc.push([parseFloat(items[0]),
    parseFloat(items[1]),
    parseFloat(items[2]),
    parseFloat(items[3]),
    parseFloat(items[4])
]);

volume.push([parseFloat(items[0]),
    parseFloat(items[5])
]);


// set the allowed units for data grouping
var groupingUnits = [[
  'week',                         // unit name
  [1]                             // allowed multiples
], [
  'month',
  [1, 2, 3, 4, 6]
]];

       // create the chart
$('#container').highcharts('StockChart', {


    rangeSelector: {
    inputEnabled: $('#container').width() > 480,
        selected: 1
    },

    title: {
        text: 'Historical data'
    },

    yAxis: [{
        labels: {
        align: 'right',
        x: -3
      },
        title: {
            text: 'OHLC'
        },
        height: '60%',
        lineWidth: 2
    }, {
      labels: {
        align: 'right',
        x: -3
      },
        title: {
            text: 'Volume'
        },
        top: '65%',
        height: '35%',
        offset: 0,
        lineWidth: 2
    }],

    series: [{
        type: 'candlestick',
        name: 'Stock',
        data: ohlc,
        dataGrouping: {
      units: groupingUnits
        }
    }, {
        type: 'column',
        name: 'Volume',
        data: volume,
        yAxis: 1,
        dataGrouping: {
      units: groupingUnits
        }
    }]
});
}

Answer 1

您需要使用parseFloat（）来使用数字而不是字符串。

for (i = 0; i < dataLength; i++) {
  ohlc.push([
    parseFloat(data[i][0]), // the date
    parseFloat(data[i][1]), // open
    parseFloat(data[i][2]), // high
    parseFloat(data[i][3]), // low
    parseFloat(data[i][4]) // close
  ]);

  volume.push([
    parseFloat(data[i][0]), // the date
    parseFloat(data[i][5]) // the volume
  ])
}

Highstocks中的.csv文件

1 个答案: