Leaflet:如何在数据库中保存各种标记位置并稍后加载

Tho*_*mas 3 javascript leaflet

我只是拿着传单,因为将来我可能要工作。

看到几个网址

http://justinmanley.github.io/Leaflet.Illustrate/examples/0.0.2/simple/ http://leaflet.github.io/Leaflet.toolbar/examples/control.html#

如果有人访问该网址,则必须意识到用户可以在地图上放置标记或在地图上放置正方形或圆形。所以我的问题是,当我显示该地图时,如何将这些标记位置保存在数据库中,然后如果我知道它们的位置并保存到数据库中,我可以将这些标记再次放置在数据库中的地图上。

如果我需要在数据库中保存各种标记位置,那么 SQL Server 的表结构将是什么样子。

请讨论我的两点或将我重定向到帮助我实现这一目标的相关文章。

谢谢

Eih*_*waz 5

我会做这样的事情:

var map = L.map('mapcanvas').setView([51.505, -0.09], 13);

map.on('click', function(e){
    // Place marker
    var marker = new L.marker(e.latlng).addTo(map);

    // Ajax query to save the values:
    var data = {
        lat: e.latlng.lat,
        lng: e.latlng.lng
    }

    var request = new XMLHttpRequest();
        request.open('POST', '/my/url', true);
        request.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded; charset=UTF-8');
        request.send(data);
});
Run Code Online (Sandbox Code Playgroud)

尽管使用 jQuery 可能更好。

然后,您可以从数据库中获取保存的值,将它们存储在 js 对象中,例如

var positions = [
    {
        lat: 123.45
        lng: 123.45
    },
    {
        lat: 123.45
        lng: 123.45
    }
]
Run Code Online (Sandbox Code Playgroud)

迭代它们并添加标记:

for (var i in positions) {
    new L.marker([positions[i].lat, positions[i].lng]).addTo(map);
}
Run Code Online (Sandbox Code Playgroud)