Изменение полилинии Leaflet и координат многоугольника портит геометрию во время повторного рендеринга - PullRequest
0 голосов
/ 04 октября 2019

Мое приложение позволяет пользователям рисовать полилинии и полигоны с помощью плагина Leaflet.draw и сохраняет геометрию в виде файлов .json на сервере. После загрузки фигур с сервера пользователи должны иметь возможность их редактировать. Любые изменения должны автоматически сохраняться на сервере после перезагрузки сеанса.

Я использовал событие map.on ('draw: editvertex'), чтобы обновить геометрию фигур в их объектах json. Затем они сохраняются в хранилище сеансов и отправляются на сервер.

map.on('draw:editvertex', function (e) 
{   
    let newLatLng = [];
    let layers = e.layers._layers;

    for (let i in layers)
    {
        let lat = layers[i]._latlng.lat;
        let lng = layers[i]._latlng.lng;
        newLatLng.push([lng, lat]);
    }

    jsonObj.Project.Result[key].Layers[e.poly.id].
         features[0].geometry.coordinates = newLatLng;
    sessionStorage.jsonObj = JSON.stringify(jsonObj);

}

Когда пользователи перезагружают веб-страницу, сделанные изменения становятся видимыми. Однако геометрия, представленная из координат, выглядит совершенно иначе, чем моды. Например, многоугольник с измененной геометрией будет перерисован как многоугольник с отверстиями. Модифицированная ломаная линия выглядела бы как линии, нарисованные повсюду в случайных местах.

Я посмотрел на геойсон и заметил, что геометрия имеет больше координатных точек после изменений. Я мог видеть, что это происходит и во время редактирования, когда перетаскивание вершины будет генерировать дополнительные вершины по краям.

Я подозреваю, что сгенерированные дополнительные вершины являются причиной того, что перерисованные геометрии неверны. Как мне отредактировать фигуру с помощью Leaflet.draw, чтобы не было новых вершин?

...