echarts引入china报错(The GeoJSON of the map must be provided)

52 篇文章 0 订阅

原因: echarts版本过高,ECharts 之前提供下载的矢量地图数据来自第三方,由于部分数据不符合国家《测绘法》规定,目前暂时停止下载服务。

经过一番摸索,实践出两种方法。 末尾附china.json文件,没有乱码噢。

解决方法1:使用echarts.registerMap方法

1、下载china.json文件 存放于自己的文件夹下

2、引用并使用  在初始化echarts实例前,调用echarts.registerMap方法, 在option的geo属性设置对应值

import chinaMap from "@/assets/json/china.json";
data() {
	return {
		option:{
			...
			geo:{
				map:'china',
				...
			}
		}		
	}
}
mounted() {
    echarts.registerMap("china", { geoJSON: chinaMap });
    this.myChart = echarts.init(this.$refs.echarts);
    this.drawChart();
  },

解决方法2: 下载低版本的echarts@4.1

npm ls echarts  // 查看自己的echarts版本
npm install echarts@4.1.0 --save  //下载低版本echats包含china.js

然后在组件内直接引入china.js即可

import "echarts/map/js/china.js";

china.json文件链接点下面按钮

china.json
链接:https://pan.baidu.com/s/19P0oUnMyFst0_UVhpzYGTA
提取码: tch4

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值