Use an SVG for a marker in Google Maps?

Question

i know it\'s possible to add svg overlays to google maps. i\'m wondering if you can use svg files as markers. i tried setting it just like you would a png or jpg file, but nothi

Answer 1

As some mentioned above, scaledSize is the property that makes the magic happens:

  window.userimage = {
    url: '/img/user.svg',
    scaledSize: new google.maps.Size(64, 64),
    origin: new google.maps.Point(0, 0),
    anchor: new google.maps.Point(0, 0)
  };


  window.usermarker = new google.maps.Marker({
    map: minimap,
    animation: google.maps.Animation.DROP,
    anchorPoint: new google.maps.Point(0, -29),
    icon: userimage,
  });

Result: