GeolocationAPI数据没有显示

geolotionAPI经纬度没有显示？有提示是否获取位置信息

img

利用百度地图获取坐标，可以实现

1.引用百度地图相关配置，见我得这篇文章

【博主推荐】html引用百度地图定位闪烁弹框树形(附源码)_xcLeigh的博客-CSDN博客_百度地图 闪烁 文章目录【博主推荐】html引用百度地图定位闪烁弹框树形(附源码)1.完整界面效果查看2.百度地图引用3.坐标定位4.实现两点之间线路闪烁5.范围内显示，范围为移动可见后显示6.坐标点，点击弹框7.动态改变地图层级【博主推荐】html引用百度地图定位闪烁弹框树形(附源码)功能实现1.实现百度地图引用效果；2.实现根据坐标定位；3.实现根据数据状态闪烁坐标点；4.实现两点之间线路闪烁；5.实现当坐标在范围内则闪烁，不在范围内，移动到范围内在闪烁；6.实现点击设备弹出；7.实现动态修改地 https://blog.csdn.net/weixin_43151418/article/details/124839361?spm=1001.2014.3001.5502

2.必须先引用（见上面），实现代码（里面需要填写上面引用得密钥）

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

    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0,user-scalable=no">
        <title>Geolocation</title>
        <style type="text/css">
            html {
                height: 100%
            }

            body {
                height: 100%;
                margin: 0px;
                padding: 0px;
            }

            #container {
                width: 70%;
                height: 100%;
                margin: 20px auto;
            }
        </style>
    </head>

    <body>
        <div id="container"></div>
        <!--加载百度 map api-->
        <script type="text/javascript" src="http://api.map.baidu.com/api?v=3.0&ak=您的密钥"></script>  
    
        <script>
            //检测浏览器是否支持定位API
            if (navigator.geolocation) {
                // getCurrentPosition方法来获取当前位置的坐标值
                navigator.geolocation.getCurrentPosition(function(position) {
                    var latitude = position.coords.latitude; // 纬度
                    var longitude = position.coords.longitude; // 经度
                    console.log("经度：" + longitude + "纬度：" + latitude);
                    // container表示注入哪个容器
                    var map = new BMap.Map("container");
                    // 把经度纬度传给百度
                    var point = new BMap.Point(longitude, latitude);
                    ///初始化地图，设置中心点坐标和地图级别
                    map.centerAndZoom(point, 15);
                    //坐标转换
                    var convertor = new BMap.Convertor();
                    var pointArr = [];
                    pointArr.push(point);
                    convertor.translate(pointArr, 1, 5, translateCallback);
                    //坐标转换完之后的回调函数
                    function translateCallback(data) {
                        if (data.status === 0) {
                            // 创建标注
                            var marker = new BMap.Marker(data.points[0]
                            map.addOverlay(marker);
                            map.setCenter(data.points[0]);
                        }
                    }   
                }, function(error) {
                    console.log(error.code)
                })
            }
        </script>
    </body>
</html>

谷歌浏览器navigator.geolocation的使用，只能使用https协议，普通的http协议是无法执行的
你可以引用百度地图