Question

我是leaflet.js和CartoDB的新手。我已经能够显示leaflet.draw编辑工具栏，但无法设置配置选项。此JSFiddle显示尝试设置选项以及定义可编辑图层，请参阅以下代码：

var options = {
    position: 'topright',
    draw: {
        polyline: false,
        polygon: false,
        circle: false, 
        rectangle: false,
        marker: {
            icon: new MyCustomMarker()
        }
    },
    edit: {
        featureGroup: layerUrl, //REQUIRED!!
        remove: false
    }
};

我想知道我是否将此代码放在正确的函数中？

Answer 1

您正在创建一个选项对象，而不是在任何地方使用它。如果要为Leaflet Draw使用自定义选项，则需要单独实例化控件，以便可以向其添加选项对象。接下来，您引用editableLayers作为保存绘制对象的图层，但您不是在任何地方创建实际图层。请按照以下步骤操作：

首先从地图选项中取出drawnControl: true：

map = new L.Map('cartodb-map', { 
    center: [40,-98],
    zoom: 4,
})

创建一个在绘图选项中使用的实际图层并将其添加到地图中：

var editableLayers = new L.FeatureGroup();

现在因为editableLayers上面的行保存了对实际图层的引用，并且不会在控制台中抛出Uncaught ReferenceError: editableLayers is not defined：

var options = {
    position: 'topright',
    draw: {
        polyline: false,
        polygon: false,
        circle: false, 
        rectangle: false,
        marker: {
            icon: new MyCustomMarker()
        }
    },
    edit: {
        featureGroup: editableLayers, //REQUIRED!!
        remove: false
    }
};

现在单独使用您的选项创建绘图控件并将其添加到地图中：

var drawControl = new L.Control.Draw(options).addTo(map);

这是你小提琴的工作分叉：http://jsfiddle.net/ryntc3vv/

所有人都说，我真的很想知道你在做什么/试图做的事情。它没有任何意义，所以如果你在某个地方遵循某种教程我会说出来并坚持在Leaflet Draw存储库中提供Leaflet绘制的文档：https://github.com/Leaflet/Leaflet.draw#adding-the-edit-toolbar所有的事情我在这里和你在上一个问题中所做的完全覆盖了。

使用leaflet.draw编辑CartoDB数据

1 个答案: