如何使用純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矩形？

回答

相關問題