如何在小程序里使用ECharts(快速上手)
首先ECharts的官网给出了如何在小程序里使用ECharts的官方文档:
链接: link.
https://echarts.apache.org/zh/tutorial.html
但是官方文档里并没有给全,按照它的步骤来做并不能实现数据可视化,在按照官方文档做到最后一步,接下来做到以下几点就能显示图表
1.首先在你创建的页面的.JS文件下引用echarts
//路径不同自行更改
import * as echarts from '../../ec-canvas/echarts';
2.给ec-canvas组件添加样式
ec-canvas {
width: 100%;
height: 50%;
}
3.在app.wxss里添加公共的.container样式
.container {
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
display: flex;
flex-direction: column;
align-items: center;
justify-content: space-between;
box-sizing: border-box;
}
做到以上几点就可以实现数据可视化了,如果本文对你有帮助还请点赞,关注!!!