javascript - 在轴和起点之间添加间距

Question

我想在 x 轴上的 0 和 March 之间添加间距，以便它看起来更好。

startdate 和enddate 由d3.min 和d3.max 计算。

所以这些列看起来很糟糕，因为它们的宽度。

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

var datestart = d3.min(data, function(d) { return parseDate(d.date); });
var dateend = d3.max(data, function(d) { return parseDate(d.date);});

x.domain([datestart, dateend]);

我该怎么做？如何使用 d3.scaleTime() 添加填充？

Answer 1

正如您在 comment 中提到的那样(也许是回复？)，时间尺度上没有填充。

因此，这里的问题是时不时(没有双关语意)出现在 SO 处:您使用了错误的工具来完成任务。条形图应始终使用分类(定性)尺度，而不是定量尺度或时间尺度。

但是，如果你真的需要在这里使用时间刻度(无论出于何种原因)，你可以在域中添加填充，使用 offset .

例如，这将在您域的开头减去 15 天，并在末尾添加 15 天:

var datestart = d3.min(data, function(d) { 
    return d3.timeDay.offset(parseDate(d.date), -15);
    //subtract 15 days here ---------------------^ 
});

var dateend = d3.max(data, function(d) { 
    return d3.timeDay.offset(parseDate(d.date), 15);
    //add 15 days here -------------------------^
});

您可以调整该值，直到您有足够的填充。因为我不知道您是如何计算条形宽度的(同样，条形不应该在时间范围内使用)，15 天在这里只是一个猜测。