Javascript 角度图表和在一页上创建多个图表

正在寻找在单个页面上包含多个角度图表对象的帮助。我想创建一个类似仪表板的页面，其中包括多个图表。我让我的图表正常工作，它们是从MySQL中提取出来的，但我一次只能加载一个图表。我可以添加几个图表，第一个将加载，但没有一个紧随其后。我可以注释出第一个图表，然后加载下一个图表。单独地，所有图表都会加载良好，只是不会在其他图表的任何组合中加载。我尝试过使用不同的图表类型、不同的角度应用程序、不同的控制器等。目前，我有两个图表连接起来，可以调用两个不同的PHP文件，它们是彼此的副本。第二个php图表永远不会在堆栈跟踪中被调用。编码最简单：

        <div class="container">
        <div class="row">

          <div class="col-md-4" id="Chart1">
            <div ng-controller="PieCtrl" ng-app="ChartApp">
        <canvas id="pie" class="chart chart-pie" chart-data="data" chart-labels="labels"></canvas>
    </div> 

    <script>angular.module('ChartApp', ['chart.js']);</script>
    <script>
        angular.module("ChartApp", ["chart.js"]).controller("PieCtrl", function($scope, $http) {
    $http.get('./GetTestData.php').success(function(data) {
    var names = [];

    for (var i = 0; i < data.length; i++) {
        var obj = data[i];

        if (obj.Name != undefined) {
            names.push(obj.Name);
        }
    }

    var values = [];
    for (var i = 0; i < data.length; i++) {
        var obj = data[i];

        if (obj.Name != undefined) {
            values.push(obj.Value);
        }
    }
    //$scope.records = data;
    $scope.labels = names;
    $scope.data = values;
});

});
    </script>
          </div>
          <div class="col-md-4" id="Chart2">
            <p>Test2</p>
          </div>
          <div class="col-md-4">
            <div ng-controller="PieCtrl2" ng-app="ChartApp2">
        <canvas id="pie" class="chart chart-pie" chart-data="data1" chart-labels="labels1"></canvas>
    </div> 

    <script>angular.module('ChartApp2', ['chart.js']);</script>
    <script>
        angular.module("ChartApp2", ["chart.js"]).controller("PieCtrl2", function($scope, $http) {
    $http.get('./GetTestData2.php').success(function(data) {
    var names = [];

    for (var i = 0; i < data.length; i++) {
        var obj = data[i];

        if (obj.Name != undefined) {
            names.push(obj.Name);
        }
    }

    var values = [];
    for (var i = 0; i < data.length; i++) {
        var obj = data[i];

        if (obj.Name != undefined) {
            values.push(obj.Value);
        }
    }
    //$scope.records = data;
    $scope.labels1 = names;
    $scope.data1 = values;
});

});
    </script>

angular.module（'ChartApp'，['chart.js']）；
angular.module（“ChartApp”，[“chart.js”]）.controller（“PieCtrl”，函数（$scope，$http）{
$http.get（'./GetTestData.php'）.success（函数（数据）{
变量名称=[]；
对于（变量i=0；i
angular.module（'ChartApp2'，['chart.js']）；
angular.module（“ChartApp2”，[“chart.js”]）.controller（“PieCtrl2”，函数（$scope，$http）{
$http.get（'./GetTestData2.php'）.success（函数（数据）{
变量名称=[]；
对于（变量i=0；i

尝试使用相同的模块：angular.module（“ChartApp”、[“chart.js”]）和no“ChartApp2”。我在同一页上有多个图表，它可以很好地使用同一个模块：angular.module（“ChartApp”，“chart.js”]）和no“ChartApp2”。我有多个图表在同一页上，它的工作很好