簡體   English   中英

如何從highchart中的json文件中獲取數據

[英]how to fetch data from json file in highchart

我正在嘗試從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>

控制台未顯示任何錯誤。 誰能看到代碼有什么問題。

我無法從您的工作中模擬您的代碼,但是,這應該可以解決:

  • TinyUpload不允許直接訪問data.json。 放在可以的地方。 (OBS:這不是JSON文件,它是描述數組/對象結構的字符串,您應該首先將其轉換為json格式);

如果您仍然決定以字符串形式接收它,請執行以下步驟:

  • 收到數據時,請使用Eval()函數進行轉換
    放入and array / object,然后將其放入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;

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM