enableDraw cause TypeError

[timeroute]

I installed the latest leaflet-geoman version by npm. When map.pm.enableDraw('Line'), It raised typeerror while the mouse over the map. leaflet version: 1.6

error in Firefox:

TypeError: r is undefinedleaflet-geoman.min.js:1
    _calcLayerDistances leaflet-geoman.min.js:1
    _calcClosestLayer leaflet-geoman.min.js:1
    forEach self-hosted:235
    _calcClosestLayer leaflet-geoman.min.js:1
    _handleSnapping leaflet-geoman.min.js:1
    _syncHintMarker leaflet-geoman.min.js:1
    fire leaflet-src.js:593
    _fireDOMEvent leaflet-src.js:4452
    _handleDOMEvent leaflet-src.js:4409
    handler leaflet-src.js:2679

error in Chrome:

Uncaught TypeError: Cannot read property '0' of undefined
    at NewClass._calcLayerDistances (leaflet-geoman.min.js:1)
    at leaflet-geoman.min.js:1
    at Array.forEach (<anonymous>)
    at NewClass._calcClosestLayer (leaflet-geoman.min.js:1)
    at NewClass._handleSnapping (leaflet-geoman.min.js:1)
    at NewClass._syncHintMarker (leaflet-geoman.min.js:1)
    at NewClass.fire (leaflet-src.js:593)
    at NewClass._fireDOMEvent (leaflet-src.js:4452)
    at NewClass._handleDOMEvent (leaflet-src.js:4409)
    at HTMLDivElement.handler (leaflet-src.js:2679)

[codeofsumit]

I can't reproduce the error. Can you please create a JSfiddle, showing the problem?

[FeldonDragon]

I have the same problem - as soon as i click on "draw polygon" button and hover on map i get bunch of errors of the same content: "Cannot read property '0' of undefined at NewClass._calcLayerDistances (leaflet-geoman.min.js:1)" Do I need initialize anything before using "toolbox"?

[FeldonDragon]

I do not have working JSfiddle, but if it changes something for you i cut some useless code for this problem and paste rest to JSfiddle. If you would like, please take a look: https://jsfiddle.net/hpbnruc2/4/

[FeldonDragon]

I'm just thinking... Is this error can appears because of using OpenStreetMaps instead of MapBox?

[codeofsumit]

I wasn't able to check the error yet but I'm pretty sure your Tilelayer should not have an influence on Leaflet-Geoman. But I will check your error once I find the time - thanks for the reproduction link!

[FeldonDragon]

Ok, thank you for reply - Waiting for solution ;)

[selenecodes]

I'm having the same problem, holding alt seems to resolve it since it's an issue in the snapping mixin. The provided variable "closestSegment" is undefined which makes the [0] give a property/index error.

Lines in code where the issue lies: https://github.com/geoman-io/leaflet-geoman/blob/41810b57bec8e60f66b3191e68f084555e55b804/src/js/Mixins/Snapping.js#L368-L373

[selenecodes]

Found out the issue, it was due to a polygon not having any coordinates attached to it a simple if around the L.polygon() function to check that the coordinates actually exist and that the array has a length makes everything work flawlessly.

[Falke-Design]

@selenecodes it would be very helpful when you create a demo page or a gif, so we can see how to reproduce this error

[selenecodes]

Unfortunately I can't add a gif of it due to it being a customer's internal website.

The problem however isn't in this repo, it occurs when you add a feature to the map that doesn't have coordinates, causing the closestSegment in your code to break due to there not being any coordinates to read from.

The fix people should apply to their code

coordinates = [] 
if (coordinates.length) { // <- add this if statement to make sure that the polygon only gets created if there are actually coordinates to draw.
    new L.polygon(coordinates)
}