[GIS] leaflet.draw error adding control

leafletleaflet-draw

I'm facing problems with this plugin. I can not even add a toolbar. This is what I'm doing:

In index.html file I'm using this lines:

<script src="https://unpkg.com/leaflet@1.0.2/dist/leaflet.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/leaflet.draw/0.4.2/leaflet.draw.js"></script>

After, in the script file I'm using these lines to add the controls:

var drawnItems = new L.FeatureGroup(suc,crs);
map.addLayer(drawnItems);
var drawControl = new L.Control.Draw({
         edit: {
             featureGroup: drawnItems
         }
     });
     map.addControl(drawControl);

And I get this error:

TypeError: L.Control.Draw is not a constructor
http://xxxx.com/xxxxx/js/map.js Line 34

I've been searching in forums, the docs, and in several related pages but I haven't found any clue about what's happening.

If you need more information about it, just tell and I would be pleased to add it.

Best Answer

your feedback has been so useful. The problem it was simple,

I thought that the script line in the index.html file

<script src="https://cdnjs.cloudflare.com/ajax/libs/leaflet.draw/0.4.2/leaflet.draw.js"></script>

Should to be positioned inside the body tag, like my leaflet script, but it must be placed in the head tag. Once the change has been applied evertything worked fine. Thanks a lot for your quick and useful feedback. The comment of IvanSanchez has been specially useful.

Many thanks to everyone.