Acest articol este un articol oglindă al traducerii automate, vă rugăm să faceți clic aici pentru a sări la articolul original.

Vedere: 14060|Răspunde: 2

[Unghiular] 【Practice】Angular6.x introduce tutorialul de diagrame echarts

[Copiază linkul]
Postat pe 24.04.2019 15:27:55 | | | |
prefață

Deoarece Angular2+ este dezvoltat folosind TypeScript, dacă vrei să folosești echarts, trebuie să instalezi pluginul Angular NGX-echarts. Randările sunt următoarele:



Adresă GitHub:Autentificarea cu hyperlink este vizibilă.
Cunoștințe legate de echarts și API:Autentificarea cu hyperlink este vizibilă.

Instalare

Comanda de Instalare NPM:

instalare npm module_name -S, adică instalare npm module_name --salvează write-dependenciesnpm install module_name-D --d, adică instalare npm module_name --save-dev scrie devDependencies


A introdus modulul ngx-echarts

Introduceți NgxEchartsModule în modulul rădăcină app.modules.ts

Deoarece pagina mea este un subcomponent, trebuie să o import într-un submodulNu trebuie importat în modulul părinte app.modules.ts, codul este următorul:

Submodulele nu pot importa componente din modulul părinte, dacă vrei să partajezi componenta de antet, importă componenta de antet în fiecare modul pe care vrei să-l folosești.
Modulele partajate sunt și module părinte care pot exporta lucruri din modulele copil, adaugi ce trebuie partajat într-un modul și apoi îl imporți în alte module

Linkuri de referință:Autentificarea cu hyperlink este vizibilă.


Pagina HTML componentă itsvse.component.html introdusă:

Înălțimea setului foaiei de stil CSS:

itsvse.component.ts cod (ambele coduri TS de mai jos sunt acceptabile)

Metoda 1:

Metoda 2:

În final, rulează proiectul și poți vedea efectul graficului echarts.






Precedent:Angular6 introduce tutorialul hărții Baidu
Următor:Docker în practică
 Proprietarul| Postat pe 10.05.2019 10:48:10 |
 Proprietarul| Postat pe 10.05.2019 16:25:17 |
Disclaimer:
Tot software-ul, materialele de programare sau articolele publicate de Code Farmer Network sunt destinate exclusiv scopurilor de învățare și cercetare; Conținutul de mai sus nu va fi folosit în scopuri comerciale sau ilegale, altfel utilizatorii vor suporta toate consecințele. Informațiile de pe acest site provin de pe Internet, iar disputele privind drepturile de autor nu au legătură cu acest site. Trebuie să ștergi complet conținutul de mai sus de pe calculatorul tău în termen de 24 de ore de la descărcare. Dacă îți place programul, te rugăm să susții software-ul autentic, să cumperi înregistrarea și să primești servicii autentice mai bune. Dacă există vreo încălcare, vă rugăm să ne contactați prin e-mail.

Mail To:help@itsvse.com