Javascript 如何通过数据连接将多个x轴添加到d3图表？

我试图使用d3一次创建几个图表-代码如下：

我有这些对象的数组

bulletDataX

：

function BulletObject(name, actual, target, ranges, bulletWidth) {
 this.name = name;
    this.actual = actual;
    this.target = target;
    this.ranges = ranges;
    this.maxX = ranges[2];
    this.bulletWidth = bulletWidth;
    this.scale = d3.scale.linear().domain([0, this.maxX]).range([0, this.bulletWidth]);
    this.xAxis = d3.svg.axis().scale(this.scale).orient("bottom");
}

这是我正在努力工作的代码

//axes??? not working
svg.selectAll(".xaxis")
.data(bulletDataX)
.enter()
.append("g")
.attr("id", function(d) { return d.name; })
.attr("class", "x axis")
.attr("transform", function(d, i) { return  "translate(0, " + ((bulletHeight + bulletPadding) * i + .25 * bulletHeight).toString() + ")"; })
.call(function(d, i) { return d.xAxis; });

---

我知道我必须稍微修改transform属性，但我甚至无法显示轴。我认为问题在于

.call（函数（d，I）{return d.xAxis；}）

但我不知道如何让它工作。任何想法都将不胜感激。

调用

方法不会为您提供
d，i
参数。相反，它：

调用指定函数一次，传入当前选择
以及任何可选参数

请参阅API文档：

您可以尝试改用
每个
。它：

为当前文件中的每个元素调用指定的函数
选择，通过
此

当前DOM元素的上下文

请参阅API文档：

下面是一个代码示例：

.each(function (d, i) {
    return d.xAxis(d3.select(this));
});