如何在高圖中從json文件中獲取數據

我想從json文件中獲取圖表數據。使用它的第一次，以保持它從高圖文檔複製。但它不起作用。如何在高圖中從json文件中獲取數據

JSON：

[ 
       { "name" : "Asia", "data" :[4502, 635, 809, 947, 1402, 3634, 5268] }, 
       { "name" : "Africa", "data" : [106, 107, 111, 133, 221, 767, 1766] }, 
       { "name" : "Europe", "data" : [163, 203, 276, 408, 547, 729, 628] }, 
       { "name" : "America", "data" : [18, 31, 54, 156, 339, 818, 1201] }, 
       {"name" : "Oceania", "data" : [2, 2, 2, 6, 13, 30, 46] } 
      ]

腳本：

<script> 
$(function() { 
    var options = { 
     chart: { 
      renderTo: 'container', 
      type: 'spline' 
     }, 
     title: { 
      text: 'Historic and Estimated Worldwide Population Growth by Region' 
     }, 
     subtitle: { 
      text: 'Source: Wikipedia.org' 
     }, 
     xAxis: { 
      categories: ['1750', '1800', '1850', '1900', '1950', '1999', '2050'], 
      tickmarkPlacement: 'on', 
      title: { 
       enabled: false 
      } 
     }, 
     yAxis: { 
      title: { 
       text: 'Billions' 
      }, 
      labels: { 
       formatter: function() { 
        return this.value/1000; 
       } 
      } 
     }, 
     tooltip: { 
      shared: true, 
      valueSuffix: ' millions' 
     }, 
     plotOptions: { 
      area: { 
       stacking: 'normal', 
       lineColor: '#666666', 
       lineWidth: 1, 
       marker: { 
        lineWidth: 1, 
        lineColor: '#666666' 
       } 
      } 
     }, 
     series: [{}] 




    }; 


$.getJSON('http://s000.tinyupload.com/?file_id=46814948573049842058', function(data) { 
     options.series[0].data = data; 
     var chart = new Highcharts.Chart(options); 
    }); 
}) 
</script>

控制檯不顯示任何錯誤。任何人都可以看到代碼的問題。

來源

2016-03-02 Praveen

我無法從我的作品模仿你的代碼，但是，這應該修復它：

的TinyUpload犯規允許訪問你data.json直接。把它放在你可以的地方。（OBS：這不是JSON文件，它是描述數組/對象結構的字符串，應先將其轉換爲 json格式）;

如果你決定接受它作爲一個字符串，無論如何，做到這一步：

當你接收到的數據，利用Eval() function它
轉換成與數組/對象，然後把它轉換成HighChart腳本。

例

var string = '['+ 
       '{ "name" : "Asia", "data" :[4502, 635, 809, 947, 1402, 3634, 5268] },'+ 
       '{ "name" : "Africa", "data" : [106, 107, 111, 133, 221, 767, 1766] },'+ 
       '{ "name" : "Europe", "data" : [163, 203, 276, 408, 547, 729, 628] },'+ 
       '{ "name" : "America", "data" : [18, 31, 54, 156, 339, 818, 1201] },'+ 
       '{"name" : "Oceania", "data" : [2, 2, 2, 6, 13, 30, 46] }'+ 
      ']'; 
var yourDataObject = eval(string);

PS：我想加載它是數據的正確方法：

options.series = data;

來源

2016-03-02 19:01:36

我做錯了幾件事情。 1）TinyUpload不允許直接訪問.json。 2）我改變了'options.series [0] .data = data;'到'options.series = data;' 它現在開始工作。 – Praveen

如何在高圖中從json文件中獲取數據

回答

相關問題