使用mapshaper将echart地图合并,并取消内部边界

原文地址:blog.csdn.net/qq_19816325...

问题

echart地图区域合并,并不出现内部边界,按照之前的经验,每个区域都有自己的json数组,如果要调整区域划分,比如把A拆成AB或者把AB合并,只需要调整该区域的经纬度数组即可,但是会有个问题,合并之后会有边框,比如

需要两个网站

1、获取地图json数据,阿里地图选择器datav.aliyun.com/tools/atlas...

2、地图文件编辑mapshaper mapshaper.org/

1. 修改要处理的文件

首先将你要合并的地图文件,添加字段标识,name同级添加,名字自定义比如"area"。

举个栗子,我要将崇明区长兴区 合并成一个新区域叫新区 ,那么就在两个区域下面添加 "area": "新区",

2.将要处理的json上传到mapshaper

点击console打开控制台

输入执行命令生成新json文件并输出

dissolve 'area' -o result.json

dissolve:合并命令

'area':步骤一取得别名

-o:固定

result.json生成的文件,可自定义命名

3.修改最终json

生成完的json文件只有area,并没有name,但是地图里面是根据name展示的

用编辑器将所有的area 替换成name

然后将新的json文件引入即可

相关推荐
@AfeiyuO6 分钟前
Vue3 热力图
vue·echarts
@AfeiyuO4 小时前
Vue3 词云
vue·echarts
猿究院_xyz2 天前
微信小程序与echarts联动安卓真机测试出现黑色阴影
前端·javascript·微信小程序·小程序·echarts
paopaokaka_luck2 天前
基于SpringBoot+Uniapp的自习室预约小程序(腾讯地图API、Echarts图形化分析、二维码识别)
vue.js·spring boot·后端·spring·echarts
玄魂3 天前
如何查看、生成 github 开源项目star 图表
前端·开源·echarts
哟哟耶耶3 天前
css-Echarts图表tooltip / label文本过长 超出屏幕边缘或容器范围
前端·javascript·echarts
weixin_459548905 天前
QT+Echarts初始示例
qt·echarts
毕设源码-钟学长5 天前
【开题答辩全过程】以 公寓出租系统为例,包含答辩的问题和答案
java·eclipse·echarts
凯小默5 天前
37-实现地图配置项(完结)
echarts·vue3
疯笔码良5 天前
Vue + Echarts 实现科技感数据大屏
vue.js·echarts