JavaScript 无法识别经度地理坐标

Question

我主要是一名 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)

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

Answer 1

您需要使用最新的传单版本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>

JavaScript 无法识别经度地理坐标

JavaScript not recognizing longitude geocoordinates

javascript

geocoding

leaflet