none
Bing Maps V8 Custom pushpin with SVG foreignObject tag doesnt work with IE

    Question

  • Hi,

    I am creating custom pushpin with SVG foreignObject tag , it shows output in Edge but nothing in IE. Can you please help.

    Code snippet :
    var map = new  Microsoft.Maps.Map('#myMap', { credentials:'BingMAPKey'});
    var svgTemplate = '<svg xmlns=https://www.w3.org/2000/svg width="25" height="25"><foreignObject width="100%" height="100%"><div xmlns="https://www/w3.org/1999/xhtml"> {htmlContent}</div></foreignObject></svg>'
               infobox = new Microsoft.Maps.Infobox(map.getCenter(), {visible: false});
               infobox.setMap(map);
               var center = map.getCenter();
               var pins = [];
    var pin = new Microsoft.Maps.Pushpin(new Microsoft.Maps.Location(latitude, -longitude),{
    icon: svgTemplate.replace('{htmlContent}',  "<div style='font-size:30px;font-weight:bold;color:brown;'>&#8226;</div>")  });
    pin.metadata = { title: "Point #1",
    description:"ABC: 0 <br>Time: 11/14/18 12:05.24<P></P><P>Accuracy: Excellent</P>" };
    Microsoft.Maps.Events.addHandler(pin, 'mouseover', pinOver);
     Microsoft.Maps.Events.addHandler(pin, 'mouseout', pinOut);
    pins.push(pin);

    Thanks,

    Snehal

    Wednesday, December 19, 2018 12:11 PM

All replies