百度地图和openlayers融合封装(想法)

(openalers地图简称o地图，百度地图简称b地图，wmap地图简称w地图)

openlayers逻辑关系： omap -> olayer -> ofeature
baidu逻辑关系: bmap -> bfeature

wmap（融合地图）, 要考虑对不同类别的feature的控制，所以wmap的逻辑关系： wmap -> wlayer -> wfeature

区别：
o地图的map层控制layer的增删改查，用layer层来控制feature的增删改查。

b地图没有layer层，直接用map层控制feature的增删改查。

融合解决办法1：
从模块化的角度来说，feature无需、也不应该有getlayer或者getmap这类方法，feature只需要关注自己内部的东西，feature并不知道自己被加入到哪个layer或者哪个map中了，feature实例应该既能加入到layer1中，也应该能加入到layer2中，feature应该有复用性（个人理解）。从这个逻辑上来讲，是无法融合两个地图的，因为你需要抽象出layer层，在layer层中实现feature的增删改查，而layer根本无法获取他到底在哪个map中。所以从可复用的角度来讲，无法实现 map -> layer -> feature的。

但是（果然有个但是

）,在百度api中，它的overlay（也就是feature)是有getmap存在的(很难理解),那么，这个feature如果在两个不同的map中使用，这个getmap返回的到底是哪个地图？

var point = new BMap.Point(120, 30);var marker = new BMap.Marker(point);

var map1 = new BMap.Map("container1");var map2 = new BMap.Map("container2");

map1.addOverlay(marker);map2.addOverlay(marker);

运行上面的代码，你会发现，只在map2中出现了marker（marker的getmap也就应该是map2了）。

所以，layer以及feature是不能复用的，如果从对象的角度来讲，是可以理解的，毕竟marker在内存中是一个地址，如果在地图1中修改marker，那么map2中的marker也会受到影响，毕竟两个marker指向同一个地址，这样百度feature中的getmap就非常合理了。

既然可以从feature中获取map，那么我们在layer也可以获取map，这样在抽象出来的layer层统一进行feature的增删改查，就可以通过getmap来进行处理了。所以问题变为了，如何给layer实例注入mpa对象，这就需要我们在map.addLayer（layerInstance）的时候 layerInstance.map注入进去。

tips:

feature不需要注入map，百度在addoverlay的时候就自动注入了。

feature可以注入layer，在layer.addFeature(featureInstance)的时候，featureInstance.layer = layer即可。

2018-4-26 遇到的问题，openalyers的 map，layer，feature之间没有getmap,getlayer的注入关系。

1：如果wlayer不注入wmap的话，就无法在wlayer层加入wfeature。
2：如果在layer层注入map，那么业务层必须遵循如下顺序： map.addLayer，然后layer.addFeature。否则，feature加载不到地图上。（即map把feature的增删改查控制权交给layer）。

暂时采用第二种方式。

百度地图和openlayers融合封装(想法)相关推荐

瓦片地图之百度地图（openlayers）
瓦片地图加载的关键在于找对瓦片,但要找对瓦片,就得知道瓦片的坐标,而坐标又需要明确的坐标系.我们在坐标里说过,任何坐标都得有坐标系才有意义.在OpenLayers 3中,默认使用的瓦片地图的坐标系是如 ...
高德地图和百度地图接口封装遇到的问题（三）：参数集中插入参数以及引用未定义参数
1.向参数集中插入新参数: 由于要将高德地图和百度地图提供的方法封装成一个统一的方法,而对于某些功能来说可能传进来的参数个数不一样,比如下面的绘制折线功能: //高德地图// 折线的节点坐标数组,每个 ...
ant-design vue input通过那个事件可以获得输入框变化的值_VUE使用百度地图教程
VUE使用百度地图教程简介:传统的百度地图如果搭建在vuecli中就还需要再index.html的文件还需要配置script参数,这样使用起来就像是穿了一件不合身的衣服,总是难受,而且vue也不推荐 ...
基于uni-app与百度地图API实现简易前后端分离的地理围栏应用
一.引言地理围栏(Geo-fencing)是LBS 的一种新应用,就是用一个虚拟的栅栏围出一个虚拟地理边界.当手机进入.离开某个特定地理区域,或在该区域内活动时,后台可以感知到这一变化,同时手机可以 ...
百度地图采集经纬度坐标数据定位的javascript实战开发(地理坐标拾取系统、地址定位点选插件、实时定位、数据导入、地理编码、位置纠偏)
坐标采集前言 1.百度地图地理坐标拾取系统 2.位置选择插件百度地图经纬度选择插件默认参数配置 3.数据导入 4.地理编码爬取百度webAPI 返回参数前端封装转换函数 5.手机GPS定位 ...
Qt开发北斗定位系统融合百度地图API及Qt程序打包发布
Qt开发北斗定位系统融合百度地图API及Qt程序打包发布 1.上位机介绍最近有个接了一个小型项目,内容很简单,就是解析北斗GPS的串口数据然后输出经纬度,但接过来觉得太简单,就发挥了主观能动性,增加 ...
高德地图和百度地图接口封装遇到的问题（二）：绘制带有方向箭头的折线
临时接到一个小任务,要封装一个绘制带有方向箭头的折线的功能接口,就下面这种样式: 百度地图给的示例是这样的: var sy = new BMap.Symbol(BMap_Symbol_SHAPE_BA ...
OpenLayers 3 之加载百度地图
虽然百度地图有自己的 JavaScript API,但是有时候,一个项目已经用 OpenLayers 做了很多功能,不可能弃之不用,同时,又想使用百度地图,该怎么办呢?所以很多人想使用 OpenLay ...
openlayers 3扩展，调用百度地图、高德地图、天地图服务
调用这三个商业地图服务,我们使用的都是切片(Tile)地图服务,关于切片地图的含义这里做简单的介绍: 切片地图就是指将显示的地图切成一块一块的(256 * 256)分别显示加载.openlayers ...
openlayers加载百度地图作为底图坐标偏移的解决办法
openlayers加载天地图作为底图,在网上找了公开的服务资源,要做到百度地图与天地图之间切换,同样也从网上找到百度地图的服务资源但是在地图上坐标总是有偏差,最初的代码是这样的: var proje ...

百度地图和openlayers融合封装(想法)

百度地图和openlayers融合封装(想法)相关推荐

最新文章

热门文章