不会绘制foreignObject中的任何SVG元素,除非在递归嵌入具有正确xmlns属性规范的正确定义的SVG子文档的情况下。
我已尝试为所有后续元素设置正确的命名空间,但没有任何成功。
我想要完成的事情大致如下:
<svg>
<foreignObject>
some html text
<svg width="10" height="10"><rect fill="red" width="10" height="10" /></svg>
</foreignObject>
</svg>
答案 0 :(得分:4)
您必须在foreignObject中包含一个元素,尽管该元素可能包含子元素。所以你可以这样做......
<svg xmlns="http://www.w3.org/2000/svg" version="1.1">
<foreignObject width="100%" height="100%">
<div xmlns="http://www.w3.org/1999/xhtml">some html text
<svg xmlns="http://www.w3.org/2000/svg" width="10" height="10"><rect fill="red" width="10" height="10" /></svg>
</div>
</foreignObject>
</svg>