Question

我正在使用Leaflet实现地图，并且已经加载了一些Carto和tile图层而没有问题。我需要绘制一些路径，我开始使用插件leaflet.draw，但看不到这些路径。我知道它们在那里，因为按下编辑按钮，我可以编辑它，因为显示了顶点的矩形，但是没有显示路径。

此外，当我画一条线或多边形时，leaflet.draw创建的线总是虚线。

我正在使用Webpack，Leaflet v1.3.4和leaflet.draw v1.0.4。

那是代码：

let drawnItems = new L.FeatureGroup();
drawnItems.addTo(map);

let drawControl = new L.Control.Draw({
    draw: {
        circlemarker: false,
        rectangle: false,
        circle: false,
        marker: true,
        polyline: {
            shapeOptions: {
                color: '#f357a1',
                weight: 10,
            },
            showLength: true,
        },
        polygon: {
            allowIntersection: false,
            drawError: {
                color: '#e1e100',
                message: '<strong>Oh snap!<strong> you can\'t draw that!'
           },
            shapeOptions: {
                color: '#bada55'
            },
        },
    },
    edit: {
        featureGroup: drawnItems,
        remove: true
    }
});

map.on("draw:created", (e) => {
   drawnItems.addLayer(e.layer);
}

我可以看到g HTML上呈现的map SVG元素：

<path class="leaflet-interactive" stroke="#97009c" stroke-opacity="0.5" stroke-width="4" stroke-linecap="round" stroke-linejoin="round" fill="#97009c" fill-opacity="0.2" fill-rule="evenodd" d="M477 112L859 258L556 256L350 141z"></path>

我已经在JSFiddle上使用两个库的相同版本测试了示例，并且可以正常工作。我已经在不加载tile和Carto底图的情况下测试了相同的代码，但是都无法正常工作。 ES6语法可能会与Leaflet不兼容吗？

Leaflet FeatureGroup图层未与leaflet.draw插件一起显示

0 个答案: