function MapUtil() {
var map = null;
var geolocation = null;
var geocoder = null;
var inputId = null;
}
/**
* 创建或者获取
*/
MapUtil.prototype.m = function (containerId) {
if (this.map == null) {
this.map = new AMap.Map(containerId, {
resizeEnable: true,
zoom: 17,//地图显示的缩放级别
keyboardEnable: false
});
}
return this.map;
}
/**
* 绑定输入提示的input标签
*/
MapUtil.prototype.bindSearchInput = function (inputId) {
if (this.map == null) {
return false;
}
this.inputId = inputId;
AMap.plugin(['AMap.Autocomplete','AMap.PlaceSearch'],() => {
var autoOptions = {
input: inputId//使用联想输入的input的id
};
autocomplete= new AMap.Autocomplete(autoOptions);
var placeSearch = new AMap.PlaceSearch({
city:'',
map:this.map
})
AMap.event.addListener(autocomplete, "select", (e) => {
//TODO 针对选中的poi实现自己的功能
var lat = e.poi.location.lat;
var lng = e.poi.location.lng;
this.markPoint(lng, lat);
});
});
}
/**
* 设置地图标记,并重新指定地图中心
*/
MapUtil.prototype.markPoint = function (lat, lng, isCenter) {
if (this.map == null) {
return false;
}
//清除之前的Marker
this.map.clearMap();
var icon = new AMap.Icon({
image : './locate-needle.png',//24px*24px
//icon可缺省,缺省时为默认的蓝色水滴图标,
imageSize : new AMap.Size(15,30)
});
// 设置缩放级别和中心点
if (isCenter || isCenter === undefined) {
this.map.setCenter([lat, lng]);
}
var marker = new AMap.Marker({
map: this.map,
position: [lat, lng],
icon: icon
});
}
/**
* 绑定鼠标点击事件,获取点击的经纬度并且Mark
*/
MapUtil.prototype.bindClickEvent = function () {
if (this.map == null) {
return false;
}
return this.map.on('click', (e) => {
var lat = e.lnglat.getLat();
var lng = e.lnglat.getLng();
this.markPoint(lng, lat, false);
return this.address(e.lnglat);
})
}
/**
* 定位到当前所在位置,浏览器定位会出现定位不准确问题
*/
MapUtil.prototype.locate = function() {
if (this.map == null) {
return false;
}
return this.map.plugin('AMap.Geolocation', () => {
if (this.geolocation == null) {
this.geolocation = new AMap.Geolocation({
enableHighAccuracy: true,//是否使用高精度定位,默认:true
timeout: 10000, //超过10秒后停止定位,默认:无穷大
buttonOffset: new AMap.Pixel(10, 20),//定位按钮与设置的停靠位置的偏移量,默认:Pixel(10, 20)
zoomToAccuracy: true, //定位成功后调整地图视野范围使定位位置及精度范围视野内可见,默认:false
buttonPosition:'RB'
});
}
this.map.addControl(this.geolocation);
this.geolocation.getCurrentPosition();
//返回定位信息
AMap.event.addListener(this.geolocation, 'complete', (data) => {
this.markPoint(data.position.getLng(), data.position.getLat())
return this.address(data.position);
});
//返回定位出错信息
AMap.event.addListener(this.geolocation, 'error', function(data) {
console.log("定位失败");
return false;
});
});
}
/**
* 根据经纬度获取地址
*/
MapUtil.prototype.address = function(lnglat) {
if (!lnglat) {
return false;
}
if (this.geocoder == null) {
AMap.plugin('AMap.Geocoder',() => {
this.geocoder = new AMap.Geocoder({});
});
}
return this.geocoder.getAddress(lnglat, (status, result) => {
if (status == 'complete') {
//如果有绑定input标签,那么设置input标签的内容
var address = result.regeocode.formattedAddress;
if (this.inputId != null) {
document.getElementById(this.inputId).value = address;
}
return address;
} else {
return false;
}
})
}
JS的高德API封装
最新推荐文章于 2024-07-16 16:09:32 发布