使用D3.js从元素获取宽度

Question

这是我的HTML:

<div class="bar no" style="width: 25.0916%;"></div>

我想将宽度大小作为数字或百分比来访问.

我尝试了以下一些但第一个没有返回任何内容,第二个返回数字,以像素为单位.

width = this.getBBox().width

width = d3.select(this).style("width")

我可以用什么来返回500或25.0%？

Answer 1

比较以下内容:

console.log('Computed style width as pixels: ');
console.log(d3.select('.bar').style('width'));
console.log('Computed style width as a number: ');
console.log(parseFloat(d3.select('.bar').style('width')));
console.log('As a percent: ');
console.log(d3.select('.bar').node().style.width);
console.log('Actual width as number: ');
console.log(d3.select('.bar').node().offsetWidth);

<script src="https://d3js.org/d3.v4.js"></script>
<div class="bar no" style="width: 25.0916%;"></div>