Javascript D3非连续日期域给出X轴上的间隙

我想绘制一些不连续的时间序列数据（周末、假期等的日期间隔）。这是每日数据

数据如下所示：

date,value
1/2/15,109.33
1/5/15,106.25
1/6/15,106.26
1/7/15,107.75
1/8/15,111.89
1/9/15,112.01
1/12/15,109.25
1/13/15,110.22
...

所以我定义了我的

x

和

y

比例

：

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

并根据我的源数据设置域：

x.domain(d3.extent(data, function(d) { return d.date; }));
y.domain(d3.extent(data, function(d) { return d.value; }));

然而，问题是我的约会有间隔。我的x轴现在包括那些丢失的日期（

d3.time.scale（）

我猜这是自动的，因为它映射到一个连续的范围？）

.extent（）

在

date

中查找最大值和最小值，然后

.domain（）

将这些最大值和最小值作为x轴的范围返回。但我不知道如何处理间隙和返回非间隙日期的范围

所以我的问题是：如何让我的x轴范围只包括数据集中的日期？而不是“填空”。我应该玩d3.time.scale（）.range（）？或者我是否需要使用不同的

刻度

正确的方法是什么？有人能给我指出正确的方向或举个例子吗？谢谢大家!

---

另外，我想用纯d3和javascript来解决这个问题。我对使用任何第三方抽象库都不感兴趣。

正如Lars Kotthof指出的，您可以创建一个有序的x轴，它“看起来”像一个时间刻度。 假设要将时间序列绘制为直线，下面是一个示例：

如果要自定义日期格式，例如，将日期重新表示为天（周中）、天和月，则必须先将字符串转换为日期。 我添加了一个示例，它将日期格式化为通用的德语格式。但是您可以根据自己的需要轻松地调整代码。

最后，但并非最不重要的是，您可以使用

axis.tickValues([values])

选择要显示的日期。另见：

组件采用任何其他刻度（例如d3时间刻度）并添加不连续性概念

这些不连续性是通过“不连续性提供者”确定的。内置的

不连续性kipWeekends

允许您跳过周末

下面是一个例子：

const skipWeekendScale = fc.scaleDiscontinuous(d3.scaleTime())
  .discontinuityProvider(fc.discontinuitySkipWeekends());

---

这里有一个完整的演示：

您可以使用序数刻度。