JS中带有传单的地理位置

Posted 2023-02-23

技术标签:

【中文标题】JS中带有传单的地理位置【英文标题】：Geo-location with leaflet in JS 【发布时间】：2016-07-17 17:32:36 【问题描述】：

以下 JS 脚本（包括 CSS/html 以确保完整性）旨在打开传单地图图块并标记用户位置。打开地图时，它不会标记用户位置。为什么不呢？

<!DOCTYPE html>

<html>

    <head>

        <title>Leaflet GeoLocation</title>

        <link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet-0.7.3/leaflet.css" />

        <script src="http://cdn.leafletjs.com/leaflet-0.7.3/leaflet.js"></script>

        <style>
            body 
                padding: 0;
                margin: 0;
            
            html, body, #map 
                height: 100%;
            
        </style>

    </head>

    <body>

        <div id="map"></div>

        <script>

            var map = L.map('map').setView([43, -79], 18);

            L.tileLayer('http://s.tile.openstreetmap.org/z/x/y.png', 
                attribution: 'Map data &copy; <a href="http://openstreetmap.org">OpenStreetMap</a> contributors, <a href="http://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>',
                maxZoom: 18
            ).addTo(map);

            var newMarker = new L.marker(e.latlng).addTo(map);

        </script>

    </body>

</html>

【问题讨论】：

【参考方案1】：

您不会尝试在此代码中的任何位置获取用户位置。这一行：

var newMarker = new L.marker(e.latlng).addTo(map);

e 未在您提供的代码中定义。所以你需要给它一个纬度/经度值。

【讨论】：

谢谢。以下更正并修复它。函数 onLocationFound(e) var radius = e.accuracy / 2; L.marker(e.latlng).addTo(map) .bindPopup("你在" + 半径 + " 米内").openPopup(); L.circle(e.latlng, radius).addTo(map); function onLocationError(e) alert(e.message); map.on('locationfound', onLocationFound); map.on('locationerror', onLocationError); map.locate(setView: true, maxZoom: 16);

以上是关于JS中带有传单的地理位置的主要内容，如果未能解决你的问题，请参考以下文章

多个圆圈上的传单地理围栏......检测内部/外部标记