angular-chart.js甜甜圈图表:如何在图表中心显示数据

问题描述:

我使用angular-chart.js库(https://jtblin.github.io/angular-chart.js/)来实现甜甜圈图表,并且我有一个要求 我想要显示总数据在图表的中间如下图所示angular-chart.js甜甜圈图表:如何在图表中心显示数据

Check this image

我可以做到这一点当前库支持?我会感谢您的帮助!

不会在Chart.JS中看到任何可以让你定位这样的文本的东西,它们有标题文本,但只能是“顶部”或“底部”http://plnkr.co/edit/oYQ1WKoNq78fGVIO5eEK?p=preview < - 将一个plunkr放在一起与它,但看起来不像底层的lib支持那种叠加文本。

<!DOCTYPE html> 
<html> 

    <head> 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.2.1/Chart.js"></script> 
    <link rel="stylesheet" href="style.css" /> 
    </head> 

    <body ng-app="app" ng-controller="DoughnutCtrl"> 
    <h1>Hello Plunker!</h1> 
    <canvas id="doughnut" class="chart chart-doughnut" 
     chart-data="data" chart-labels="labels"> 
    </canvas> 
    <script data-require="[email protected]" data-semver="1.5.8" src="https://code.angularjs.org/1.5.8/angular.js"></script> 
    <script src="https://cdn.rawgit.com/jtblin/angular-chart.js/master/dist/angular-chart.js"></script> 
    <script src="script.js"></script> 
    </body> 

</html>