使用Echarts找不到自带china地图?

关于使用Echarts找不到自带china地图

最近写的系统中有用到Echarts的地图,网上说需要引用Echarts自带的China地图

import 'echarts/map/js/china.js'

奈何 node_moudle 里面的 echarts 并没有map文件夹
后来查阅资料发现是Echarts版本在作祟

解决
卸载掉原来的echarts版本:

npm uninstall echarts

安装echarts4.8版本

npm install echarts@4.8 --save

完美解决!

  • 2
    点赞
  • 5
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
使用echarts在vue项目中可以通过以下步骤: 1. 安装echarts 可以通过npm或yarn来安装echarts ``` npm install echarts --save ``` ``` yarn add echarts ``` 2. 引入echarts 在需要使用echarts的vue组件中,通过import语句引入echarts: ``` import echarts from 'echarts' ``` 3. 创建echarts图表 在vue组件中,可以通过以下方式创建echarts图表: ``` <template> <div class="chart-container" ref="chart"></div> </template> <script> import echarts from 'echarts' export default { mounted() { const chart = echarts.init(this.$refs.chart) chart.setOption({ // echarts配置 }) } } </script> ``` 在上面的代码中,我们通过ref属性引用了一个div元素,然后通过this.$refs.chart获取到了这个div元素,在mounted钩子函数中通过echarts.init方法初始化了一个echarts实例,最后通过chart.setOption方法设置了echarts的配置。 4. 实时数据更新 如果需要实现实时数据更新,可以通过watch监听数据的变化,然后在回调函数中更新echarts图表: ``` <template> <div class="chart-container" ref="chart"></div> </template> <script> import echarts from 'echarts' export default { data() { return { chartData: [] } }, mounted() { const chart = echarts.init(this.$refs.chart) this.setChartOption(chart, this.chartData) }, watch: { chartData: { handler(newData) { const chart = echarts.init(this.$refs.chart) this.setChartOption(chart, newData) }, deep: true } }, methods: { setChartOption(chart, data) { chart.setOption({ // echarts配置 series: [ { data: data } ] }) } } } </script> ``` 在上面的代码中,我们通过watch监听了chartData的变化,在回调函数中重新创建了一个echarts实例,并调用了setChartOption方法来更新echarts图表。

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值