JavaScript 无法识别经度地理坐标答案

【问题标题】：JavaScript not recognizing longitude geocoordinatesJavaScript 无法识别经度地理坐标
【发布时间】：2021-08-14 19:59:24
【问题描述】：

我主要是一名 python 开发人员，但我正在为一个大学项目尝试使用 JavaScript 和 HTML。我正在使用 Leaflet 创建地图，目前正在尝试使用坐标向地图添加一些节点，然后向它们添加边。但由于某种原因，它无法识别经度。这是我的代码和错误：

HTML

<!DOCTYPE html>
<html lang="en">
    <head>
        <link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet/v0.7.7/leaflet.css" /> 
        <link rel="stylesheet" href="css/style.css">
    </head>
    <body style="border:0; margin:0">
        <div id="mapid"></div>

        <div class="formBlock">
            <form id="form">
                <input type="text" name="start" class="input", id="start", placeholder="Choose starting point" />
                <input type="text" name="end" class="input", id="destination", placeholder="Choose Destination" />
                <button type="submit">Get Directions</button>
            </form>
        </div>
        <script src="http://cdn.leafletjs.com/leaflet/v0.7.7/leaflet.js"></script>
        <script src="https://www.mapquestapi.com/sdk/leaflet/v2.2/mq-map.js?key=endTO6iFLU2paIdnoCnXHLCSYQX6ajFj"></script>
        <script src="https://www.mapquestapi.com/sdk/leaflet/v2.2/mq-routing.js?key=endTO6iFLU2paIdnoCnXHLCSYQX6ajFj"></script>
        <script src="/css/app.js"></script>
    </body>
</html>

2.JavaScript

var mymap = L.map('mapid').setView([-22.899346, -43.413119], 13);


L.tileLayer('https://api.mapbox.com/styles/v1/{id}/tiles/{z}/{x}/{y}?access_token={accessToken}', {
    attribution: 'Map data &copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors, Imagery © <a href="https://www.mapbox.com/">Mapbox</a>',
    maxZoom: 18,
    id: 'mapbox/streets-v11',
    tileSize: 512,
    zoomOffset: -1,
    accessToken: 'pk.eyJ1IjoidmljdG9yYm9tYmFyZGEiLCJhIjoiY2twNWgzZTdsMXhpcTJ2dGF6bjN6MXc5YiJ9.ZMzO1j4VVEjsLbf3MXnQWw'
    }).addTo(mymap);

    

var circle = L.circle([-22.9809493, -43.2068586], {
    color: 'red',
    fillColor: '#f03',
    fillOpacity: 0.5,
    radius: 500
}).addTo(mymap);

错误（来自浏览器控制台）：

>> Uncaught Error: invalid LatLng object (-22.9809493, NaN)

我迷路了，急切地寻求帮助。

【问题讨论】：

我只是在猜测：也许radius 也是度数，所以它覆盖了地球几次？尝试使用较小的（如 1），看看会发生什么。
我目前处于 afk 中，但我会尽快尝试。知道为什么 NaN 会出现吗？我在另一个多边形创建上尝试过，没有半径，同样的问题。

标签： javascript leaflet geocoding

【解决方案1】：

您需要使用最新的 Leaflet 版本1.7.1:

<link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet/v1.7.1/leaflet.css" /> 
<script src="http://cdn.leafletjs.com/leaflet/v1.7.1/leaflet.js"></script>

【讨论】：

是的，确实是这个问题，非常感谢！