关于echarts导入使用以及相关配置梳理

1.获取echarts

npm install echarts -s 

2.建立一个有大小的容器

3.引入echarts并创建实例

4.配置项和数据

5.将配置项放入echarts实例中

注:如果结合vue框架使用,初始化echarts实例的时候用this.$refs.ref的属性值  去获取dom元素(需要在容器设置属性ref,并给一个名字即为ref的属性值)

并将3-5放入到组件的mounted钩子函数里,因为dom挂载完毕才能获取真实dom元素,否则会报错。

注:导入不同的可视化图表关键在于配置项和数据,里面的配置需要查阅官方文档,并根据项目需求更改各属性。

关于地图使用需要下载相关js文件,比如想用中国地图可以下载js文件并导入(import  ./china.js),并在option里面设置geo:{map:'china'}

如果echarts官方实例不能满足需求,可以到相关galler社区去查询:https://www.makeapie.com/explore.html

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值