1

我正在创建一个管理仪表板,所以我需要在同一页面中提供两个饼图。我正在使用 angular-chartjs 创建饼图。当我尝试显示两个饼图代码时,两个饼图都正确显示当另一个饼图代码被注释时(即两者都单独工作),然后只有第二个加载图例并且第一个饼图空间为空白,只有图例正在显示。当我将光标移动到空白处时,第一个图表出现在屏幕上。同样,如果我重新加载页面,则仅显示第二个图表。这是我的代码

 $scope.labels = userList;
      $scope.labels1 = userList;
      $scope.TCollectedActuals = CA;
      $scope.TForecastAmount = FA;

html

<div class="col-md-4" id="chart1">
<div class="panel panel-primary" ng-show="sanClaimAmount.length > 0">
  <div class="panel-heading">
    <h3 class="panel-title">Collected Actuals</h3>
  </div>
  <div class="panel-body">
    <canvas id="ca" class="chart chart-doughnut"
            chart-data="TCollectedActuals" chart-labels="labels"     legend="true">
     </canvas>
   </div>
 </div>
 </div>
  <div class="col-md-4" id="chart2">
  <div class="panel panel-primary" ng-show="sanClaimAmount.length > 0">
  <div class="panel-heading">
    <h3 class="panel-title">Forecast Amount</h3>
  </div>
  <div class="panel-body">
    <canvas id="fa" class="chart chart-doughnut"
            chart-data="TForecastAmount" chart-labels="labels1" legend="true">
     </canvas>
   </div>
 </div>
</div>

我在网上搜索了同样的问题,但没有答案。需要帮助。

4

0 回答 0