問(wèn)題描述

我有一個(gè)很接近的代碼，但我不確定，因?yàn)槲沂堑谝淮问褂?Leaflet js.

i got a one code which is close but i am not sure because i am first time working with Leaflet js.

我的意圖是:假設(shè) Leaflet js 正在顯示地圖或非地理數(shù)據(jù)，并且我有一個(gè) Leaflet js 相關(guān)的工具欄.工具欄有許多標(biāo)記，如圓形、多邊形、方形等.當(dāng)用戶單擊工具欄上的任何標(biāo)記開(kāi)始在地圖上繪制時(shí)，當(dāng)標(biāo)記的繪制完成時(shí)，我怎么知道?

my intention is: suppose Leaflet js is showing map or non geographical data and i have one Leaflet js related toolbar. toolbar has many marker like circle, poly, square etc. when user click on any marker on toolbar to start drawing on map then when drawing of marker will be finish then how do i know?

我如何附加一個(gè)函數(shù)，該函數(shù)將作為繪圖完成的回調(diào)，并且該函數(shù)還讓我知道標(biāo)記的 Lat 和 lng.如果我知道 Lat 和 lng，那么我可以保存在 db 中，然后我們可以重復(fù)使用它來(lái)繪制形狀.

how could i attach a function which will work as callback for drawing finish and the function also let me know the Lat and lng of marker. if i know the Lat and lng then i can save in db and later we can reuse it to draw the shape.

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
    }

    // saving lat and lng to db by ajax call
    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);
});

請(qǐng)看一下代碼，我不確定它是否能解決我的目的，因?yàn)檫@里的代碼適用于帶有地圖的點(diǎn)擊事件.

please have a look at the code and i am not sure does it solve my purpose because here the code work with click event with map.

所以當(dāng)我們點(diǎn)擊地圖時(shí)，標(biāo)記繪制就完成了.所以請(qǐng)閱讀我的帖子并了解我在尋找什么，并建議我最好地了解如何實(shí)現(xiàn)它.謝謝

so when we click on map then marker drawing would be complete. so please read my post and understand what i am looking for and suggest me with best idea how to achieve it. thanks

推薦答案

取決于您使用什么來(lái)繪制多邊形/形狀.如果您使用的是 leaflet.draw，您可以執(zhí)行以下操作:

Depends on what you're using to draw polygons/shapes. If you're using leaflet.draw, you would do something like:

map.on('draw:created', function(e) {
    var points = JSON.stringify(e.layer.toGeoJSON());
});

然后將點(diǎn)保存到您的數(shù)據(jù)庫(kù)中.

And then saving points to your database.

閱讀leaflet.draw 文檔，它非常完整和簡(jiǎn)單.

Read the leaflet.draw documentation, it's pretty complete and straightforward.

這篇關(guān)于Leaflet js:如何在地圖上繪制任何標(biāo)記結(jié)束時(shí)獲取 Lat 和 lng的文章就介紹到這了，希望我們推薦的答案對(duì)大家有所幫助，也希望大家多多支持html5模板網(wǎng)！