h5常用定位功能封装

  • h5常用定位功能封装已关闭评论
  • 190 次浏览
  • A+
所属分类:Web前端
摘要

之前很多项目使用地图时技术选型不一样;一会儿使用腾讯地图、一会儿使用高德地图,一会儿使用百度地图;每次使用都去查相关api封装请求很麻烦,于是自己简单封装了一下;

之前很多项目使用地图时技术选型不一样;一会儿使用腾讯地图一会儿使用高德地图一会儿使用百度地图;每次使用都去查相关api封装请求很麻烦,于是自己简单封装了一下;

插件介绍:基于h5浏览器gps定位、百度地图、高德地图、腾讯地图api封装的获取位置信息相关插件,支持高精度定位;选择使用哪个地图传入对应的地图key即可,主要功能有根据ip定位(适用于定位到城市级别)、获取当前位置经纬度(gps、百度、高德、腾讯)、坐标转换、逆地址编码(根据经纬度获取具体位置信息);想实现获取具体高精度位置信息,可先获取高精度的gps坐标,使用逆地址编码方法将坐标转换为对应的位置信息;插件内已使用jsonp解决了请求第三方api接口跨域的问题,无需单独再去配置代理;

 

插件仓库地址:https://gitee.com/ml_plugins/location.git

 

主要功能:

方法 方法描述 入参 必须 入参类型【描述】 备注
getLocationByIp
通过ip获取位置信息
params.type
否     string【可选B/A/T;B 百度地图、A 高德地图、T 腾讯地图(默认)】 入参不传ip会默认根据发来请求的IP进行定位;
测试发现腾讯地图提供的ip定位api最好用,基
本都能定位到区,高德偏差最大,测试时我在
成都被定位到了雅安;注意,若获取失败,检
查对应地图的Referer白名单是否配置,在地
图密匙管理处配置
params.key string【type对应的地图密匙,不传时需在插件文件里配置对应的MAP_KEY】
params.ip string【需要定位的ip地址,不传ip会默认根据发来请求的IP进行定位】
getCurrentLngLat     获取当前位置经纬度     params.type 否  string【可选B/A/T/GPS; B 百度坐标、A 高德坐标、T 腾讯坐标、 GPS 坐标(默认)】  
params.key
string【type对应的地图密匙,不传时需在插件文件里配置对应的MAP_KEY】   
params.enableHighAccuracy 否 
boolean 【是否开启高精度定位(默认true)】
 
params.timeout
number 【GPS定位失败超时时间(默认5000)】  
params.maximumAge
number 【最长有效期,在重复获取地理位置时,此参数指定多久再次获取位置(默认5000)】  
translateCoordinate    GPS坐标转百度、高德、腾讯坐标    longitude string | number【GPS经度】  
latitude string | number【GPS经度】   
type string【可选B/A/T; B 百度地图、A 高德地图、T 腾讯地图(默认)】  
key 否  string【type对应的地图密匙,不传时需在插件文件里配置对应的MAP_KEY】  
inverseGeocoding
逆地址编码(根据经纬度获取位置信息)
params.longitude
string | number 【坐标经度】
 
params.latitude
string | number 【坐标纬度】
 
params.type
string 【可选B/A/T/GPS;  B 百度坐标、A 高德坐标、T 腾讯坐标、 GPS 坐标(默认)】
 
key 否 
对应地图key密匙
 
otherCoordTransfromToBaidu

 
其它坐标转百度地图坐标
 
options.locations
string 【需转换的源坐标,多组坐标以“;”分隔(经度,纬度) 示例:29.575429778924,114.21892734521】  
options.type
number 【源坐标类型:1:GPS; 2:搜狗; 3:火星坐标; 4:墨卡托平面坐标; 5:百度地图采用的经纬度坐标(bd09ll); 6:百度地图采用的墨卡托平面坐标(bd09mc); 7:图吧地图坐标; 8:51地图坐标;】  
options.key
string 【百度地图ak密匙;不传时需在插件文件里配置对应的MAP_KEY】
 
otherCoordTransfromToGaode
其它坐标转高德地图坐标
options.locations

string 【经度和纬度用","分割,经度在前,纬度在后,经纬度小数点后不得超过6位。多个坐标对之间用”|”进行分隔最多支持40对坐标。】  
options.type
number 【源坐标类型:1:GPS 2:mapbar 3:baidu 4:autonavi;】  
options.key
string 【高德地图key密匙;不传时需在插件文件里配置对应的MAP_KEY】  
otherCoordTransfromToTencenter

  

其它坐标转腾讯地图坐标

  

options.locations

string 【经度和纬度用","分割,经度在前,纬度在后,多组的话每组坐标之间使用”;"分隔;最多支持40对坐标。】  
options.type
number 【源坐标类型:1、GPS坐标 2、sogou经纬度 3、baidu经纬度 4、mapbar经纬度 5、[默认]腾讯、google、高德坐标 6、sogou墨卡托】  
options.key
string【腾讯地图key密匙 ;不传时需在插件文件里配置对应的MAP_KEY】