angular 6引入echarts的具體方法
方式: 使用echarts和ngx-eachrts兩個依賴,藉助於ngx..,是因為echarts是基於js編寫,沒有ts檔案。所以就使用ngx-echarts來使用即可。
第一步:安裝依賴
1 2 |
|
第二步:在Module中引入
1 2 3 4 5 6 7 8 9 |
|
第三步:在angular-cli中新增js引入
1 2 3 4 5 6 7 8 |
"../node_modules/echarts/dist/echarts.min.js"
|
第四步:只需要在echarts中放入你需要的html
然後在對應的元件中引入:
import * as echarts from 'echarts';
(第二步和第三步為全域性設定,如果僅僅需要元件按需載入,不需要第二步和第三步)
ps=====》最後如果出錯,引入:
npm install @types/echarts
ps:typescript中的echarts需要注意,不能通過var 物件的形式簡寫,需要一口氣載入:
if (option && typeof option === "object") {
echarts.init( document.getElementById("container")).setOption(option, true);
}
最後修改主題色調僅僅需要檢視echarts官網:
地址:http://echarts.baidu.com/option.html#title