superMap之标绘

superMap之标绘

superMap样例中有一个标绘demo：

https://iclient.supermap.io/examples/leaflet/editor.html#drawAndModify

原理： leaflet.draw组件

　　　　详细api：https://www.npmjs.com/package/leaflet-draw

代码：

    addDraw()
    var editableLayers
    function addDraw() {
        editableLayers = new L.FeatureGroup();
        map.addLayer(editableLayers);
        var options = {
            position: 'topleft',
            draw: {
                polyline: {},
                polygon: false, // 设为false可关闭面绘制工具
                circle: {},
                rectangle: {},
                marker: {},
                remove: {}
            },
            edit: {
                featureGroup: editableLayers,
                remove: true
            }
        };
        var drawControl = new L.Control.Draw(options);
        map.addControl(drawControl);
        map.on(L.Draw.Event.CREATED, function (e) {
            var layer = e.layer;
            editableLayers.addLayer(layer);
        });
    }

获取标绘的features：

function getFeat() {
        console.log(editableLayers)
        console.log(editableLayers.getLayers())
    }

注意：使用时需要引入leaflet.draw组件，否则会报错：L.Control.Draw is not a...

　　引入：

    <script type="text/javascript" include="leaflet.draw" src="../../dist/leaflet/include-leaflet.js"></script>

 

 

 

钻研不易，转载请注明出处......