javascript - 过渡期间格式数字到小数点后一位？ (d3.js)

Question

我正在尝试使用 d3.js 格式，但我正在努力让数字只转换到小数点后一位。

请看下面的例子；

http://plnkr.co/edit/bEpl8wbA3kzsyakGNJZR?p=preview

在整个转换过程中以及最后，我希望它只保留一位小数，因此在我的示例结束时它应该显示 4.4 而不是 4.4162。

这是我的代码；

var formatPercent = d3.format("1r");
var start_val = 0;

var data = 4.4162


d3.selectAll(".textTransition")
  .append("div")
  .text(start_val)
  .attr("class", "percentage")
  .transition()
  .duration(1200)
  .tween(".percentage", function(d) {
    var i = d3.interpolate(0, data);
    return function(t) {
      d3.select(this).text(formatPercent(i(t)));
    };
  });

顺便说一句，我正在使用 d3 v3。

希望有人能帮忙!

谢谢

Answer 1

你可以通过改变行来做到这一点

d3.select(this).text(formatPercent(i(t)));

到

d3.select(this).text(parseFloat(formatPercent(i(t))).toFixed(1));

与以下内容

parseFloat(number goes here).toFixed(1);

是所做的更改。