问题：

做一个按钮，点击后可以获取到当前位置的经纬度，并渲染地图。

效果如下:

在这里插入图片描述

代码如下:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
    <title>获取当前定位测试</title>
    <script type="text/javascript" src="//api.map.baidu.com/api?v=2.0&ak=2EWGBqHFvYho6e3BGr5yaHTbS0SC86XI"></script>//需要有自己的自己的百度ｋｅｙ
    <script type="text/javascript" src="static/js/jquery-2.0.2.js"></script>
</head>

<body>
<div>
    <input type="button" value="获取定位" onclick="getLocation()"/>
    经度：<input type="text" id="jingdu"/>
    维度：<input type="text" id="weidu"/>
</div>
</br>
<div id="mapContainer" style="width: 100%; height: 400px;"></div>
</body>
</html>
<script type="text/javascript">
    function getLocation() {
        // 创建地图实例
        var map = new BMap.Map("mapContainer");

        // 创建定位控件实例
        var geolocation = new BMap.Geolocation();

        // 开启定位控件
        geolocation.enableSDKLocation();

        // 获取当前位置
        geolocation.getCurrentPosition(function(r){
            if(this.getStatus() == BMAP_STATUS_SUCCESS){
                // 获取经纬度信息
                var lng = r.point.lng;
                var lat = r.point.lat;

                $("#jingdu").val(lng);//回填经度
                $("#weidu").val(lat);//回填维度
                // 在地图上标注当前位置
                var marker = new BMap.Marker(r.point);
                map.addOverlay(marker);

                // 居中显示地图，并设置缩放级别
                map.centerAndZoom(r.point, 16);

                // 在信息窗口中显示经纬度信息
                var infoWindow = new BMap.InfoWindow("经度: " + lng + "<br>纬度: " + lat);
                marker.addEventListener("click", function(){
                    this.openInfoWindow(infoWindow);
                });

            }
            else {
                alert("无法获取当前位置信息。");
            }
        },{enableHighAccuracy: true});

    }

</script>
</html>
# 前端
Logo
技术共进，成长同行——讯飞AI开发者社区

技术共进，成长同行——讯飞AI开发者社区

更多推荐

cover

PHP与人工智能：结合案例与可能性探索

avatar 讯飞AI开发者社区
cover

[论文阅读] 人工智能 + 软件工程 | 真实场景下GitHub Copilot生产力之谜：2年数据揭示客观提交无提升，开发者却直呼“好用”

avatar 讯飞AI开发者社区

上下文工程驱动智能体向 通用人工智能

例如在文章开头，我们举的产品经理和工程师之间的那一段对话，一个高质量智能体，不再只是让大模型回答用户的问题，而是通过上下文工程，帮助大模型在回答前获得更加结构化的输入，包括项目状态、需求文档、任务历史、甚至团队氛围，实现大模型更好的理解当前的任务规划、团队过往的沟通隐患、对方的工作状态与担忧、文档/知识库的实时状态等等。这和我们维护我们手机上内存很像，一开始所有应用和历史信息都保留，但当手机出现运

avatar 讯飞AI开发者社区