javascript - D3.js - 格式化数字 - 引发错误

标签 javascript d3.js

我正在使用 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 中以 Angular 格式化数字的正确方法是什么?

提前致谢。

最佳答案

与 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 中使用格式函数。但缺少大括号是导致 TypeError 的原因。

如果您不知道:JavaScript 没有 block 作用域并且变量是提升的。网络上有很多关于 JavaScript 作用域和提升的文章。

关于javascript - D3.js - 格式化数字 - 引发错误,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31693431/

相关文章:

javascript - 在地平线上下文中设置 height() 会拉伸(stretch)图形,同时保留覆盖图缩放比例

javascript - D3 => NVD3.js 更新同一页面上的其他图表

javascript - jQuery 验证器最少需要的单词

java - 如何将java数组列表转换为javascript数组?

javascript - 如何使用 d3.js 在圆内创建 voronoi 图

angular - 如何使用 D3js 和 Angular 7 构建一个简单的 donut chart

javascript - Router.use() 需要中间件功能但未定义

javascript - 悬停时 setInterval 中图像闪烁

javascript - 如何使用 MomentJS 获得一个月的第一个星期一?

algorithm - d3 v4 中的 tree.nodeSize