Angulaires-Graphiques - Graphique à secteurs,afficher les étiquettes à l'intérieur de chaque tranche de données

Je suis en phase d'apprentissage de la angulaires-graphique-js. Je suis en train d'utiliser angular-chart.js pour tracer un graphique à secteurs. Mais je suis incapable de trouver un moyen pour montrer les étiquettes (pas les info-bulles) sur le graphique en secteurs, qui décrivent chaque tranche de données.

Voici comment j'ai fait:

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;
    }
]);

HTML:

<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>

InformationsquelleAutor Panchaxari Hiremath | 2015-07-30

4

Adapté de https://stackoverflow.com/a/25913101/360067 pour angulaires-le graphique

Ajouter le suivant options à votre portée
```
$scope.options = {
    tooltipEvents: [],
    showTooltips: true,
    tooltipCaretSize: 0,
    onAnimationComplete: function () {
        this.showTooltip(this.segments, true);
    },
};
```
Et utilisez-la dans votre directive
```
<canvas id="pie33" options="options"...
```
Violon (avec les sections pertinentes de votre code) - http://jsfiddle.net/zuhp8k5f/154/
- Oui, je comprends maintenant,Dans angulaires-le graphique, nous pouvons utiliser customizied options de chart.js pour la gestion des info-bulles
- espérons que résoudre votre problème. Cheers!
- Oui, il n'a résoudre mon problème.:)
- Bon à entendre! Vous pourriez vouloir marquer la réponse comme acceptées. Cheers!
- Je n'étais pas conscient que j'ai accepter la réponse!! Merci
- pouvez-vous partager le violon, parce que dans l'au-delà "jsfiddle.net/zuhp8k5f" je n'ai pas d'affichage graphique
- Le violon ne semble plus fonctionner @potatopeelings
- merci! Le rawgit lien angulaire chart.js a été pointant vers le dossier dist sur le master. Je l'ai changé pour pointer vers la version spécifique.
- Je suis l'aide de la version 2.7.0 et ce n'est pas de travail.
InformationsquelleAutor potatopeelings

Vous devez vous connecter pour publier un commentaire.