呈现动态数量的高图表不起作用

render a dynamic number of highcharts charts is not working

本文关键字:高图表 不起作用 动态      更新时间:2023-09-26

我正在尝试这个

$scope.chartsArray = [];
for (var j = 0; j <= i; j++) { //i its the amount of charts to display
    document.getElementById("charts").innerHTML += '<div class="col-md-6" id="chart-' + j + '"></div>';
    $scope.tmp = new Highcharts.Chart({
        series: [1,2,3,4],
        chart: { type: 'column', renderTo: 'chart-' + j },
    });
    $scope.chartsArray.push($scope.tmp);
}

关于这个div

<div id="charts" class="col-md-12" style="margin-top:50px">  </div>

但是当我加载图表时,只有最后一个加载的图表正常工作,其他图表不渲染序列,交互没有响应(如导出或隐藏序列)。这是为什么呢?你们知道还有什么其他方法可以做到这一点吗?

从角度控制器访问和修改 DOM 是一种不好的做法。请改用指令。这是一个用于高图表 https://github.com/pablojim/highcharts-ng