javascript - Google Chart - 容器未定义

Question

我知道这个问题已经有人问过，但我找不到很多有用的答案。在绘制我的图表之前，我创建了一个 div 来保存它:

var newDiv = document.createElement('div');
newDiv.id = ...
newDiv.class = ...
...

然后我将它推送到一个数组中，该数组将通过 ng-repeat 与 AngularJS 一起显示:

$scope.arrayDiv.push(newDiv);

然后我创建 ChartWrapper :

var chart = new google.visualization.ChartWrapper({
    'chartType': chartType, 
    'containerId': $scope.arrayDiv[i].id, 
    ....
});

我创建了 DataTable(并填充它，但这不是问题的一部分)。

var data = new google.visualization.DataTable();

最后，我画了它(或至少尝试):

chart.setDataTable(data);
chart.draw();

正如您所猜到的，这是我得到错误的地方 Container is not defined。

我尝试这样做来检查:console.log($scope.arrayDiv[i].id)，我得到了预期的 ID。

据我从其他问题(例如 Google Charts ColumnChart won't render because "Container is not defined")中了解到，问题来自代码执行的顺序。但是，我只想在用户单击按钮时准备和绘制图表。我该如何组织我的代码来解决这个问题？

Answer 1

这是因为 newDiv 没有被添加到 DOM 的任何地方。你需要做这样的事情:

var currentDiv = document.getElementById("div1"); 
document.body.insertBefore(newDiv, currentDiv);