将Echarts集成到ionic4应用程序中

1.第一种
首先我们创建一个ionic4的标准项目

image.png

接下来，我们安装Echarts库和NGX Echarts库，它提供了一个角度指令，允许我们非常容易地将Echarts集成到angular应用程序中。有关最新文档，https://github.com/xieziyu/ngx-echarts

image.png

要使用ngx echarts指令，我们必须导入模块。在模块文件中导入ngxechartsmodule。

image.png

然后就可以使用了,比如

image.png

image.png

image.png

2.第二种
1.安装typings及echarts
npm install typings echarts --global
2.安装 ECharts 的 TypeScript 定义文件
npm install @types/echarts --save
3.在使用echarts的页面ts文件中引用echarts
import * as echarts from 'echarts';
4.Ionic4中，页面都是由组件拼起来的，所以使用echarts，需要将图形作为插件
5.创建组件：ng generate component echart-pie // 饼图组件
6.接下来就是在ts中创建option。找echarts官网就可以了

image.png

image.png

image.png

image.png

image.png

image.png

参考：https://golb.hplar.ch/2017/02/Integrate-ECharts-into-an-Ionic-2-app.html
官网：https://echarts.baidu.com/