javascript - Dynamically setting a linear gradient to a Google Maps SVG path icon -
i using custom icon google maps marker. want apply styling marker; in particular linear gradient. xyz code below works when run normal simple html document, when try run in javascript, doesn't work.
var xyz = 'data:image/svg+xml;utf-8, \ <svg width="30" height="60" xmlns="http://www.w3.org/2000/svg"> \ <defs><lineargradient id="mygx"> \ <stop offset="5%" stop-color="yellow"/> \ <stop offset="95%" stop-color="red"/> \ </lineargradient></defs> \ <path fill="url(#mygx)" stroke="black" stroke-width="1.5" d="m0 0 l0 35 l15 60 l30 35 l30 0 l0 0z"></path> \ </svg>'; var myicon = { url: xyz, fillopacity: 0.7, scale: 1 }; var marker = new google.maps.marker({ position: markerlocation, icon: myicon, map: map, title: 'hello' }); any solution welcome.
got it. google maps didn't # in url. works:
<path fill="url(\u0023mygx)"... the \u0023 unicode (i think) #.
Comments
Post a Comment