Leaflet-绘图控件的工具栏不显示

Question

我正在尝试使用VueJS中的Leaflet-draw，在调用它之后

import LeafletDraw from 'leaflet-draw'

但是当我试着用它的时候

    var drawnItems = new L.FeatureGroup();
    map.addLayer(drawnItems);

    var drawControl = new L.Control.Draw({
        edit: {
            featureGroup: drawnItems
        }
    });

    map.addControl(drawControl);

我只有一个部分控件的工具栏

​

​

我是否缺少要包含的CSS文件？

Answer 1

如果有人仍在寻找解决方案，那么在vue组件中，例如Map.vue，您需要添加以下内容：

<script>
import "leaflet-draw/dist/leaflet.draw.css";
.
.
.
</script>

Answer 2

该问题与此https://github.com/Leaflet/Leaflet.draw/issues/617相关

直接在我的组件中导入CSS文件并覆盖CSS属性(使用指向sprite的有效路径；在Vue情况下是静态文件夹)

.leaflet-draw-toolbar a {
    background-image: url('/static/spritesheet.png');
}