Javascript 如何将大数据传递到谷歌散点图

我对JavaScript和Django比较陌生，我正在努力将大数据传递给我的谷歌图表

我有一张图表，表示给定日期和距离的速度。在django视图中，我创建了距离、日期和速度的列表。我还生成了一个列表，其中包含在velocity列表中出现的排序值，以及一个根据velocity的值使用颜色的列表

我想要一张带有速度图的图表，并采用如下颜色：

所以我用散点图和速度序列。该图表是动态的，用户选择的每个项目都不同

JS生成行和列：

// Define data table rows:
  var rows = [];
  var rows_list = [];
  var vl_max = vel_list.length;
  for (i=0; i < vl_max; i+=1) {
      var date_tmp = new Date(date_list[i].split(',')[0],date_list[i].split(',')[1]-1,date_list[i].split(',')[2]);
      var date = [date_tmp];
      var vel_tmp = vel_list[i];
      var vtemp_max = vel_tmp.length;
      var tooltip_dsname = dsname_list[i];
      var tooltip_track = track_list[i];
      for (j=0; j < vtemp_max; j+=1) {
        var cell = [{v : date_tmp}]; 
        for (k=0; k < vr_max; k+=1) {
          var vel_full = vel_tmp[j];
          var vel = vel_full.toFixed(1);
          if (vel == vel_range[k]) {
          // tooltip:
          var dist = dist_list[j]/1000;
          var yyyy = date_tmp.getFullYear().toString();
          var mm = (date_tmp.getMonth()+1).toString(); // getMonth() is zero-based
          var dd = date_tmp.getDate().toString();
          var tooltip_date = yyyy + "-" + (mm[1]?mm:"0"+mm[0]) + "-" + (dd[1]?dd:"0"+dd[0]);
          var tooltip = "<b>dataset: </b>"+tooltip_dsname+"<br><b>date: </b>"+tooltip_date+"<br><b>track: </b>"+tooltip_track+"<br><b>distance: </b>"+dist+" k"+mapunit+"<br><b> velocity: </b>"+vel_full.toFixed(2)+" m/d";
          var color = color_list[k]
          var style = "point { shape-type: square; fill-color: "+color+";}"
          } else {
            var dist = NaN;
            var tooltip = "empty" ;
            var style = "empty" ;
          }
          cell.push({v: dist},{v: tooltip},{v:style});
      }
      rows_list.push({c: cell});

      }
  };

//定义数据表行：
var行=[]；
变量行列表=[]；
var vl_max=水平列表长度；
对于（i=0；i日期：“+tooltip\u date+”
轨迹：“+tooltip\u track+”
距离：“+dist+“k”+mapun+”
速度：“+vel\u full.toFixed（2）+“m/d”；
var color=颜色列表[k]
var style=“点{形状类型：正方形；填充颜色：“+color+”；}”
}否则{
var-dist=NaN；
var tooltip=“empty”；
var style=“empty”；
}
push（{v:dist}，{v:tooltip}，{v:style}）；
}
行_list.push（{c:cell}）；
}
};

以下是使用较小数据生成图表的JSFIDLE：

我遇到的问题是，当图表处理较小的数据时，一旦我想长距离、宽日期范围地加载它，浏览器就会不断弹出这样一行：“某个网站正在减慢浏览器的速度，您想做什么？{stop}{wait}”

我知道这可能是因为行太多的问题，我的网站也生成了3个类似的图表，数据相同，但在另一个X-Y轴组合中（例如X轴上的时间、Y轴上的速度和序列上的距离），它工作得非常好。这就是为什么我想以更快的方式将数据传递给图表，但我不知道如何传递

我已经尝试过使用

setTimeout

，但变化不大。我还尝试在JS端少编写一些代码，在django视图中多编写一些代码，但也没用

---

因此，任何关于如何解决这一问题的建议都将不胜感激

建议在Django中构建数据表所需的整个json，然后直接从json中创建JavaScript中的google数据表——避免任何每行操作，使用google的数据视图计算列或过滤器……完成，但窗口不断弹出。。。