前端【地图显示高德】

第一步

引用<script type="text/javascript" src="https://webapi.amap.com/maps?v=2.0&key=你的钥匙&plugin=AMap.Geocoder"></script>

第二步js

//根据经纬度查询
var map = new AMap.Map('allmap', {
center: [coordinateLongitude, coordinateLatitude],//coordinateLongitude表示经度//coordinateLatitude表示纬度
zoom: 18,
resizeEnable: true,
viewMode: '3D',
});
//确定经纬度位置
var marker = new AMap.Marker({
position: new AMap.LngLat(coordinateLongitude, coordinateLatitude),
offset: new AMap.Pixel(-10, -10),
//icon: 'https://webapi.amap.com/theme/v1.3/markers/b/mark_bs.png', // 添加 Icon 图标 URL

//此处new AMap.Icon是一个对象，建议用（{}）所以的对象都需要new出来
icon: new AMap.Icon({
size: new AMap.Size(25, 34),
image: 'https://webapi.amap.com/theme/v1.3/markers/b/mark_bs.png',
// 图标所用图片大小
imageSize: new AMap.Size(20, 30),
})
});
map.add(marker);
var geocoder = new AMap.Geocoder({
//city: '010', //城市设为北京，默认：“全国”
radius: 500 //范围，默认：500
});

function regeoCode(cb) {
geocoder.getAddress(position, function(status, result) {
if (status === 'complete' && result.regeocode) {
if (cb) cb(result.regeocode.formattedAddress);
} else {
log.error('根据经纬度查询地址失败')
}
});

}
regeoCode((res) => {
console.log(res);
})

regeoCode(function(res) {
//构建自定义信息窗体
var infoWindow = new AMap.InfoWindow({
anchor: 'middle-left',
offset: new AMap.Pixel(2, 16),//偏移量
content: res,
});

infoWindow.open(map, position);
});

 总而言之，言而总之多多看官方文档