map china not exists. the geojson of the map must be provided.

map china not exists. the geojson of the map must be provided.

场景:引入echarts地图报错map china not exists. the geojson of the map must be provided.

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

*目前echarts版本:5.5.0

解决办法1:看网上说降低echarts版本,我因为之前还用高版本在同页面写了几个柱线图,样式不兼容就回退了

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

解决办法2:自己导入china.json文件,使用echarts.registerMap方法注册地图;

1.点击—>china.json的在线文档
在这里插入图片描述

2.复制下来,在自己的项目中创建 .json 文件粘贴进去,我是放在了assets/map/china.json文件里,也可以放在node_modules/echarts里面,例:
在这里插入图片描述
3.在使用到echarts中的组件中导入 刚刚复制来的china数据:

//根据自身情况,粘贴来的数据放在哪里就从哪里导入
import chinaMap from "@/assets/map/china.json";

//注册地图到echarts中  这里的 "china" 要与地图数据的option中的geo中的map对应
echarts.registerMap("china", { geoJSON: chinaMap });

在这里插入图片描述
4.渲染成功
在这里插入图片描述

注意:如果做完一切,一直循环报错Failed to execute ‘drawImage’ on ‘CanvasRenderingContext2D’: The image argument is a canvas element with a width or height of 0的话,那就去检查自己的init的echarts容器是否有给定宽度和高度!!!

在这里插入图片描述

相关推荐

最近更新

  1. docker php8.1+nginx base 镜像 dockerfile 配置

    2024-03-26 07:16:04       94 阅读
  2. Could not load dynamic library ‘cudart64_100.dll‘

    2024-03-26 07:16:04       100 阅读
  3. 在Django里面运行非项目文件

    2024-03-26 07:16:04       82 阅读
  4. Python语言-面向对象

    2024-03-26 07:16:04       91 阅读

热门阅读

  1. node.js常用的命令

    2024-03-26 07:16:04       35 阅读
  2. ARMd7 作业

    2024-03-26 07:16:04       32 阅读
  3. spring boot中使用spring cache

    2024-03-26 07:16:04       44 阅读
  4. arm iic通信

    2024-03-26 07:16:04       44 阅读
  5. GPT-4:下一代人工智能的突破与挑战

    2024-03-26 07:16:04       39 阅读
  6. 使用GPT将文档生成问答对

    2024-03-26 07:16:04       34 阅读
  7. Spring和spring Boot的区别

    2024-03-26 07:16:04       30 阅读
  8. 考研复习时间表(3-4月)(待完善)

    2024-03-26 07:16:04       38 阅读