Question

我想通过调用返回Json的本地webService来显示HighCharts双轴图表（示例如下）。

HighChart应绘制以下数据点：

y轴左：绘制'运动'
y轴右：绘制'EndValue'
x轴：绘制'DateLabel'

我的Json网络服务电话：http://localhost/api/getData?format=jsonp

返回以下Json：

    {
  "LastUpdated": "/Date(-62135596800000-0000)/",
  "TotalTime": "0s584ms",
  "MonthlyData": {
    "GroupId": 9,
    "CurrencyId": 3,
    "Returns": [
      {
        "Movement": -0.008536959525287496,
        "MovementLabel": "-0.85 %",
        "DateLabel": "Jan-10",
        "Date": "/Date(1264892400000-0000)/",
        "EndValue": 16012000.007666545
      },
      {
        "Movement": -0.04846365302964577,
        "MovementLabel": "-4.85 %",
        "DateLabel": "Feb-10",
        "Date": "/Date(1267311600000-0000)/",
        "EndValue": 15235999.994984308
      },
      {
        "Value": -0.0034129684178402725,
        "ValueLabel": "-0.34 %",
        "DateLabel": "Mar-10",
        "Date": "/Date(1269986400000-0000)/",
        "StartValue": 15235999.994984308,
        "EndValue": 15184000.008187212,
        "CashFlows": 0


       }
    ]
  }
}

需要什么是jquery代码 - 调用webService（我想使用getJson） - 将JSON输出转换为所需的HighCharts数据，以便显示双轴图表

Answer 1

要获取JSON，您可以使用jQuery.ajax()功能。至于将数据分成两个链接到不同yAxis的系列，您需要解析数据。看一下下面的例子。

API参考：
http://api.jquery.com/jquery.ajax/
http://api.highcharts.com/highcharts/xAxis.categories
http://api.highcharts.com/highcharts/yAxis.opposite

例：
http://jsfiddle.net/dna9wqsg/

HighCharts - getJson到HighCharts双轴

1 个答案: