单独设置 D3 中的多个轴的格式

Formatting multiple axes in D3 indivdiually

本文关键字:格式 单独 D3 设置      更新时间:2023-09-26

我正在遵循散点图矩阵示例,但我的轴需要不同的格式。我有一些面向时间的变量和一些标准数值变量。我希望轴具有不同的格式,因为目前,面向时间的标签以逗号显示(例如 2,005 而不是 2005)。我试过附加

   .tickFormat(d3.format("d"))

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

但这会将所有轴格式化为日期。有没有办法以不同的方式格式化每个轴?

再往下xAxis调用来呈现轴:

.each(function(d, i) {
  x.domain(domainByTrait[d]);
  d3.select(this).call(xAxis);
});

该函数在每个特征d调用一次,因此您可以从那里调用

xAxis.tickFormat(d3.format(...))

.tickFormat(d3.time.format(...))

在渲染轴之前。