HighchartsJS從URL獲取數據並將其傳遞給系列數據

我很難從URL中設置數據。基本上，數據從URL獲得，然後傳遞給Highcharts函數。HighchartsJS從URL獲取數據並將其傳遞給系列數據

當我嘗試使用console.log(data)登錄時，它不顯示任何數據。我使用Laravel獲取路線中的數據，並將「帶旋轉標籤的列」作爲圖表。下面是我的代碼：

圖：

<div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div>

這是一個數據串，內/電腦服務/圖：

[['Shanghai', 23.7],['Florida',3],['Dubai', 1]]

阿賈克斯腳本：

$(document).ready(function() { 
    $.ajax({ 
    url: '{!! url("komputer/chart") !!}', 
    type: 'GET', 
    async: true, 
    dataType: "text", 
    success: function (data) { 
    console.log(data); //display: [['Shanghai', 23.7],['PTJ1',3],['vbnvbn', 1]] 
    $('#container').highcharts({ 
     console.log(data) //doesn't display anything 
     chart: {type: 'column'}, 
     title: {text: 'World\'s largest cities per 2014'}, 
     subtitle: {text: 'Source: <a href="http://en.wikipedia.org/wiki/List_of_cities_proper_by_population">Wikipedia</a>'}, 
     legend: {enabled: false}, 
     tooltip: {pointFormat: 'Population in 2008: <b>{point.y:.1f} millions</b>'}, 
     xAxis: { 
      type: 'category', 
      labels: {rotation: -45,style: {fontSize: '13px',fontFamily: 'Verdana, sans-serif'}}, 
      title: {text: 'Cities'} 
     }, 
     yAxis: { 
      min: 0, 
      title: {text:'Population (millions)'} 
     }, 
     series: [{ 
      name: 'Population', 
      data: data, 
      dataLabels: { 
       enabled: true, 
       rotation: -90, 
       color: '#FFFFFF', 
       align: 'right', 
       format: '{point.y:.1f}', 
       y: 10, 
       style: {fontSize: '13px',fontFamily: 'Verdana, sans-serif'} 
      } 
     }] 
    }); 
    } 
    }); 
});

來源

2015-11-29 user3787229

等待，你有沒有意識到'的console.log（數據）//不顯示anything'是一個對象裏面？據我所知，它是無效的。但是我想知道你的瀏覽器控制檯是否會大肆宣傳。到目前爲止，您的代碼大致類似於[this]（http://stackoverflow.com/questions/19236113/creating-highchart-with-ajax-json-data）。也許你可以用它作爲參考。 –

我完成它通過查看本教程，

http://www.knowstack.com/different-ways-of-loading-highcharts-data/

Ajax的腳本：

$(function() { 

var processed_json = new Array();  

$.getJSON('{!! url("komputer/chart") !!}', function(data) { 
    for(var key in data){ 
     processed_json.push(new Array(data[key].key, data[key].value)); 
    } 

    $('#container').highcharts({ 
     chart: {type: 'column'}, 
     title: {text: 'World\'s largest cities per 2014'}, 
     subtitle: {text: 'Source: <a href="http://en.wikipedia.org/wiki/List_of_cities_proper_by_population">Wikipedia</a>'}, 
     legend: {enabled: false}, 
     tooltip: {pointFormat: 'Population in 2008: <b>{point.y:.1f} millions</b>'}, 
     xAxis: { 
      type: 'category', 
      labels: {rotation: -45,style: {fontSize: '13px',fontFamily: 'Verdana, sans-serif'}}, 
      title: {text: 'Cities'} 
     }, 
     yAxis: { 
      min: 0, 
      title: {text:'Population (millions)'} 
     }, 
     series: [{ 
      name: 'Population', 
      data: processed_json, 
      dataLabels: { 
       enabled: true, 
       rotation: -90, 
       color: '#FFFFFF', 
       align: 'right', 
       format: '{point.y:.1f}', 
       y: 10, 
       style: {fontSize: '13px',fontFamily: 'Verdana, sans-serif'} 
      } 
     }] 
    }); 
});

}）;

JSON數據，而不是字符串，數據仍然沒有完成：

{"3":{"key":"PTJ1","value":3},"6":{"key":"vbnvbn","value":1}}

來源

2015-11-29 11:09:17 user3787229

所以它的工作與否？ –

@ SebastianBochan，對於遲到的答覆感到抱歉，是的，通過查看教程，我能夠解決它 – user3787229

HighchartsJS從URL獲取數據並將其傳遞給系列數據

回答

相關問題