d3.js中".getComputedTextLength()"的等效方法

Question

什么是相当于.getComputedTextLength()方法d3..getComputedTextLength()适用于Dom元素而不是d3元素的对象.
编辑(添加图片)

Answer 1

事实上,D3选择是对象(自D3 v4.0起).但是,没有用于计算对象中文本长度的方法,因为对象本身不存在于DOM中,因此没有长度.您只能计算DOM元素的长度(以像素为单位).

话虽如此getComputedTextLength(),如果您使用该选择指向SVG元素,您可以使用D3选择.例如,使用node():

d3.select("foo");//this is a D3 selection
d3.select("foo").node();//this is the DOM element

这是一个演示:

var svg = d3.select("svg");
var text = svg.append("text")
	.attr("x", 10)
	.attr("y", 30)
	.text("Hello world!");
	
console.log("the text has " + d3.select("text").node().getComputedTextLength() + " px")

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