Question

我正在使用angularjs来开发我的应用。我整合了d3.js的图表，我从json得到一个数字，需要转换为金钱并显示在图表的中心。

我尝试这样做的样本：

var text = group.selectAll("text.title")
            .data(data)
            .enter();

text.append("text")
    .classed("title-total", true )
    .text( function (d, i) {
    if( catg === "payStTotalGraph" )
            var format = d3.format("00,000,0000");
            console.log ( format(123456)); //output as 123,456 instead of 12,356
            return d[i].value;

})
.attr("text-anchor","middle")
.attr("transform", "translate(" + 0 + "," + 20 + ")");

和Angular将错误抛出为：

TypeError: format is not a function
    at SVGTextElement.<anonymous> (dirProjectSummary.js:328)
    at SVGTextElement._a.text.arguments.length.each.function.n.textContent (d3.min.js:3)
    at d3.min.js:3
    at Y (d3.min.js:1)
    at Array._a.each (d3.min.js:3)
    at Array._a.text (d3.min.js:3)
    at drawPaymentGraph (dirProjectSummary.js:324)
    at dirProjectSummary.js:262
    at Object.m [as forEach] (angular.js:350)
    at Object.<anonymous> (dirProjectSummary.js:250)

格式化d3js中数字的正确方法是什么？

提前致谢。

Answer 1

与Angular完全无关。问题不在{语句中使用}和if。正确的代码（至少我猜）：

text.append("text")
    .classed("title-total", true )
    .text( function (d, i) {
    if( catg === "payStTotalGraph" ) { // <- opening
            var format = d3.format("00,000,0000");
            console.log ( format(123456)); //output as 123,456 instead of 12,356
            return d[i].value;
    } // <-- closing
})

我认为你的程序的这一小部分还没有完成，因为你只在console.log中使用了format-function。但缺少花括号是TypeError的原因。

如果你不知道：JavaScript没有块范围，并且变量被挂起。有很多关于JavaScript范围和在网络上提升的文章。

D3.js - 格式化数字 - 抛出错误

1 个答案: