D3如何去除千位分隔符逗号

27

我有一个包含3列的.json文件,其中一列是“年份”(Year)。该列只包含年份,没有日期。

当我将其作为“x”轴进行图形化显示时,年份会以千位分隔符逗号的形式显示。

因此,在.json文件中,日期的格式如下:“Year”:1990,而在“x”轴上,它会显示为1,990。

我一直在试图弄清楚如何解析这个年份,但迄今为止没有成功。我已经尝试了以下方法:

var parseDate = d3.time.format("%y").parse

var x = d3.time.scale()
.range([0, width]);

//further down

d3.json("waterData.json", function(error, json) {

// Attach Data
var data = json.data;

// Select Data for X and Y
var axis1 = 'Year'; 
var axis2 = 'Ratio'

// Convert String into Numbers
data.forEach(function(d) {

///axis1 = parseDate(axis1);

d[axis1] = +d[axis1]
d[axis2] = +d[axis2]
});

 x.domain(d3.extent(data, function(d) { return d[axis1]; }));
 y.domain(d3.extent(data, function(d) { return d[axis2]; }));


 svg.append("g")
  .attr("class", "x axis")
  .attr("transform", "translate(0," + (height+10) + ")")
  .call(xAxis)
 .append("text")
  .attr("class", "label")
  .attr("x", width)
  .attr("y", -40)
  .text(axis1)

 svg.append("g")
  .attr("class", "y axis")
  .attr("transform", "translate("+ -10 + "," + 0 + ")")
  .call(yAxis)
 .append("text")
  .attr("class", "label")
  .attr("x", 10)
  .style("fill", "#666")
  .style("text-anchor", "start")
  .text(axis2)

有什么建议可以去掉逗号分隔符,或者找出如何解析日期。


看起来你实际上没有在使用你的 parseDate 函数。尝试使用 d[axis1] = parseDate(d[axis1]) - Lars Kotthoff
我正在使用它,或者至少我正在尝试从底部到第五行。谢谢你的建议,但这并不起作用。 - Georgi
你在错误的地方使用它了。这是你完整的代码吗? - Lars Kotthoff
不,这不是完整的代码。 - Georgi
我试过了,没有任何区别。我仍然不确定你建议在哪里调用解析器。 - Georgi
显示剩余5条评论
1个回答

46

您应该将.tickFormat(d3.format("d"))添加到您的x轴:

var xAxis = d3.svg.axis().scale(x).orient("bottom").tickFormat(d3.format("d"));

1
请注意,这会使您失去小数精度。 - Max von Hippel

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接