【问题标题】:Creating multiple lines on a Google Chart by looping through getJson urls通过遍历 getJson url 在 Google Chart 上创建多行
【发布时间】:2017-08-18 07:18:09
【问题描述】:

我有一个 getJson 函数,它带有一个名为“feed”的参数,它遍历多个 URL。 我想创建一个谷歌图表,其中有多行类似于屏幕截图,每行来自不同的 JSON 提要。 但是,当我尝试时,它似乎只产生一行(我认为是因为它正在循环,但只是在循环中获取最终的 url)。 This is what I want to see

这是我添加的代码:

    function chartLoop(feed){
var chartDivs = "chart_div1";
$.getJSON(feed + '&start_date=' + dateFrom + '&end_date=' + dateTo + '&' + order  , function(json){

var dataSet = json.dataset;
var dataAll = json.dataset.data;
var title = dataSet.name;
var database = dataSet.database_code;
var count = dataAll.length;

  // Load the Visualization API and the corechart package.
  google.charts.load('current', {'packages':['corechart']});

  // Set a callback   to run when the Google Visualization API is loaded.
  google.charts.setOnLoadCallback(drawChart);

  // Callback that creates and populates a data table,
  // instantiates the pie chart, passes in the data and
  // draws it.
  function drawChart() {

    // Create the data table.
    var data = new google.visualization.DataTable();



    data.addColumn('string', 'Date');
    data.addColumn('number', 'Amount');


  for(var i = 1; i < count ; i++) { 




   data.addRows([
     [dataAll[i][0], dataAll[i][1]]
   ]);     

   }
    // Set chart options
    var options = {'title':title,
                   'width':1000,
                   'height':700};

    // Instantiate and draw our chart, passing in some options.
    var chart = new google.visualization.LineChart(document.getElementById(chartDivs));
    chart.draw(data, options);
  } 



})};

【问题讨论】:

    标签: json loops google-visualization


    【解决方案1】:

    包裹在闭包/function中,而不是for循环,应该锁定i的值...

    $.each(new Array(count), function (i) {
       data.addRows([
         [dataAll[i][0], dataAll[i][1]]
       ]);     
    });
    

    【讨论】:

    • 这个问题好运吗?
    • 对不起,我从来没有回复过你。我最终无法让它工作,但谢谢你
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2013-12-07
    • 1970-01-01
    • 1970-01-01
    • 2015-04-22
    • 2015-01-14
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多