leaflet简单例子，绘制多边形

var crs = L.CRS.EPSG900913;
    var map = L.map('map', {
        crs: crs,
        width: '100%',
        height: '100%',
        maxZoom: 17,
        editable: true,
        renderer: new L.SVG()
    }).setView([34, 108.5], 4);

    var options = {
        minNativeZoom: 14,
        minZoom: 2,
        maxZoom: 18
    };

    var google_sat = L.layerGroup([
        L.tileLayer.fallback(Configures.map_services+'/tile/google_sat/{z}/{x}/{y}', options),
        L.tileLayer.fallback(Configures.map_services+'/tile/google_name/{z}/{x}/{y}', options)
    ]);
    var osm_MapQuestOpen = L.tileLayer.fallback(Configures.map_services+'/tile/osm_MapQuestOpen/{z}/{x}/{y}', options);
    L.control.layers({'谷歌影像': google_sat,'osm_MapQuestOpen': osm_MapQuestOpen}).addTo(map);
    map.addLayer(google_sat);

    var drawnItems = new L.FeatureGroup();
    map.addLayer(drawnItems);
    L.drawLocal.draw.toolbar.buttons.polygon = '绘制区域';
    var drawControl = new L.Control.Draw(
        {
            position: 'topleft',
            draw:{
                polyline:false ,
                polygon: true,
                circle: false,
                rectangle:false,
                marker: false
            },
            edit: {
                featureGroup: drawnItems,
                edit:false,
                remove: false
            }
        });
    map.addControl(drawControl);
    L.drawLocal.draw=
    {
        handlers: {
            polygon: {
                tooltip: {
                    start: '鼠标点击绘制多边形',
                    cont: '单击继续绘制',
                    end: '单击起始点或双击完成编辑'
                }
            }
        }
    };
    map.on('draw:created', function(event) {
        //var type = event.layerType;
        var layer = event.layer;
        alert(JSON.stringify(layer.toGeoJSON()));
    });

View Code

 

转载于:https://www.cnblogs.com/Micang/p/6346486.html