Doesn't work with L.LatLng objects

[divadsn]

Haven't tested with "real" latlngs, but this example gives me just headache and will not work whatever I tried to do:

const layers = {}

// create new motion marker
layers.player = L.motionMarker(
    [unproject(session.location)],
    {
        animate: true,
        duration: 1000,
        followMarker: true,
        hideMarker: false,
        rotateMarker: true,
        rotateAngle: session.location.rot,
        icon: L.divIcon({
            iconSize: [16, 16],
            className: 'bg-transparent',
            html: '<div><img src="./static/icons/icon_2.png" style="width: 16px; height: 16px; transform: translate(0, -4px);"></div>'
        })
    },
).addTo(map);

// set view to player
map.setView(layers.player.getLatLng(), 5);

Error:

Tried to solve myself the bug, but I cannot get much from that error and gave up :/

[dekguh]

why you call L.motionMarker? Have you read the documentation for use? Below is an example of correct use

const instance = L.moveMarker(
  [[prevLatLng], [nextLatLng]],
  polylineOptions,
  markerOptions,
  featureGroupOtions
)

dont call L.motionMarker or L.motionLine, call L.moveMarker, see demo https://codesandbox.io/s/l-movemarker-basic-usage-fkdvty

[divadsn]

I only am interested into the moving marker, not the polyline. Same error is being thrown when used with moveMarker

[divadsn]

layers.player = L.moveMarker(
    [unproject(session.location)],
    {
        hidePolylines: true,
    },
    {
        animate: true,
        duration: 1000,
        followMarker: true,
        hideMarker: false,
        rotateMarker: true,
        rotateAngle: session.location.rot,
        icon: L.divIcon({
            iconSize: [16, 16],
            className: 'bg-transparent',
            html: '<div><img src="./static/icons/icon_2.png" style="width: 16px; height: 16px; transform: translate(0, -4px);"></div>'
        })
    }
).addTo(map);

[dekguh]

I think L.moveMarker has no problem, check your input latlng again, is it a valid latlng with type float/number? I see the error is NaN (NOT A NUMBER) check on unproject(session.location) and rc.unproject[0, 0]

[divadsn]

These are all valid latlng objects:

>> rc.unproject([0, 0]);
<< Object { lat: 85.0511287798066, lng: -180 }
>> unproject(session.location);
<< Object { lat: 63.3411357508071, lng: -78.4836894946219 }

[dekguh]

you are using the wrong format for this plugin, it should look like [lat, lng] like [85.0511287798066, -180], please see basic demo for how to use

[divadsn]

Perhaps add support for the proper format, Leaflet uses L.Latlng objects in any form while accepting [lat, lng] as well.

It is also how Leaflet returns any latlng related data in their built-in functions:

>> map.getCenter()
<< Object { lat: 63.3411357508071, lng: -78.4836894946219 }

Also, see docs: https://leafletjs.com/reference.html#latlng