问题:我从关联数组中提取的HTML链接不是作为链接应用的,而是作为字符串应用的,因此浏览器无法遍历HTML链接。
完整的可视化示例和代码:位于:http://bl.ocks.org/Guerino1/6366020
数据:我有一个关联数组的Javascript数组。
var densitySet = [
{ Name: "<a href="http:if4it.com">IF4IT</a>", Total: 1000 },
{ Name: "Node2", Total: 1500 },
.
.
.
{ Name: "Node3", Total: 700 },
{ Name: "Node27", Total: 1500 }
];
您会注意到,第一个关联数组的第一个元素有一个数据元素,它是一个HTML链接。我想提取该链接,并将其应用于我使用D3生成的HTML表的单元格。
症状:当表呈现时,完整的HTML路径呈现为字符串,而不是可遍历的HTML链接。
提取链接数据并将其应用于单元格的代码如下。。。
var densityBodyDataRecords = d3.selectAll("#density_body_record").selectAll("tr.td")
.data(function(d) { return densityKeys.map(function(k) { return d[k]; }); })
.enter()
.append("td")
.attr("id", "density_body_data")
//.text(function(d) { return d; })
.text(function(d, i) {
if(i < 2) { return d; } <------------------TEXT APPLIED HERE
})
.style("font-size", "10pt")
.append("svg")
.attr("width", function(d, i) {
if(i == 0) { return 200; }
else if(i == 1) { return 100; }
else { return 500; }
})
//.attr("height", 15)
.attr("height", function(d, i) {
if(i < 2) { return 0; }
else { return 15; }
})
.append("rect")
.attr("height", 15)
.style("fill", "Blue")
.attr("width", function(d, i) {
if(i == 2) { return (d/maxRelationshipValue)*100*5; }
else { return 0; }
});
任何关于如何解决这个问题的想法都将不胜感激。
谢谢!
如果希望将内容解析为HTML,则必须调用.html()
,而不是.text()
。