小编Pan*_*ath的帖子

Angular-Charts - 饼图,显示每个数据切片内的标签

我正在学习 angular-chart-js 的阶段。我正在尝试使用 angular-chart.js 来绘制饼图。但是我无法找到一种在饼图上显示标签(而不是工具提示)的方法,这些标签描述了每个数据切片。

这是我如何做到的:

angular.module('App').controller('Controller', ['$scope', '$http', '$location', '$window', '$routeParams',
    function($scope, $http, $location, $window) {
        var diskDataJson = {
            "data": [80, 12],
            "labels": [Used space, Free Space],
            "colours": ['#9AB6F0', '#C2D3F6']
        };
    
        $scope.pieDiskData = json;
    }
]);
Run Code Online (Sandbox Code Playgroud)
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<table border="0" width="100%">
  <tr>
    <td style="border-left: 1px solid #0099CC" width="25%">
      <center><span><label ng-bind-html="'load.static.dashboard.system.DUSAGE' | translate"/></span>
      </center>
      <canvas id="pie33" class="chart chart-pie chart-xs ng-isolate-scope" height="120" width="240" data="pieDiskData.data" labels="pieDiskData.labels" colours="pieDiskData.colours" legend="true"></canvas>
    </td>
  </tr>
</table>
Run Code Online (Sandbox Code Playgroud)

javascript angularjs chart.js angular-chart

2
推荐指数
1
解决办法
2万
查看次数

标签 统计

angular-chart ×1

angularjs ×1

chart.js ×1

javascript ×1