在条形图中使用 json url 数据

Question

这是存储在 URL 中的 json 数据（例如：http://localhost/icx/test/link.html）。这些数据是实时的，并且会随着时间而变化    [{        "call_time": "0",        "total_inc_traffic": "1363.10",        "total_out_traffic": "88.70"    }, {        "call_time": "1",        "total_inc_traffic": "479.57",        "total_out_traffic": "36.98"    }, {        "call_time": "2",        "total_inc_traffic": "239.57",        "total_out_traffic": "13.43"    }, {        "call_time": "3",        "total_inc_traffic": "190.28",        "total_out_traffic": "8.20"    }, {        "call_time": "4",        "total_inc_traffic": "223.80",        "total_out_traffic": "0.00"    }, {        "call_time": "5",        "total_inc_traffic": "158.87",        "total_out_traffic": "19.58"    }, {        "call_time": "6",        "total_inc_traffic": "27.52",        "total_out_traffic": "36.18"    }, {        "call_time": "7",        "total_inc_traffic": "47.70",        "total_out_traffic": "69.57"    }, {        "call_time": "8",        "total_inc_traffic": "2234.35",        "total_out_traffic": "137.60"    }, {        "call_time": "9",        "total_inc_traffic": "150.67",        "total_out_traffic": "162.07"    }, {        "call_time": "10",        "total_inc_traffic": "4497.05",        "total_out_traffic": "267.32"    }, {        "call_time": "11",        "total_inc_traffic": "5049.87",        "total_out_traffic": "242.42"    }, {        "call_time": "12",        "total_inc_traffic": "5227.67",        "total_out_traffic": "286.88"    }, {        "call_time": "13",        "total_inc_traffic": "3384.30",        "total_out_traffic": "360.88"    }, {        "call_time": "14",        "total_inc_traffic": "3650.73",        "total_out_traffic": "328.28"    }]如何在我的 javascript 条形图代码中使用此 URL（例如：http://localhost/icx/test/link.html）？如果有人有任何想法，请帮助

Answer 1

当您说“存储在 URL 中的 json 数据”时，您的意思是这样吗？

http://localhost/icx/test/link.html?data=example_data

这称为获取数据。如果您将所有给定的数据存储在 URL 中，那是一个坏主意，因为 URL的长度确实有限制（通常为 2048 个字符）。

至于显示条形图，canvasJS之类的插件可以很好地帮助您，首页上 有一个代码示例。

Answer 2

您应该使用AJAX和jQuery从 Link 获取数据，如下所示：

$(document).ready(function () {

var output=[];

  $.ajax('path of your link', 

  {

    dataType: 'json', // type of response data

    timeout: 500,     // timeout milliseconds

    success: function (data,status,xhr) {   // success callback function

        console.log(data);

        output=data;

        /** Here you have to separate data received from link into 3 different array variables which then you can use in chart code where right now you have static array. **/

    },

    error: function (jqXhr, textStatus, errorMessage) { // error callback 

        console.log('Error: ' + errorMessage);

    }

  });

});