javascript - 如何在使用 Leaflet.Draw 绘制多边形时更改第一个顶点的颜色？

Question

我正在使用 Leaflet 和 Leaflet.Draw，我让用户通过我的代码绘制多边形(不使用 Leaflet Draw Controls)。

当用户绘制多边形时，我需要更改其第一个顶点的颜色，例如:绿色，以便用户知道他需要单击第一个点以关闭多边形并完成绘制。

如何在使用 Leaflet.Draw 绘制多边形时更改第一个顶点的颜色？

下图为详细说明，表示已用画图软件修复。

P.S. Here is my code

var map = L.map('mapid',
            {
                minZoom: -1,
                maxZoom: 4,
                center: [0, 0],
                zoom: 1,
                crs: L.CRS.Simple
                });

var polygonDrawer = new L.Draw.Polygon(map);

map.on('draw:created', function (e) {
var type = e.layerType, layer = e.layer;
 layer.editing.enable();
  layer.addTo(map);

  });

$(document)ready(function(){
polygonDrawer.enable();
});

Answer 1

当我使用 Leaflet.Draw 和创建多边形时，我想出了以下代码:

    map.on('draw:drawvertex',
        function (e) {
            $(".leaflet-marker-icon.leaflet-div-icon.leaflet-editing-icon.leaflet-touch-icon.leaflet-zoom-animated.leaflet-interactive:first").css({ 'background-color': 'green' });
        });

因此，有一个监听器，您可以将其插入代码 draw:drawvertex，这意味着无论何时创建顶点，我都需要做一些事情。

然后，使用 jQuery 从这个长选择器中选择第一个元素，并将其背景颜色设置为绿色或任何其他颜色。