基于腾讯地图API的逆地址解析

最新推荐文章于 2024-04-20 11:17:06 发布

小明同学冲冲冲

最新推荐文章于 2024-04-20 11:17:06 发布

阅读量3.6k

点赞数

文章标签： markdown sql 数据库

本文链接：https://blog.csdn.net/qq_44768616/article/details/121641365

版权

调用腾讯地图API实现逆地址解析

	查看了很多博客，发现很多都没有很好的实现给定经纬度逆地址解析的操作，于是就有了本篇文章，希望对大家有帮助！

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
    <title>Document</title>
</head>

<body>
    <h2>经度：<span></span></h2>
    <h2>纬度：<span></span></h2>
    <h2>位置：<span></span></h2>
    <h2>您附近的位置有：</h2><span></span>
</body>
<script>
    let spans = document.querySelectorAll('span');
    if (navigator.geolocation) {
        navigator.geolocation.getCurrentPosition(onSuccess, onError);
    } else {
        alert("您的浏览器不支持使用HTML 5来获取地理位置服务");
    }
    //定位数据获取成功响应
    function onSuccess(position) {
        let lat = position.coords.latitude;
        let lon = position.coords.longitude;
        spans[0].innerHTML = lat;
        spans[1].innerHTML = lon;
        $.ajax({
            type: 'get',
            url: 'https://apis.map.qq.com/ws/geocoder/v1',
            dataType: 'jsonp',
            data: {
                key: "",//开发密钥,在腾讯地图开发者页面上注册
                // location: "39.903679,116.397743",//位置坐标
                location: lat + ',' + lon,
                get_poi: "1",//是否返回周边POI列表：1.返回；0不返回(默认)
                coord_type: "1",//输入的locations的坐标类型,1 GPS坐标
                output: "jsonp"
            },
            success: function (data, textStatus) {
                console.log(data);
                if (data.status == 0) {
                    spans[2].innerHTML = data.result.formatted_addresses.recommend;
                    for(let i = 0;i<data.result.pois.length;i++){
                        spans[3].innerHTML += data.result.pois[i].title +'<br>';
                    }
                } else {
                    alert("系统错误，请联系管理员！")
                }
            },
            error: function () {
                alert("系统错误，请联系管理员！")
            }
        });
    }
    //定位数据获取失败响应
    function onError(error) {
        switch (error.code) {
            case error.PERMISSION_DENIED:
                alert("您拒绝对获取地理位置的请求");
                break;
            case error.POSITION_UNAVAILABLE:
                alert("位置信息是不可用的");
                break;
            case error.TIMEOUT:
                alert("请求您的地理位置超时");
                break;
            case error.UNKNOWN_ERROR:
                alert("未知错误");
                break;
        }
    }
</script>

</html>

小明同学冲冲冲

关注

0
点赞
踩
4

收藏

觉得还不错? 一键收藏
0
评论
基于腾讯地图API的逆地址解析

调用腾讯地图API实现逆地址解析查看了很多博客，发现很多都没有很好的实现给定经纬度逆地址解析的操作，于是就有了本篇文章，希望对大家有帮助！<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport
复制链接

扫一扫