J'utilise le module angulaire angular-grapht.js . Il est simple de travailler avec et très intelligent. Mais j'ai remarqué que je ne peux pas changer le la vue: Est-ce que quelqu'un sait Comment définir la largeur et largeur et hauteur des graphiques. Quelque part où j'ai lu que je dois définir la taille du graphique comme suit: hauteur dans angular-grapht.js?
5 Réponses :
OK, j'ai essayé cette solution et ça marche.
<canvas id="bar"
height="100"
width="100"
class="chart chart-bar"
chart-data="dataChart"
chart-labels="labels"
chart-click="onClick"
chart-options="options">
</canvas>
Pour définir la hauteur des graphiques en fonction de la taille de l'écran, j'utilise ce code:
J'espère que ces codes aideront.
Si vous modifiez $ Porce.Height_chart Une fois que le graphique a été chargé, la hauteur de l'élément de canvas ne change pas pour la correspondre. Il est codé dur à la hauteur d'origine calculée.
Le problème est que les valeurs d'attribut de hauteur et de largeur sont stockées dans le graphique et ne sont pas mises à jour de la même manière que les autres attributs sont. Pour résoudre ce problème, vous devez ajouter un auditeur à l'événement Créer et modifier manuellement la hauteur dans l'objet graphique
html: p> js: p> $scope.$on('chart-create', function (event, chart) {
chart.chart.height = $scope.chart.height;
});
Vous pouvez également envelopper le
graphique utilise son conteneur parent pour mettre à jour le rendu de toile et les tailles d'affichage. Cependant, cette méthode nécessite que le conteneur soit relativement positionné et dédié à la toile de graphique uniquement. La réactivité peut alors être réalisée en définissant des valeurs relatives pour la taille du conteneur
Besoin d'ajouter votre code de code de votre réponse et non dans un Codepen car ils disparaissent généralement.