svg in data uri not rendered

我嘗試使用動態生成的svg創建一個svg圖釘（example）。不幸的是，它不能在地圖上正確顯示引腳。我四處挖掘，發現bing地圖API將src設置爲base64編碼圖像。svg in data uri not rendered

所以我試圖將圖像源複製到js小提琴中，看看bing maps API或瀏覽器是否有問題。它正在爲簡單的相似圖片

<svg xmlns="http://www.w3.org/2000/svg" width="50" height="50"> 
    <circle id="circle" cx="25" cy="25" r="25" /> 
</svg>

但更復雜一點的圖像不會呈現

<svg xmlns="http://www.w3.org/2000/svg" width="50" height="50"> 
    <defs> 
     <circle id="circle" cx="25" cy="25" r="25" /> 
    </defs> 
    <clipPath id="clip"></clipPath> 
    <image xlink:href="https://www.gravatar.com/avatar/08b73d0a58fc120a8cc8dc561d83b3d6.jpg?s=50&d=mm" x="0" y="0" height="50" width="50" /> 
</svg>

JS小提琴：https://jsfiddle.net/w1yn9Lo8/6/

兩個圖像得到渲染好的，如果我貼他們直接轉換成HTML。這裏有什麼問題？

來源

2017-01-18 Sven-Michael Stübe

SVG圖像使用帆布標記在Bing地圖中不受支持，因爲地圖控件需要使用SVG並立即在HTML畫布上繪製它們。因爲這樣的圖像沒有機會加載。 – rbrundritt