Get started with leaflet-dvf CDN

// Include required libraries
L.Icon.makeDefault();
L.map('mapid').setView([51.505, -0.09], 13);
L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
  attribution: '&copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors'
}).addTo(map);

// Include leaflet-dvf library
L.plugin(
  'leaflet-draw',
  'https://cdn.cdnhub.io/leaflet-dvf/0.3.1/leaflet-dvf.min.js',
  {
    draw: {
      position: 'topright',
      edit: {
        featureGroup: null
      }
    }
  }
);

// Initialize drawing tools
const drawControl = new L.Control.Draw({
  position: 'topright',
  draw: {
    polygon: false,
    rectangle: false,
    circle: false,
    marker: true,
    polyline: false
  }
});

// Add drawing tools to the map
map.addControl(drawControl);

// Save drawn features to a GeoJSON layer
const features = new L.FeatureGroup();
map.addLayer(features);

drawControl.on('draw:created', function(event) {
  const layer = event.layer;
  features.addLayer(layer);
});