网页中如何用地图定位公司地址

  • 1
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>高德地图定位</title> <style> #container { height: 500px; width: 100%; } </style> </head> <body> <h1>高德地图定位</h1> <div id="container"></div> <script src="https://webapi.amap.com/maps?v=1.4.15&key=your_amap_api_key"></script> <script> // 初始化地图 var map = new AMap.Map('container', { resizeEnable: true }); // 获取当前位置 AMap.plugin('AMap.Geolocation', function() { var geolocation = new AMap.Geolocation({ enableHighAccuracy: true, // 是否使用高精度定位,默认为true timeout: 10000, // 超过10秒后停止定位,默认值:无穷大 buttonPosition: 'RB', // 定位按钮的停靠位置 buttonOffset: new AMap.Pixel(10, 10), // 定位按钮距离右下角的偏移量 zoomToAccuracy: true, // 定位成功后是否自动调整地图视野到定位点 showMarker: true, // 定位成功后是否在定位位置显示一个Marker markerOptions: { // Marker的属性 offset: new AMap.Pixel(-18, -36), icon: "https://webapi.amap.com/theme/v1.3/markers/n/mark_b.png" }, convert: true // GPS坐标转换成高德坐标 }); // 监听定位结果 geolocation.getCurrentPosition(function(status, result) { if (status === 'complete') { onComplete(result); } else { onError(status); } }); // 定位成功的回调函数 function onComplete(result) { var lnglat = result.position; // 获取经纬度信息 var address = result.formattedAddress; // 获取详细地址信息 // 在地图上添加Marker var marker = new AMap.Marker({ position: lnglat, title: address }); map.add(marker); // 将地图视野调整到定位点 map.setZoomAndCenter(14, lnglat); } // 定位失败的回调函数 function onError(status) { alert('定位失败:' + status); } }); </script> </body> </html>
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值