添加文本在JavaScript

我想一个SVG文件中使用JavaScript 我的代码看起来像这样添加文本在JavaScript

function addText(x,y,val){ 
var newtxt = document.createElementNS("http://www.w3.org/2000/svg", "text"); 
$newtxt = $(newtxt); 
$newtxt.attr('x',x); 
$newtxt.attr('y',y); 
$newtxt.attr('font-size','100'); 
$newtxt.val(val); 

$newtxt.appendTo($('g'));}

文本元素添加到<g>元素，但是当我运行它的文本是SVG文档未显示。该元素被添加到<g>元素，但该值未设置。任何想法如何解决这个??

来源

2012-02-14 zeacuss

我认为你需要创建一个文本节点来保存字符串并将其附加到SVG文本元素。

var newText = document.createElementNS(svgNS,"text"); 
newText.setAttributeNS(null,"x",x);  
newText.setAttributeNS(null,"y",y); 
newText.setAttributeNS(null,"font-size","100"); 

var textNode = document.createTextNode(val); 
newText.appendChild(textNode); 
document.getElementById("g").appendChild(newText);

在http://www.carto.net/svg/manipulating_svg_with_dom_ecmascript/有一个工作示例。

来源

2012-02-14 17:52:34 Bill

我已验证这是正确的。（使用createTextNode。）应该被标记为答案。 – 2014-04-03 18:09:39

我想知道他们为什么如此复杂真的 – FlorianB 2016-08-30 18:13:51

var txt = document.createElementNS(svgNS, 'text'); 
txt.setAttributeNS(null, 'x', x); 
txt.setAttributeNS(null, 'y', y); 
txt.setAttributeNS(null,'font-size','100'); 
txt.innerHTML = val; 
document.getElementById("g").appendChild(txt);

来源

2016-08-10 21:26:25

虽然这段代码可以解决这个问题，但[包括解释]（// meta.stackexchange.com/questions/114762/explaining-entirely-code-based-answers）真的有帮助以提高您的帖子的质量。请记住，您将来会为读者回答问题，而这些人可能不知道您的代码建议的原因。也请尽量不要使用解释性注释来挤占代码，因为这会降低代码和解释的可读性！ – FrankerZ 2016-08-11 05:57:48

谢谢你简单地解决这个问题 – 2017-10-03 09:12:34

添加文本在JavaScript

回答

相关问题