svg icon for pushpin with css style RRS feed

  • Question

  • Is it possible to apply styles for svg icon?
    I want blinking icon on map using svg, working in fiddle, but when I put style on page its not taking in effect.

    Thursday, August 25, 2016 10:50 PM


  • CSS can be used for SVG's but is limited to static styles. Changing a style will not update the pushpin icon. Keyframe animations are also not supported. The reason for this is that rendering is done using a HTML5 Canvas. SVG's are flattened into the Canvas which allows CSS styles to be used to create a pushpin icon, but they can't be used to change it after it has been initially rendered. If you want flashing pushpins there are two options:

    1. Constantly set the icon of the pushpin to make it re-render. This likely isn't the best option and will be slow.
    2. Use a custom overlay and render the SVG as an SVG rather than as a Pushpin on the canvas. Here is a code sample on how to do this: https://msdn.microsoft.com/en-US/library/mt762877.aspx

    [Blog] [twitter] [LinkedIn]

    Friday, August 26, 2016 12:57 AM