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

Question

我只是拿着传单 fork ，因为将来我可能必须工作。

查看几个网址

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

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

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

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

谢谢

Answer 1

我会做这样的事情:

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);
});

尽管使用 jQuery 可能更好。

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

var positions = [
    {
        lat: 123.45
        lng: 123.45
    },
    {
        lat: 123.45
        lng: 123.45
    }
]

迭代它们并添加标记:

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