简体   繁体   English

leaflet.js:未捕获的错误:无效的LatLng对象:(NaN,NaN)

[英]leaflet.js: Uncaught Error: Invalid LatLng object: (NaN, NaN)

I have a json file which takes two coordinates 我有一个需要两个坐标的json文件

"_id" : ObjectId("59407457838b932e0677999e"),
"type" : "MultiPoint",
"name" : "points",
"coordinates" : [
        [
                -73.958,
                40.8003
        ],
        [
                -73.9814,
                40.7681
        ]
]

I'm using Leaflet library to mark the coordinates in Google maps using node js and mongo db. 我正在使用Leaflet库使用node js和mongo db在Google地图中标记坐标。

My map.pug file is 我的map.pug文件是

extends layout.pug

block content
    #map
    script(type='text/javascript').
        var map = L.map('map').setView([#{lat},#{lng}], 14);
        L.tileLayer('http://{s}.tile.osm.org/{z}/{x}/{y}.png', {
            attribution: '&copy; <a href="http://osm.org/copyright">OpenStreetMap</a> contributors'
        }).addTo(map);

        $.getJSON('/maplayers',function(result){
            $.each(result, function(i, mlayer){
                $.getJSON('/mapjson/' + mlayer.name, function(data) { addLayer(data, mlayer.name ) });
            });
        });

        function addLayer(layer, name) {
            var leaf_layer;
            if (layer.type == "MultiPoint") {
                leaf_layer = L.geoJson(layer, { pointToLayer: function (feature, latlng) {return L.circleMarker(latlng, layer.style); }})
                leaf_layer.bindPopup(layer.type);
            } 
            leaf_layer.addTo(map);

            $('#' + name).click(function(e) {

                if (map.hasLayer(leaf_layer)) {
                    map.removeLayer(leaf_layer);
                } else {
                    map.addLayer(leaf_layer);
                }
            });
        }

The values are getting displayed on the maps along with markers in the browser( http://localhost:3000/map ). 这些值将与浏览器中的标记一起显示在地图上( http:// localhost:3000 / map )。

But, if I change my Json file like below with just one coordinate, it is not getting displayed. 但是,如果我仅用一个坐标就象下面那样更改我的Json文件,则不会显示该文件。

"_id" : ObjectId("594061ea838b932e0677999d"),
        "type" : "MultiPoint",
        "name" : "points",
        "coordinates" : [
                -73.958,
                40.8003
        ]

The error in the browser console is 浏览器控制台中的错误是

leaflet.js:6 Uncaught Error: Invalid LatLng object: (NaN, NaN)

Can anyone please explain me how to solve this issue and display in map with one coordinate? 谁能解释一下如何解决此问题并在地图上显示一个坐标?

A GeoJSON MultiPoint geometry type expects coordinates as an array of nested positions . GeoJSON MultiPoint几何类型期望将coordinates作为嵌套位置数组 Each "position" being an array of 2 values, namely [longitude, latitude] . 每个“位置”是2个值的数组,即[longitude, latitude] (Altitude may be third) (海拔可能是第三位)

If you provide just a single position, not nested in a parent array, your geometry is no longer GeoJSON compliant. 如果仅提供一个位置而不是嵌套在父数组中,则您的几何不再符合GeoJSON。

Instead, you should also change the geometry type to Point , which does expect coordinates as a single lng-lat position. 相反,您还应该将几何类型更改为Point ,它确实希望将coordinates作为一个lng-lat位置。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM