[Vuejs]-How to change the nuxt gmap marker icon size?

0👍

Assuming your GMapMarker component handle your actual icon image rendering, you can manipulate it like so:

var icon = {
    url: "../res/sit_marron.png", // url
    scaledSize: new google.maps.Size(50, 50), // scaled size
    origin: new google.maps.Point(0,0), // origin
    anchor: new google.maps.Point(0, 0) // anchor
};

<GMapMarker :icon="icon"></GMapMarker>

then inside your GMapMarker component, you can render it like so:

// grab icon from the props and use it as needed:

var marker = new google.maps.Marker({
    position: new google.maps.LatLng(lat, lng),
    map: map,
    icon: icon
});

More info here in official docs – https://developers.google.com/maps/documentation/javascript/examples/icon-complex#maps_icon_complex-javascript

Leave a comment