Cet article est un article miroir de traduction automatique, veuillez cliquer ici pour accéder à l’article original.

Vue: 14060|Répondre: 2

[Angulaire] 【Practice】Angular6.x présente le tutoriel des graphiques électroniques

[Copié le lien]
Publié sur 24/04/2019 15:27:55 | | | |
préface

Comme Angular2+ est développé avec TypeScript, si vous souhaitez utiliser echarts, vous devez installer le plugin Angular NGX-echarts. Les rendus sont les suivants :



Adresse GitHub :La connexion hyperlientérée est visible.
Connaissances liées à echarts et API :La connexion hyperlientérée est visible.

Installation

Commande d’installation du NPM :

npm install module_name -S c’est-à-dire npm install module_name --save write-dependenciesnpm install module_name-D --d, c’est-à-dire npm install module_name --save-dev écrit devDependencies


Introduction du module ngx-echarts

Introduire NgxEchartsModule dans le module racine app.modules.ts

Comme ma page est un sous-composant, je dois l’importer dans un sous-moduleIl n’est pas nécessaire d’importer dans le module parent app.modules.ts, le code est le suivant :

Les sous-modules ne peuvent pas importer de composants depuis le module parent, si vous souhaitez partager le composant d’en-tête, importez ce composant dans chaque module que vous souhaitez utiliser.
Les modules partagés sont aussi des modules parents qui peuvent exporter des éléments à partir de modules enfants, vous ajoutez ce qui doit être partagé dans un module, puis vous l’importez dans d’autres modules

Liens de référence :La connexion hyperlientérée est visible.


Page HTML composante itsvse.component.html introduite :

Hauteur de jeu de la feuille de style CSS :

itsvse.component.ts code (les deux codes TS ci-dessous sont acceptables)

Méthode 1 :

Méthode 2 :

Enfin, lance le projet et tu peux voir l’effet du graphique echarts.






Précédent:Angular6 présente le tutoriel de la carte Baidu
Prochain:Docker en pratique
 Propriétaire| Publié sur 10/05/2019 10:48:10 |
 Propriétaire| Publié sur 10/05/2019 16:25:17 |
Démenti:
Tous les logiciels, supports de programmation ou articles publiés par Code Farmer Network sont uniquement destinés à l’apprentissage et à la recherche ; Le contenu ci-dessus ne doit pas être utilisé à des fins commerciales ou illégales, sinon les utilisateurs assumeront toutes les conséquences. Les informations sur ce site proviennent d’Internet, et les litiges de droits d’auteur n’ont rien à voir avec ce site. Vous devez supprimer complètement le contenu ci-dessus de votre ordinateur dans les 24 heures suivant le téléchargement. Si vous aimez le programme, merci de soutenir un logiciel authentique, d’acheter l’immatriculation et d’obtenir de meilleurs services authentiques. En cas d’infraction, veuillez nous contacter par e-mail.

Mail To:help@itsvse.com