Question

我的SVG中定义了以下文本元素：

var data = document.createTextNode("Testing text in SVG");  
var text = document.createElementNS(xmlns, "text");
text.setAttributeNS(null, "font-size",'60');
text.setAttributeNS(null, "x", 2000);
text.setAttributeNS(null, "y", 100);
text.setAttributeNS(null, "fill", "black");
text.setAttributeNS(null, "text-anchor", "middle");
text.setAttributeNS(null, "id", "textLabel");
text.appendChild(data);
Root.appendChild(text);

不幸的是，一旦我放大SVG，文本就不再可见了，这是有道理的，因为x和y坐标是硬编码的。我怎么能解决这个问题，因为无论我放大和缩小多少，我都希望文本在SVG的顶部中间区域始终可见？

谢谢！

Answer 1

尝试将文本元素添加到svg命名空间，而不是xmlns：

var text = document.createElementNS("http://www.w3.org/2000/svg", "text");

“编码”坐标无关紧要。如果正确添加元素，则这些元素应该是相对于svg画布的坐标。

放大后保持SVG中的文本可见

1 个答案: