D3.js d3时间刻度-如何设置轴偏移

D3.js d3时间刻度-如何设置轴偏移,d3.js,D3.js,我只是试着在d3中编写一个可重用的图表来可视化我们的能源数据。 我使用X轴的时间刻度。我不能使用有序的无离散域,所以我必须自己计算量程等 问题:我的条形图与图表重叠-防止这种情况的最佳方法是什么?。 我认为一种方法是在X轴域中设置一个偏移量-以下是我的代码片段,希望这些代码片段很清楚..: // get X-Axis Min from all channels var tsMin = d3.min(channels, function (channel) { re

我只是试着在d3中编写一个可重用的图表来可视化我们的能源数据。 我使用X轴的时间刻度。我不能使用有序的无离散域,所以我必须自己计算量程等

问题:我的条形图与图表重叠-防止这种情况的最佳方法是什么?。 我认为一种方法是在X轴域中设置一个偏移量-以下是我的代码片段,希望这些代码片段很清楚..:

    // get X-Axis Min from all channels
    var tsMin = d3.min(channels, function (channel) {
        return d3.min(channel.DataRows, function (d) { return d.TimeStamp; });
    });
    // get X-Axis Max from all channels
    var tsMax = d3.max(channels, function (channel) {
        return d3.max(channel.DataRows, function (d) { return d.TimeStamp; });
    });

    // Test: offset 1 day 
    var tsMinOff = d3.time.day.offset(tsMin, -1)
    var tsMaxOff = d3.time.day.offset(tsMax, 1)

    xScale.domain([tsMinOff, tsMaxOff]);

    var bars = chGroup.selectAll(".bar").data(channel.DataRows);
    var barWidth = chartWidth / channel.DataRows.length;

    bars.enter().append("rect")
      .classed("bar", true)
      .attr("x", function (d) { return xScale(d.TimeStamp) - (barWidth / 2); })
      .attr("width", barWidth)
      .attr("y", function (d) { return yScale(d.Value) })
      .attr("height", function (d) { return chartHeight - yScale(d.Value); })
       .style("fill", channel.Color);
thx


将图表至少扩展到条形图宽度的一半。也就是说,将域的大小增加相应的值。嗨,Lars,对不起,你是什么意思?扩展图表…将x比例域的极值设置为与条形边缘对应的任何值。我的x比例域是时间戳,我如何处理它以与条形边缘对应?很明显,我错过了整个森林。看起来好像是几个月,所以你可以随便加上一个月。