在javascript中将文本添加到SVG文档

本文介绍了在javascript中将文本添加到SVG文档的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！ 问题描述

我正在尝试使用javascript 向SVG文档中的< g> 元素添加文本元素我的代码如下所示

I'm trying to add a text element to the <g> element in a SVG document using javascript my code looks like this

function addText(x,y,val){ var newtxt = document.createElementNS("www.w3/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> 元素中，但该值未设置.. 任何想法如何解决这个问题？

but when I run it the text is not shown. the element is added to the <g> element, but the value is not set.. any ideas how to solve this??

推荐答案

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

I think you need to create a text node to hold the string and append that to the SVG text element.

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);

old.carto/papers/svg/manipulating_svg_with_dom_ecmascript/ 。