首页 前端知识 中国-省-市三级地图及世界地图在线编辑可视化工具上线

中国-省-市三级地图及世界地图在线编辑可视化工具上线

2024-07-20 17:07:49 前端知识 前端哥 431 534 我要收藏

站点介绍

这是一个完全独立的站点,定位为一个数据分析可视化工具集合,每个子页面对应一个工具,目前主要上线了中国地图和世界地图可视化编辑工具。且听我一一道来。

在这里插入图片描述
站点地址:

中国地图

世界地图

中国地图

这是一个中国、省(直辖市)、地级市(区)三级联动地图,可钻入钻出,可以选择全国地图、任意省份地图、任意地级市等层次地图进行编辑可视化。下面详细阐述下工作流程。

第一步,选择地图。比如我想选择宇宙中心曹县的菏泽市地图编辑。

首先,选择地区 Tab,在中国地图上点击山东省。

在这里插入图片描述

进入山东省地图,点击菏泽市地图。

在这里插入图片描述

进入菏泽地图,地图选择就完成了,你应该看到曹县了。

在这里插入图片描述

可以点击地图左边中间的返回上一级,返回山东地图。你也可以点击曹县等县区直接返回中国地图。

第二步,点击 编辑地图 Tab,这个 Tab 只能编辑地图,地图不能点击钻入钻出。

在这里插入图片描述

在这个设置界面,你可以

在正上方设置地图背景;

在左方 json 编辑器在线编辑地图数据源,在右下方编辑标题、副标题,编辑后 Ctrl + Enter 生效;

在右上方设置地图图例颜色范围、悬浮图元颜色、标题颜色等。

比如我想把宇宙中心曹县的 value 调到 1000,地图立刻变成下面这样。

在这里插入图片描述

编辑后记得 Ctrl + Enter 保存,实时生效,其他设置类似,不一一演示。

世界地图

在这里插入图片描述

由于其他国家的地图数据太难收集,世界地图不能钻入钻出选择。只能是世界概览地图。

编辑设置和中国地图一样,不赘述。值得注意的是它可以点击多选,比如上图我点击了中国、俄罗斯和哈萨克斯坦。

今天的分享就到这,点击阅读原文直达,有使用或者需求问题可以在站点的留言板留言哦~

罗斯和哈萨克斯坦。

今天的分享就到这,点击阅读原文直达,有使用或者需求问题可以在站点的留言板留言哦~

在这里插入图片描述

转载请注明出处或者链接地址:https://www.qianduange.cn//article/14057.html
标签
评论
发布的文章

HTML5 移动开发秘籍(一)

2024-08-05 23:08:12

【HTML5系列教程】

2024-08-05 23:08:12

HTML5面试题

2024-08-05 23:08:06

JQuery基础---01

2024-08-05 23:08:34

大家推荐的文章
会员中心 联系我 留言建议 回顶部
复制成功!