您的位置:首页 > 编程语言 > Java开发

JAVA学习笔记_AMAP_拖拽选址及地理信息显示

2017-08-26 16:16 471 查看
JS-API;http://lbs.amap.com/api/javascript-api/summary/

实现效果:



官网申请 key值,项目中引入UI组件库

js部分代码:

//先获取到当前地址
var address =  document.getElementById('address1').value;
AMap.plugin('AMap.Geocoder',function(){
var geocoder = new AMap.Geocoder({

});

// 通过地址得到经纬度
geocoder.getLocation(address,function(status,result){
if(status=='complete' && result.geocodes.length){
console.log(result.geocodes[0].location);
var lng = result.geocodes[0].location.lng;
var lat = result.geocodes[0].location.lat;
console.log(lng + "," +lat);
// 调用拖拽事件
getPositionPicker(lng, lat);
}
});

// 通过经纬度或取到地址
geocoder.getAddress(lnglatXY, function(status, result) {
if (status === 'complete' && result.info === 'OK') {
//获得了有效的地址信息:
//即,result.regeocode.formattedAddress
console.log(result.regeocode.formattedAddress);
}else{
//获取地址失败
}
});

});


function  getPositionPicker(lng, lat){
AMapUI.loadUI(['misc/PositionPicker'], function(PositionPicker) {
console.log(lng + "," +lat+"skdgfkshfsdkfhksdfhkshfirgre");

var map = new AMap.Map('mapdiv', {

center: [lng, lat],//地图中心点
zoom: 16,
scrollWheel: false
})
var positionPicker = new PositionPicker({
mode: 'dragMap',
map: map
});

positionPicker.on('success', function(positionResult) {
document.getElementById('address1').value = positionResult.address;
document.getElementById('address').value = positionResult.address;
document.getElementById('lnglat').innerHTML = positionResult.position;
document.getElementById('address').innerHTML = positionResult.address;
document.getElementById('nearestJunction').innerHTML = positionResult.nearestJunction;
document.getElementById('nearestRoad').innerHTML = positionResult.nearestRoad;
document.getElementById('nearestPOI').innerHTML = positionResult.nearestPOI;
});

positionPicker.on('fail', function(positionResult) {
document.getElementById('lnglat').innerHTML = ' ';
document.getElementById('address').innerHTML = '1111 ';
document.getElementById('nearestJunction').innerHTML = ' ';
document.getElementById('nearestRoad').innerHTML = ' ';
document.getElementById('nearestPOI').innerHTML = ' ';
});

var onModeChange = function(e) {
positionPicker.setMode(e.target.value)
}
var startButton = document.getElementById('start');
var stopButton = document.getElementById('stop');
var dragMapMode = document.getElementsByName('mode')[0];
var dragMarkerMode = document.getElementsByName('mode')[1];
AMap.event.addDomListener(startButton, 'click', function() {
positionPicker.start(map.getBounds().getSouthWest())
})
AMap.event.addDomListener(stopButton, 'click', function() {
positionPicker.stop();
})
AMap.event.addDomListener(dragMapMode, 'change', onModeChange)
AMap.event.addDomListener(dragMarkerMode, 'change', onModeChange);
positionPicker.start();
map.panBy(0, 1);

map.addControl(new AMap.ToolBar({
liteStyle: true
}))
});

};
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息