1
votes

Comment utiliser `apexchart` dans Angular 7?

Comment utiliser apexchart dans Angular 7? Quelqu'un peut-il l'implémenter dans un script dactylographié? Je recherche son implémentation dactylographiée dans Angular mais je suis incapable de le faire. Ma version angulaire est la 7.2.4.


3 commentaires

Avez-vous essayé de l'inclure dans votre index conformément aux documents et de créer un graphique?


Oui, je l'ai fait, mais le problème était de l'implémenter dans un fichier dactylographié. J'ai besoin de quelque chose comme @type chartjs fournit. Comment utiliser ApexChart en tant que Type?


Si aucune saisie n'est disponible, vous pouvez dire à TS qu'il existe , mais vous n'obtiendrez aucune aide de type.


3 Réponses :


0
votes

1 commentaires

J'ai essayé celui-là, mais je n'ai pas pu trouver de code pour cela et en sélectionnant BAR comme type de graphique Il ne montrait aucun résultat.



0
votes

Selon le document Apexcharts sur https://apexcharts.com/docs/installation

Premièrement: vous devez installer le package: npm i apexcharts

Et encore une fois, selon le document, vous devez définir le type ApexCharts où vous souhaitez utiliser comme: importez des ApexCharts à partir de 'apexcharts'

si cela fonctionne pour vous, continuez. Mais si vous obtenez l'erreur "... n'a pas d'export par défaut", vous devez définir comme suit:
importez des ApexCharts depuis 'apexcharts / dist / apexcharts.common.js'

Ensuite, vous avez besoin d'un élément html pour lier votre graphique:

Et enfin créez votre les options de graphique dans la méthode appropriée et le restituer comme suit:

const options = {
  chart: {
    height: 300,
    type: 'line'
  },
  series: [{
    name: 'sales',
    data: [30, 40, 35, 50, 49, 60, 70, 91, 125]
  }],
  xaxis: {
    categories: [1991, 1992, 1993, 1994, 1995, 1996, 1997, 1998, 1999]
  }
}

const chart = new ApexCharts(document.querySelector("#chart"), options);
chart.render();

Votre graphique ressemblera à cette image


0 commentaires

1
votes

Vous pouvez trouver les étapes appropriées pour implémenter ApexCharts en utilisant Angular dans le lien suivant. https://apexcharts.com/docs/angular-charts/

Consultez ce blog pour obtenir des informations détaillées sur la configuration d'un projet pour ApexCharts et vous pourrez également voir un exemple pour générer différents types de graphiques.

Blog moyen .


0 commentaires