1

我正在构建一个使用 Highcharts 库来显示单线系列图表的网站。我正在使用 AJAX 使用他们的 YQL 从 yahoo Finance 检索历史财务数据。

ajax 调用工作正常，例如我可以在控制台中查看返回的数据

console.log( data.query.results.quote[0].Close ); 返回收盘价457.84

我现在如何使用这些数据构建单线系列图表？

我在任何地方都找不到关于如何使用 AJAX 数据创建图表的简单解释。

谢谢

编辑：我在 AJAX 中获取数据并且它工作正常，但是试图使图表与 JSON 一起工作是我遇到困难的地方。

这是我的代码目前的样子：http: //jsfiddle.net/JbGvx/

这是 HighStocks 网站上的演示代码：http: //jsfiddle.net/xDhkz/

我认为问题在于 AJAX 请求的日期格式。日期像这样返回 2013-02-25 但图表需要 JS 时间戳。有没有一种方法可以从 AJAX 中提取日期，使用 Date.UTC 进行转换，然后使用转换后的数据制作图表？

4

2 回答 2

1

如果您正在考虑股票数据，请考虑使用 HighStocks 而不是 HighCharts。它可以比 HighCharts 更快地处理许多数据点。

HighStocks 有一个例子，他们在这里异步提取 AJAX 数据（160 万点）：http ://www.highcharts.com/stock/demo/lazy-loading

于 2013-04-01T19:24:43.090 回答
0 
var chartSeriesData = [];

var chartCategory = [];

$.each(response, function() {

  if(this.name!="TOTAL" && this.no!="0")
  {

    var series_name = this.name;
    var series_data = this.no;

    var series = [
      series_name,
      parseFloat(series_data)
    ];
    chartSeriesData.push(series);   

  }                   

});
//initialize options for highchart

var options = {
  chart: {
    plotBackgroundColor: null,
    plotBorderWidth: null,
    plotShadow: false
  },
  title: {
    text: 'SalesOrder '
  },
  tooltip: {
    pointFormat: '{series.name}: <b>{point.y}</b>'
  },
  plotOptions: {
    pie: {
      allowPointSelect: true,
      cursor: 'pointer',
      center:['60%','60%'],
      size:150
      ,
      dataLabels: {
        enabled: true,
        color: '#000000',
        distance: 40,
        connectorColor: '#000000',
        format: '<b>{point.name}</b>: {point.y} '
      }
    }
  },
  series: [{
    type: 'pie',
    name: 'Browser share',
    data:chartSeriesData //load array created from json
  }]
}


//options.series[0].setData(datavaluejson);
var chart= $('#container').highcharts(options);
于 2014-01-22T15:30:42.433 回答