Creating an animated line between markers

[LinneaMid]

So I'm trying to create an animated line with react-mapbox-gl between the markers on a map to show how the journey of a pen. Right now i have two set markers but in the future the code should create markers with coordinates coming from a database. This is my code at the moment and I hope that I can get some help or tips since theres no to little documentation regarding how to implement this animated line with this npm and react in Mapbox.

` import ReactMapboxGl, { Layer, Feature, ScaleControl, ZoomControl, RotationControl } from "react-mapbox-gl"; import React from "react";

const Map = ReactMapboxGl({ accessToken: 'my token here'

class Maps extends React.Component {

render() { const coordinate=[18.063240, 59.334591]; return ( <Map center={coordinate} zoom={[2]}

style="mapbox://styles/mapbox/streets-v9"
 containerStyle={
    {
   
    height: '80vh',
    width: '80vw'
    }

}

    {/* Controls*/}
    <ScaleControl/>
    <ZoomControl/> 
    <RotationControl style={{top:80}}/>

<Layer
type="symbol" id="marker" layout={ { 'icon-image': 'circle-15'} }> <Feature coordinates={[29.371532589441756,40.896189603433761]} /> <Feature coordinates={coordinate} />

)

} }

export default Maps ` Thankful for all help I can get!

[zilurrane]

Looking for solution on same problem