Only Last Objects Moves slideTo

[ZacksBot]

Hello!

I've built an rest API which contains scooter. In the object scooters there is a column called inUse.

I've built a JavaScript function that that fetches the data and loops through all the objects and checks if inUse is equal to true, if so do this.

I noticed that there is an issue with slideTo, because slideTo only applies to the last objects in the database which is not what I want. I want only those who have inUse === True to move.

  function onUpdateMap() {
    fetch("http://localhost:3000/v1/scooters")
      .then((response) => {
        return response.json();
      })
      .then((data) => {
        for (const scooter of data.data) {
          if (scooter.inUse === true) {
            marker.slideTo(scooter.destination, {
              duration: scooter.velocity,
            });
          }
        }
      });
  }

keep in mind here that inUse === True; is green and only the greens are supposed to move based on the code above, but somehow only the last object is moving as seen on the demostration bellow. https://i.gyazo.com/8ac0f184a47ebab62cfe5d22428fd9be.mp4

Here is the image of the object that is moving:

Here is the image of the actual object that I want to move:

[hugobarragon]

Hello, I checked your code, and i think you have it wrong right there on the marker,

 marker.slideTo(scooter.destination, {
              duration: scooter.velocity,
            });

How do you know the marker you are moving its the correct one? i am almost sure you are not storing loaded markers id on the map, and you are moving always the last one

Please make a reproducible link on code sandbox use this example
https://codesandbox.io/s/static-bcdhq?fontsize=14

[ZacksBot]

Hello, I checked your code, and i think you have it wrong right there on the marker,

 marker.slideTo(scooter.destination, {
              duration: scooter.velocity,
            });

How do you know the marker you are moving its the correct one? i am almost sure you are not storing loaded markers id on the map, and you are moving always the last one

Please make a reproducible link on code sandbox use this example https://codesandbox.io/s/static-bcdhq?fontsize=14

I noticed where my issue is. it's on another function that I use to print every single scooter. as Such. As you might see on the loop I loop through every single object and assign the marker to a new scooter.location.lat and scooter.location.long

 function getScooters() {
    fetch("http://localhost:3000/v1/scooters")
      .then((response) => {
        return response.json();
      })
      .then((data) => {
        for (const scooter of data.data) {
          // Create a marker for each scooter
          if (scooter.inUse) {
            IconChoice = IconMarkerGreen;
            ScooterArray.push(scooter._id);
          } else {
            IconChoice = IconMarkerWhite;
          }
          marker = new DriftMarker(
            [scooter.location.lat, scooter.location.long],
            {
              icon: IconChoice,
              title: scooter.name,
            }
          ).addTo(mapInstance);
        }
      });
  }