WebGIS中自定义互联网地图局部注记的一种方案

简介: 文章版权由作者李晓晖和博客园共有,若转载请于明显处标明出处:http://www.cnblogs.com/naaoveGIS/1.    前言实际项目中我们经常会遇到这样一种场景:地图底图可能是互联网地图(百度、高德、天地图)等等,同时我们自己又有某个区域单独的一套POI数据,我们需要将互联网地图中这个区域的原有POI数据进行遮罩然后只显示我们自己的POI数据。

文章版权由作者李晓晖和博客园共有,若转载请于明显处标明出处:http://www.cnblogs.com/naaoveGIS/

1.    前言

实际项目中我们经常会遇到这样一种场景:地图底图可能是互联网地图(百度、高德、天地图)等等,同时我们自己又有某个区域单独的一套POI数据,我们需要将互联网地图中这个区域的原有POI数据进行遮罩然后只显示我们自己的POI数据。

针对这样的需求,我们首先想到的是能否我们只使用不包含注记的底图瓦片,然后再叠加上我们的POI数据。事实上,实际需求中还需要考虑一点,我们只有部分区域的POI数据,却没有其他区域的POI数据。

所以这个需求真正的核心是:除这个不规则多边形的指定区域外,地图均是互联网地图加互联网注记,而这个核心区域内需要是互联网地图加上自己的注记。

2.    方案思路

a.整个地图范围中,仍然将互联网底图和互联网注记图作为底图叠加。

b.再次叠加上该区域的互联网底图,可以视作遮罩将该范围中的注记图层屏蔽。

c.将纠偏后的自定义POI图层切图,作为最上层图层叠加至地图中。

地图图层顺序如下所示:

                     

3.待解决的难点

a.瓦片拼接技术:需要将下载好的指定区域瓦片拼接成一个整体,然后将该区域PS出来。

b.图片分割技术:需要将PS后的区域图按照瓦片大小分割。

c.瓦片重命名:需要将分割后的瓦片重新按照对应行列号赋值。

4.实现

具体代码实现过程由我的好基友涂涂涂不苦实现,感谢,继续努力。

4.1瓦片下载

利用自开发的瓦片下载工具将指定区域的互联网底图下载下来,其原理可以参考我之前的博客:WebGIS中通过行列号来换算出多种瓦片的URL 之在线地图(http://www.cnblogs.com/naaoveGIS/p/3905523.html)。

                 

4.2瓦片拼接并PS

4.2.1拼接原理

按照行列号将同一级别上的瓦片拼接成一整张图。

 

4.2.2使用PS将拼接好的整图进行抠图

这里要注意,每个级别的图均需要分别拼接成一个对应级别的整图,PS也需要对每个级别的整图进行抠图。

                        

4.3图片分割并赋值行列号

a.读取原始拼接瓦片文件夹,依次获取到原始瓦片的行列号名称。

b.将抠图后的整图按照瓦片规定大小进行分割。

c.将分割出的图赋予原始瓦片行列号的名称。

5.效果展示

          

                                                                   

                               

                                                                     -----欢迎转载,但保留版权,请于明显处标明出处:http://www.cnblogs.com/naaoveGIS/

                                                                           如果您觉得本文确实帮助了您,可以微信扫一扫,进行小额的打赏和鼓励,谢谢 ^_^

                                                                                                                         

 

目录
相关文章
|
22天前
|
数据可视化 搜索推荐 定位技术
三维地图万能子组件玩法全流程!拓展业务表达边界(附免费试用)
为了满足用户日益增长的个性化和定制化需求,我们推出了地图✖️万能子组件,支持自定义拼接地图组件内容,包括图表、标题等,打造超级信息面板。该组件可灵活展示地理信息业务数据,丰富可视化形式。此外,提供7天高级版免费试用、个人免费版永久使用等福利,并附有详细教程视频,帮助用户轻松配置和优化组件效果。
|
2月前
|
安全
高级色彩从哪来? 如何运用到自己的海报设计中
色彩是一种神秘的语言。一张色彩丰富的照片,有的吸引你的目光,有的唤起某种特定的情绪或情感。
33 0
|
8月前
|
前端开发 JavaScript 数据挖掘
浅谈游戏地图中位置实时更新的技术方案
浅谈游戏地图中位置实时更新的技术方案
154 1
|
数据采集 运维 NoSQL
数据地图?地图数据?傻傻分不清楚!
数据地图?地图数据?傻傻分不清楚!
|
定位技术
无须任何数据,六十秒快速制作三维影像图用以作为城市空间格局分析的底图
无须任何数据,六十秒快速制作三维影像图用以作为城市空间格局分析的底图
133 0
|
JSON 定位技术 数据格式
基于GEE的制作全球任意地方时间序列数据动画的方法
基于GEE的制作全球任意地方时间序列数据动画的方法
209 0
全区域治理-功能提取(简易版初稿)
全区域治理-功能提取(简易版初稿)
124 0
全区域治理-功能提取(简易版初稿)
|
算法 前端开发 Java
地图建筑群的光影效果原理和应用实践
高德开放平台在2020年初推出了AMap JSAPI 2.0版本,现在版本已经稳定下来。在JSAPI 2.0版本中我们采用了新的渲染管线,在每个渲染流程中都针对性的进行了性能优化。
419 0
地图建筑群的光影效果原理和应用实践
|
物联网
ThingJS有4种技术实现对象拾取方式
对象的拾取,这是3D技术的一个专业术语。
ThingJS有4种技术实现对象拾取方式
|
定位技术 前端开发 API
WebGIS简单实现一个区域炫酷的3D立体地图效果
1.别人的效果         作为一个GIS专业的,做一个高大上的GIS系统一直是我的梦想,虽然至今为止还没有做出一个理想中的系统,但是偶尔看看别人做的,学习下别人的技术还是很有必要的。眼睛是最容易误导我们的,有时候看着炫酷的效果,可能只是因为一点视觉误差,本文用一个别人的系统界面来解析如何实现一个小区域的立体地图效果。
3651 0