【问题标题】:Map Box plotting marker in wrong location地图框在错误位置绘制标记
【发布时间】:2016-12-30 04:23:25
【问题描述】:

在下面的屏幕截图中,您可以看到标有 Mother Earth Brewery 的标记,但它应该是 Dogfish Head:

我添加地图框标记的代码是:

var lat;
            var lng;

            var markers = [];
            var markerTemp;

            for (i = 0; i < data.length; i++) {
                lat = parseFloat(data[i].lat);
                lng = parseFloat(data[i].lng);


                if (lat == "" || lng == "") {

                } else {
                    L.marker([lat, lng]).addTo(map).bindPopup(data[i].brewery);
                    markerTemp = L.marker([lat, lng]);
                    markers.push(markerTemp);

                    alert("Brewery: " + data[i].brewery + "Lat: " + lat + "Long: " + lng );

                }
                var group = L.featureGroup(markers);

                map.fitBounds(group.getBounds());


            }

变量数据是下面解析的json:

[{"brewery":"East Coast Beer Company","lat":"40.091779","lng":"-74.049265","breweryID":"0BRjKa"},{"brewery":"Ballast Point Brewing Company","lat":"32.766785","lng":"-117.195246","breweryID":"1d90Lc"},{"brewery":"Fulton Brewing Company","lat":"44.9849423","lng":"-93.2790206","breweryID":"5GoGSi"},{"brewery":"Stone Brewing Co.","lat":"33.115682","lng":"-117.119552","breweryID":"709vEK"},{"brewery":"The Lost Abbey","lat":"33.141417","lng":"-117.150076","breweryID":"9x7wNn"},{"brewery":"Dogfish Head Craft Brewery","lat":"38.770622","lng":"-75.310893","breweryID":"g0jHqt"},{"brewery":"Latitude 33 Brewing Co.","lat":"33.1362843","lng":"-117.2244859","breweryID":"GpPbOw"},{"brewery":"Coronado Brewing Company","lat":"32.6977264","lng":"-117.1731838","breweryID":"gVynTw"},{"brewery":"Iron Fist Brewing Company","lat":"33.145823","lng":"-117.238546","breweryID":"hjb9rn"},{"brewery":"Heritage Brewing","lat":"38.7523173","lng":"-77.4887259","breweryID":"LWv6MU"},{"brewery":"Karl Strauss Brewing Company","lat":"32.832461","lng":"-117.2318045","breweryID":"mtUjck"},{"brewery":"Bagby Beer Company","lat":"33.189225","lng":"-117.374257","breweryID":"Nl2U0R"},{"brewery":"Mother Earth Brew Company","lat":"38.770622","lng":"-75.310893","breweryID":"NwFxny"},{"brewery":"Pizza Port Brewing Company","lat":"33.1596505","lng":"-117.3478111","breweryID":"QSVVxD"},{"brewery":"Burley Oak Craft Brewery","lat":"38.3338561","lng":"-75.2169099","breweryID":"rKXfsB"},{"brewery":"Belching Beaver Brewery","lat":"33.1450383","lng":"-117.2285575","breweryID":"rVzPCl"},{"brewery":"San Marcos Brewery & Grill","lat":"33.134539","lng":"-117.190813","breweryID":"SEibYT"},{"brewery":"Union Craft Brewing Company","lat":"39.331938","lng":"-76.641971","breweryID":"t6Gyij"},{"brewery":"Rinn Duin Brewing","lat":"40.123373","lng":"-74.24754","breweryID":"T90yOZ"},{"brewery":"Victory Brewing Company","lat":"40.0061038","lng":"-75.6941546","breweryID":"VoKbnS"},{"brewery":"Heavy Seas","lat":"39.230827","lng":"-76.6751309","breweryID":"wTFQaf"},{"brewery":"Booze Brothers Brewing Co.","lat":"33.148172","lng":"-117.218047","breweryID":"xaBLno"},{"brewery":"Kane Brewing","lat":"40.2368095","lng":"-74.0442545","breweryID":"XqWTM7"},{"brewery":"AleSmith Brewing Company","lat":"32.892034","lng":"-117.144379","breweryID":"ygAzC9"},{"brewery":"Bay City Brewing","lat":"32.7579949","lng":"-117.2118382","breweryID":"yOH4Du"}]

在代码中你可以看到我添加了这个alert("Brewery: " + data[i].brewery + "Lat: " + lat + "Long: " + lng );

确保正确的值进入

markerTemp = L.marker([lat, lng]);
markers.push(markerTemp);

我通过警报一一验证了正确的数据,并与 JSON 的输出进行了比较。一切看起来都正确,我被卡住了,第二组眼睛将不胜感激。谢谢!

【问题讨论】:

    标签: javascript json mapbox mapbox-marker


    【解决方案1】:

    代码的最后两行应该在 for 循环之外。您打算将所有标记作为一个组添加到地图中,但是您所做的实际上似乎在程序上不正确。

    我注意到将浮点数与字符串进行比较并不是一个好的编程习惯。

    if (lat == "" || lng == "")

    这里我已经相应地修改了代码:

    var lat;
    var lng;
    
    var markers = [];
    var markerTemp;
    
    for (i = 0; i < data.length; i++) {
        lat = parseFloat(data[i].lat);
        lng = parseFloat(data[i].lng);
    
        if (data[i].lat !== "" && data[i].lng !== "") {
            markerTemp = L.marker([lat, lng]).addTo(map).bindPopup(data[i].brewery);
            markers.push(markerTemp);
    
            console.log("Brewery: " + data[i].brewery + "Lat: " + lat + "Long: " + lng );
        }
    }
    var group = L.featureGroup(markers);
    map.fitBounds(group.getBounds());
    

    【讨论】:

    • 谢谢,把它们搬走了。仍然不能解决我在问题中提到的问题。
    • 嗨,迈克,我注意到您在问题顶部提到的两个位置在 JSON 文件中具有完全相同的坐标;因此,看到一个在另一个之上是很正常的。同时,我在代码中发现了另一个错误,并在我的答案中添加了修改后的版本。
    • 感谢代码提示,是的,看到相同的 lat 和 lng 并找出我的错误在我的 sql 中的位置,谢谢!
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2019-06-29
    • 1970-01-01
    • 2014-03-21
    • 2015-01-26
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多