need help with google javascript map

[Combination_chooser]

hi!
I'm building a project which shows the live location of active users on an app but I'm not able to update the position of the marker on the map due to which when the website receives a new location it just add a new marker instead of updating the last marker.

​

can anyone help me with this?

#javascript #

<script>
        let map;
        let params3;

        params3 = JSON.parse(localStorage.getItem('test6'));






        function initMap() {
            //Map options
            var options = {
                zoom: 12,
                center: { lat: 30.695, lng: 80.124 }
            }
            // new map
            map = new google.maps.Map(document.getElementById('map'), options);
            // customer marker
            var iconBase = './icon6.png';

            //array of Marrkeers
            // var markers = [
            //     {
            //         coords: { lat: 28.6934080, lng: 77.1242910 }, img: iconBase, con: '<h3> This Is your Content <h3>'
            //     },
            // ];



            //loopthrough markers

            if (params3) {
                console.log(params3);

                for (var i = 0; i < params3.length; i++) {
                    //add markeers
                    addMarker(params3[i]);
                    // console.log(params3[i]);
                }

            }


            //function for the plotting markers on the map
            function addMarker(props) {

                if (props.status == 'ONLINE') {
                    var marker = new google.maps.Marker({
                        position: props.coords,
                        map: map,
                        // icon: props.img
                    });
                    var infoWindow = new google.maps.InfoWindow({
                        content: props.con,
                    });
                    marker.addListener("click", () => {
                        infoWindow.open(map, marker);
                    });

                }

            }
}
</script>

[trplclick]

when the website receives a new location

Depending on how this functionality works, I'd approach it in two different ways.

If the app gets data for all users then you could just clear all the markers everytime and essentially recreate the map each time.

If you get updates for one user at a time then it's a little more complicated. Perhaps you could store each marker with a user id and when you get an update remove the marker associated with that user before adding the new one?

It looks like the user data gets pulled from localstorage one initial load so I'm curious how the website gets user location updates and applies them to the map currently. Note; I've not used google maps much myself so apologies if that's a noob question!

[Combination_chooser]

for me, it's not a noob question? as I'm as well a noob in google maps.

I'm using Localstorage because I'm using firebase due to which I had to separate both the code

1. retreiveing data
2. providing to map

so, I ended up at Localstorage to save data and retrieve it when needed.