Bu makale makine çevirisi ayna makalesidir, orijinal makaleye geçmek için lütfen buraya tıklayın.

Görünüm: 14060|Yanıt: 2

[Angular] 【Practice】Angular6.x echarts chart tutorial tanıtıyor

[Bağlantıyı kopyala]
Yayınlandı 24.04.2019 15:27:55 | | | |
önsöz

Angular2+ TypeScript kullanılarak geliştirildiği için, echarts kullanmak istiyorsanız Angular eklentisi NGX-echarts'ı yüklemeniz gerekir. Çizimler aşağıdaki gibidir:



GitHub adresi:Bağlantı girişi görünür.
echarts ile ilgili bilgi ve API:Bağlantı girişi görünür.

Kurma

NPM kurulum komutu:

npm install module_name -S yani npm install module_name --save write-dependenciesnpm install module_name-D --d, yani npm install module_name --save-dev devDependencies yazır


ngx-echarts modülü tanıtıldı

app.modules.ts kök modülünde NgxEchartsModule'ü tanıtın

Sayfam bir alt bileşen olduğu için onu bir alt modüle aktarmam gerekiyorapp.modules.ts ana modülde içe aktarılması gerekmez, kod şöyledir:

Alt modüller ana modülden bileşenleri içe aktaramaz, başlık bileşenini paylaşmak istiyorsanız, kullanmak istediğiniz her modüle başlık bileşenini aktarın.
Paylaşılan modüller ayrıca ana modüllerdir ve ana modüllerdir; bunlar ana modüllerden aktarılabilen bir modüldür, paylaşılması gerekeni bir modüle eklersiniz ve sonra diğer modüllere aktarırsınız

Referans bağlantıları:Bağlantı girişi görünür.


Bileşen HTML sayfası itsvse.component.html tanıtıldı:

CSS Stil Sayfası Set Yüksekliği:

itsvse.component.ts kodu (aşağıdaki her iki TS kodu da kabul edilebilir)

Yöntem 1:

Yöntem 2:

Son olarak, projeyi çalıştırın ve echarts chart etkisini görebilirsiniz.






Önceki:Angular6, Baidu harita eğitimini tanıtıyor
Önümüzdeki:Docker Uygulamada
 Ev sahibi| Yayınlandı 10.05.2019 10:48:10 |
 Ev sahibi| Yayınlandı 10.05.2019 16:25:17 |
Feragatname:
Code Farmer Network tarafından yayımlanan tüm yazılım, programlama materyalleri veya makaleler yalnızca öğrenme ve araştırma amaçları içindir; Yukarıdaki içerik ticari veya yasa dışı amaçlarla kullanılamaz, aksi takdirde kullanıcılar tüm sonuçları ödemelidir. Bu sitedeki bilgiler internetten alınmakta olup, telif hakkı anlaşmazlıklarının bu siteyle hiçbir ilgisi yoktur. Yukarıdaki içeriği indirmeden sonraki 24 saat içinde bilgisayarınızdan tamamen silmelisiniz. Programı beğendiyseniz, lütfen orijinal yazılımı destekleyin, kayıt satın alın ve daha iyi orijinal hizmetler alın. Herhangi bir ihlal olursa, lütfen bizimle e-posta yoluyla iletişime geçin.

Mail To:help@itsvse.com