问题:实现带钓鱼岛和南海诸岛的中国(China)地图

环境:VUE+ ECharts

重点阐述:

1,在VUE安装ECharts后,在如下目录就有地图js/json可以使用
node_modules—echarts—map—js
node_modules—echarts—map—json
2,调用node_modules—echarts—map—js下的china.js绘制中国地图打开后就有南海诸岛,但是默认未展示钓鱼岛信息,需要点击台湾地图才能展示,这和目前测绘局要求‘中国全图必须表示南海诸岛、钓鱼岛等重要岛屿’的要求相冲突,本文主要说明如何处理这个问题
3,本文只阐述钓鱼岛问题,具体ECharts的map配置,请参考如下ECharts官网配置项手册
https://www.echartsjs.com/zh/option.html#series-map

中国全图展示钓鱼岛的方法:

1,对如下文件做修改,并使用如下文件渲染中国地图
node_modules—echarts—map—js—china.js
2,在文件echarts.registerMap(‘china’…这个方法的最后增加如下钓鱼岛信息

{"id": "830000","geometry": {"type": "Polygon","coordinates": ["@@@@B@@@@@@@B@@@B@@@@@@@BA@@@@B@@@@@@@BA@@@@B@@@@@B@@@@@B@@@@@@@B@@@B@@@@@B@@@@@@@BA@@@@B@@A@@B@@@@A@@B@@@@@B@@A@@@@BA@@@@B@@A@@@A@@A@@A@@A@@@@@A@@A@@A@@@@@@@A@@@@@A@@@@@A@@@@@@@A@@@@@@@A@@@@@A@@@@@A@@@@@@@A@@@@@A@@@@@@@@@A@@@@@A@@@@@@B@@@@AA@@@@A@@@@B@AA@@@@@AA@@@A@BA@@@@A@@A@BAA@@B@@A@@@@@@@@@A@@A@@@@A@@AA@@@@@A@@@@AA@@@@@A@@@A@@@@A@@A@@@@@A@@@@@A@@@@@@@@@A@@@@@A@@@@@@@A@@@@B@@@@@BA@@@@@@@@B@@@@@BA@@@@@@B@@B@@B@@@@@B@@@@B@@@@B@@@@@B@@B@@B@@@@B@@@@BB@@@BB@@@@B@@B@@B@@@BB@@@@B@@@@@B@@@@BB@@@@@B@@@@B@A@B@@B@@@@@B@@@@@B@@B@@@@B@@A@@BB@@"],"encodeOffsets": [[126439, 26370]]},"properties": {"cp": [123.476492, 25.744676],"name": "钓鱼岛","childNum": 1}

3,增加位置信息见如下截图:

完整效果:

[问题探讨]ECharts实现带钓鱼岛和南海诸岛的中国(China)地图相关推荐

  1. ECharts实现带钓鱼岛和南海诸岛的中国(China)地图

    转载 [问题探讨]ECharts实现带钓鱼岛和南海诸岛的中国(China)地图 环境:VUE+ ECharts 重点阐述: 1,在VUE安装ECharts后,在如下目录就有地图js/json可以使用 ...

  2. echarts 中国地图(带南海诸岛) 及各省份地图json文件

    各省份.区域的地图json文件可以去 http://datav.aliyun.com/tools/atlas 找,能下载. 中国地图(带南海诸岛) 上代码 <template><di ...

  3. echart绘制海南地图时增加南海诸岛显示(现成geojson数据)

    使用场景:产品经理要求展示海南地图时,需要显示南海诸岛: 问题:南海诸岛在中国地图上的显示,是echart在mapName='china'时,默认fix进去.但是海南省不会默认fix进去 解决方案:将 ...

  4. echarts南海诸岛问题

    echarts南海诸岛问题 echarts南海下面的小框框不显示各个岛屿,对于有些公司来讲这很敏感 解决办法: 1.新建一个china.js复制并保存以下代码,引入到项目. import " ...

  5. Echarts中国地图不能显示南海诸岛的问题

    注册中国地图的时候,必须是china,则echarts.registerMap('china', geoJson),不能China或是'中国',否则无法显示南海诸岛

  6. echarts全国地图只显示南海诸岛问题

    在使用百度开源的可视化工具echarts时,用到中国地图,参照官方文档用此段代码 value = [155, 10, 66, 78, 33, 80, 190, 53, 49.6]attr = [&qu ...

  7. Echarts 地图隐藏右下角 “南海诸岛” 的方法

    1.需求: Echarts 地图右下角 "南海诸岛" 在项目中有点多余,需要隐藏 2.查询 Echarts 官网配置项,发现修改属性 "geo.regions" ...

  8. ECharts地图显示不完整,只显示南海诸岛问题

    小白今天测试将百度的地图导入到项目中,但是只显示南海诸岛--就像这样~~ 度娘找了很多解决方案,最后发现原因是eharts3 不再内置地图文件,因此需要我们手动引入官网的js或者json文件(http ...

  9. Echarts 南海诸岛简图显示位置调整

        最近需要echart同时显示海南岛和南海诸岛,开始想寻找南海诸岛的数据,经过查找,这种简图数据是没有的(china.js地图数据一一找过了),下图是echarts的一些示例,没有满足我们的要求 ...

  10. 关于echarts中,南海诸岛不显示的问题

    最近vue项目需求,需要制作一个大区的中国地图,在使用 node_modules\echarts\lib\coord\geo\fix\nanhai.js 在判断中加入自己地图的名字就行. if (ma ...

最新文章

  1. 使用.NET中的Action及Func泛型委托
  2. 看清上市公司的财务分析
  3. Appium移动自动化测试(三)--安装Android模拟器(转)
  4. 产品经理读:李善友《产品型社群-互联网思维的本质》
  5. SpringBoot+MyBatisPlus整合时提示:Invalid bound statement(not found):**.dao.UserDao.queryById
  6. zabbix NFS挂载 监控模板
  7. react 原生html 插件,纯原生JS的瀑布流插件Macy.js,前端必备插件
  8. CSS2-3常见的demo列子总结
  9. 微软为.NET程序员带来了最优的跨平台开发体验-WSL
  10. ios 编译openssl支持arm64(转)
  11. java+tableseg,多种功能集成,带Refresh刷新的tableV,Seg分段控件
  12. 很囧的实验:一辆奥迪究竟值多少女大学生? 阅读 3056 回复 12 [回复] [编辑] [修改]...
  13. mysql联合索引原理
  14. 是程序员的都得知道为啥1024是程序员节
  15. LUP分解求解线性方程组及求逆矩阵 java
  16. 2021-03-03 TEM波、TE波、TM波
  17. 微信会员卡与CRM打通
  18. WPS word编辑图表数据的正确姿态
  19. java8的sorted,Java8排序stream.sorted()
  20. 网络摄像机·监控摄像机 镜头驱动芯片 MS41909

热门文章

  1. 向android模拟器中复制文件报out of memory错误解决
  2. 最新合成类游戏APP源码,带安装教程
  3. 普元工作流EOS Workflow 学习笔记
  4. 2020-04-17-E-prime常见问题汇总
  5. 移动微技(Mobile Widget)应用开发权威指南
  6. Java编程练习题3
  7. Tesseract OCR iOS 教程
  8. java list 包含字符串_Java8实战:查找列表中包含的字符串
  9. 开源纯C#工控网关+组态软件
  10. winrar软件如何测试