Marker icon not refreshes on change

[altercode]

Hi,

I have map with markers. When I dynamically change marker icon this change is not reflected on the map. How can I refresh/rerender the map to apply new icon image?

Thats how I change marker object:

Event.$on('update-marker-data', (data) => {
this.markers[data.index] = data.marker
      });

And thats what my data.marker object structure looks like:

{
              title: 'New point',
              description: '',
              marker: {
                url: '/marker2.png',
                scaledSize: new google.maps.Size(50, 50), // scaled size
                origin: new google.maps.Point(0,0), // origin
                anchor: new google.maps.Point(25,40) // anchor
              },
              position: {
                lat: lat,
                lng: lng,
              },
            }

When I inspect in Vue Dev Tools new url is applied but on the map there is still old icon image visible.

Thanks in advance for any help!

[altercode]

@xkjyeah can you help me with this?

[exzib]

did you ever solve this?

[cuongdevjs]

you try make data is reactive to re-render map

[eregnier]

Hey all,

You may use my component to use custom components, that makes it simple to have reactive and dynamic markers : https://github.com/eregnier/vue2-gmap-custom-marker

[patrickdalla]

I have similar problem. I call setIcon, but the map does not refreshes immediatelly. When I zoom in/out or pan a distance enough to hide the update marker an show him again, so the correct icon is displayed. But for me it occurs only when lot of markers are shown, +10K. In a test with 3K markers, the problem does not occur.