如何使用纯javascript（不是d3.js）添加标题到svg矩形？

我对代码进行了更改。它们以正确的方式显示，因为工具提示或标题仍未显示。如何使用纯javascript（不是d3.js）添加标题到svg矩形？

var use = document.createElementNS("http://www.w3.org/2000/svg", "use"); 
use.setAttributeNS("http://www.w3.org/1999/xlink", "xlink:href", "mydefs.svg#hello"); 

var title = document.createElementNS('http://www.w3.org/2000/svg', 'title'); 
title.textContent = data[i].status;//JSON Object 

svg.appendChild(rect); 
svg.appendChild(text); 

//Use and Title added 

svg.appendChild(use); 
svg.appendChild(title); 

document.body.appendChild(svg);

来源

2015-05-04 sia

我不知道你在哪里添加'use'到文档中。如果它没有被添加，那么我可以非常理解未出现的工具提示。 –

@Luke这是添加“使用”的相同方式，因为标题/工具提示没有出现？ – sia

现在您将标题添加到整个SVG元素，而不仅仅是您的'use'元素。你确定你的'data [i] .status' JSON对象存在吗？尝试用一个静态文本字符串替换它，例如'“test”'来查看它是否有效。 –

你的例子很混乱，因为你没有说出<use>的目的是什么。再加上什么是text？

如果你想一个<title>添加到<rect>元素，所有你需要做的是这样的：

var title = document.createElementNS('http://www.w3.org/2000/svg', 'title'); 
title.textContent = data[i].status;//JSON Object 
rect.appendChild(title);

来源

2015-05-04 09:32:52

谢谢你。由于它是代码的一部分，我使用文本在svg rect元素上显示文本。 – sia

如何使用纯javascript（不是d3.js）添加标题到svg矩形？

回答

相关问题