Question

我正在尝试计算内存中的svg <text>的长度（而不是实际DOM中的长度）。这可能吗？如果没有，可能的解决方案是什么？

下面有我的摘录，但上面写着

“消息”：“未捕获的TypeError：text.node（...）。getComputedTextLength不是函数”，

以下是代码段：

var svg = d3.select('svg');
var text1 = svg.append("text")
	.attr("x", 10)
	.attr("y", 30)
	.text("Hello world!");

console.log("the text in DOCUMENT has " + text1.node().getComputedTextLength() + " px")

var div = document.createElement('div');
var svg = d3.select(div).append('svg');
text2 = svg.append("text")
	.attr("x", 10)
	.attr("y", 30)
	.text("Hello world!");
console.log("the text in MEMORY has " + text2.node().getComputedTextLength() + " px")

<script src="https://d3js.org/d3.v4.min.js"></script>
<svg></svg>

Answer 1

看起来与您在第二个示例中创建的图像不同。您需要append('svg')才能在div中创建一个。但是，我仍然认为这样做不会成功，因为在渲染图像之前不会计算文本宽度。（至少当我尝试时，打印的长度为0。）

使用D3计算内存中节点的文本长度

1 个答案: