高德地图点击获取经纬度
<div id="container" style=" height:600px; width:100%; text-align: center;"></div>
<script src="https://webapi.amap.com/maps?v=1.4.15&key=你的高德key&plugin=AMap.PlaceSearch,AMap.AdvancedInfoWindow"></script>
var positions = [[116.397428, 39.90923]]; var map = new AMap.Map("container", { resizeEnable: true, center: positions[0], zoom: 13 }); var marker = new AMap.Marker({ position: map.getCenter(), icon: '//a.amap.com/jsapi_demos/static/demo-center/icons/poi-marker-default.png', offset: new AMap.Pixel(-13, -30), // 设置是否可以拖拽 draggable: false, cursor: 'move', // 设置拖拽效果 raiseOnDrag: true }); marker.setMap(map); var clickHandler = function(e) { marker.setMap(null); marker = new AMap.Marker({ position: e.lnglat, icon: '//a.amap.com/jsapi_demos/static/demo-center/icons/poi-marker-default.png', offset: new AMap.Pixel(-13, -30), // 设置是否可以拖拽 draggable: false, cursor: 'move', // 设置拖拽效果 raiseOnDrag: true }); marker.setMap(map); $('input[name=longitude]').val(e.lnglat.lng); $('input[name=latitude]').val(e.lnglat.lat); }; map.on('click', clickHandler);
效果:
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 分享一个免费、快速、无限量使用的满血 DeepSeek R1 模型,支持深度思考和联网搜索!
· 基于 Docker 搭建 FRP 内网穿透开源项目(很简单哒)
· ollama系列01:轻松3步本地部署deepseek,普通电脑可用
· 25岁的心里话
· 按钮权限的设计及实现