如何在小程序里使用ECharts(快速上手)

   日期:2020-07-17     浏览:92    评论:0    
核心提示:如何在小程序里使用ECharts(快速上手)首先ECharts的官网给出了如何在小程序里使用ECharts的官方文档:链接: link.https://echarts.apache.org/zh/tutorial.html但是官方文档里并没有给全,按照它的步骤来做并不能实现数据可视化,在按照官方文档做到最后一步,接下来做到以下几点就能显示图表1.首先在你创建的页面的.JS文件下引用echarts//路径不同自行更改import * as echarts from ../../ec-canva

如何在小程序里使用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;
  
}

做到以上几点就可以实现数据可视化了,如果本文对你有帮助还请点赞,关注!!!

 
打赏
 本文转载自:网络 
所有权利归属于原作者,如文章来源标示错误或侵犯了您的权利请联系微信13520258486
更多>最近资讯中心
更多>最新资讯中心
0相关评论

推荐图文
推荐资讯中心
点击排行
最新信息
新手指南
采购商服务
供应商服务
交易安全
关注我们
手机网站:
新浪微博:
微信关注:

13520258486

周一至周五 9:00-18:00
(其他时间联系在线客服)

24小时在线客服