Javascript svg图像添加到DOM中，但不是'；t*可见*除非在Firebug中触摸

我正在尝试为我创建的webtoy添加一个功能。它使用原始javascript和SVG。这个应用程序有很多功能，已经有一年多的历史了。我的新功能是在将图像文件从文件系统拖到屏幕上的一个特殊位置时，将SVG添加到。我已经完成了所有的拖动、解析和附加操作，但是我的图像没有出现。不是它不在标记中，而是在标记中，只是我看不到图像

我会怀疑有什么分层或不透明的问题，除了我可以做两个奇怪的技巧使图像出现：

• 只需将整个元素（xlink:href和all）复制到其他人的SVG编辑器中（如W3s上的“try it”编辑器）
• 使用Firebug手动编辑标记，只需在“/>”结束标记之前插入空格或回车符的最后几个字符（删除新字符不会使图像再次消失）

将其添加到文档的函数如下所示：

function applyImageToFaces(data) {
    var image = document.createElementNS("http://www.w3.org/2000/svg", "image");
    image.setAttribute("width","800");
    image.setAttribute("height","800");
    image.setAttribute("xlink:href",data);

    shapeGroup.appendChild(image);
}

<image width="800" height="800" xlink:href="http://thumbs.ebaystatic.com/d/l225/m/m-EuLTQ6AWFEafDhXz9cujA.jpg"/>

有人知道那是什么样的行为吗

编辑：即使我将“数据”替换为一个普通链接，看起来也是这样：

function applyImageToFaces(data) {
    var image = document.createElementNS("http://www.w3.org/2000/svg", "image");
    image.setAttribute("width","800");
    image.setAttribute("height","800");
    image.setAttribute("xlink:href",data);

    shapeGroup.appendChild(image);
}

<image width="800" height="800" xlink:href="http://thumbs.ebaystatic.com/d/l225/m/m-EuLTQ6AWFEafDhXz9cujA.jpg"/>

它的行为方式完全相同。我找到了我的答案：

我以前尝试过，但我在名称空间中省略了“http://”，因为我是从对这个答案的评论中复制它的：