I am using Leaflet draw for adding Draw toolbar to my leaflet map. I am using angular leaflet directive to add the map. I want certain elements of the draw toolbar to be removed, specifically (line and circle). I have tried using this statement in my code but does not works
polyline:false
. How should i go about it? Here is my code
JS
angular.extend($scope, {
center: {
lat: 51.505,
lng: 10.09,
zoom: 3
},
controls: {
scale:true,
draw: {}
},
layers: {
baselayers: {
mapbox_light: {
name: 'Mapbox Streets',
url: 'https://api.mapbox.com/styles/v1/mapbox/streets-v10/tiles/256/{z}/{x}/{y}?access_token=pk.eyJ1IjoicmVoYW5zNTE2IiwiYSI6ImNpeWxjcWNkODAwNGwzM3FxamR6a2gxOXkifQ.PuUfs90MyfmVGYVqx0AoUw',
type: 'xyz',
layerOptions: {
apikey: 'pk.eyJ1IjoicmVoYW5zNTE2IiwiYSI6ImNpeWxjcWNkODAwNGwzM3FxamR6a2gxOXkifQ.PuUfs90MyfmVGYVqx0AoUw',
mapid: 'mapbox.streets',
format: '@2x.png'
},
layerParams: {
showOnSelector: false
}
}
},
overlays: {
draw: {
name: 'draw',
type: 'group',
visible: true,
layerParams: {
showOnSelector: false
}
}
}
}
});
leafletData.getMap().then(function(map) {
leafletData.getLayers().then(function(baselayers) {
var drawnItems = baselayers.overlays.draw;
map.on('draw:created', function (e) {
var layer = e.layer;
drawnItems.addLayer(layer);
console.log(JSON.stringify(layer.toGeoJSON()));
coordinates_selected = layer.toGeoJSON();
});
});
});
HTML
<leaflet lf-center="center" controls="controls" layers="layers" geojson="geojson" width="540" height="400"></leaflet>