高德地图和百度地图接口封装遇到的问题（三）：参数集中插入参数以及引用未定义参数

最新推荐文章于 2024-07-31 09:10:47 发布

wml00000

最新推荐文章于 2024-07-31 09:10:47 发布

阅读量3.3k

点赞数

分类专栏：地图接口封装问题

本文链接：https://blog.csdn.net/wml00000/article/details/81874925

版权

地图接口封装问题专栏收录该内容

4 篇文章 1 订阅

订阅专栏

1.向参数集中插入新参数：

由于要将高德地图和百度地图提供的方法封装成一个统一的方法，而对于某些功能来说可能传进来的参数个数不一样，比如下面的绘制折线功能：

//高德地图

// 折线的节点坐标数组，每个元素为 AMap.LngLat 对象
var path = [
    new AMap.LngLat(116.368904,39.913423),
    new AMap.LngLat(116.382122,39.901176),
    new AMap.LngLat(116.387271,39.912501),
    new AMap.LngLat(116.398258,39.904600)
];

// 创建折线实例
var polyline = new AMap.Polyline({
    path: path,  
    borderWeight: 2, // 线条宽度，默认为 1
    strokeColor: 'red', // 线条颜色
    lineJoin: 'round' // 折线拐点连接处样式
});

// 将折线添加至地图实例
map.add(polyline);

//百度地图

// 创建polyline对象
var pois = [
	new BMap.Point(116.350658,39.938285),
	new BMap.Point(116.386446,39.939281),
	new BMap.Point(116.389034,39.913828),
	new BMap.Point(116.442501,39.914603)
];
var polyline =new BMap.Polyline(pois, {
   enableEditing: false,//是否启用线编辑，默认为false
   strokeWeight:'8',//折线的宽度，以像素为单位
   strokeOpacity: 0.8,//折线的透明度，取值范围0 - 1
   strokeColor:"#18a45b" //折线颜色
});

map.addOverlay(polyline);          //增加折线

可以看出高德地图需要传入一个包含点数组的参数集，百度地图需要擦传入点数组和一个参数集。如果要统一的话，可以直接将点数组和参数集暴露出来，newPolyline(pointsArr,options){ }

对于百度来说就直接在方法里面:return new BMap.Polyline(pointsArr,options);

而对于高德来说就需要先把点数组传进options中：options["path"]=pointsArr; //这个就是向参数集中加入参数

return new AMap.Polyline(pointsArr,options);

2.参数集中引用一个未定义的参数

 function test() {
        let options={
            enable:1,
            a:true
        }
        let poi=options.b;
        
    }
直接调用test函数不会报错，通过console.log(options.b);输出为undefined