如何使用Plot.plot函数将长滴答文本包装在Observablehq中？

Question

如何使用Plot.plot函数在可观察的范围内包装长滴答文本？

下面是D3的一个示例：

​

​

svg.select(".x_axis")
      .call(xAxis.tickFormat(d3.timeFormat("%d-%m-%Y %H:%M:%S")))
      .selectAll("text")
      .call(function (t) {
        t.each(function (d) {
          var self = d3.select(this);
          var s = self.text().split(' ');
          self.text(null);
          self.append("tspan")
            .attr("x", 0)
            .attr("dy", ".8em")
            .text(s[0]);
          self.append("tspan")
            .attr("x", 0)
            .attr("dy", "1.2em")
            .text(s[1]);
        })
      });

我不清楚如何将它集成到绘图功能中。我能用tickFormat吗？

​

​

Answer 1

我们在https://github.com/observablehq/plot/issues/460上一直在讨论这个问题，但是还没有得到官方的支持。这样做的想法是考虑以滴答格式的换行符来创建一个新行，就像我们在Plot.text中所做的那样。草稿可在https://github.com/observablehq/plot/pull/609和https://github.com/d3/d3-axis/pull/83获得

Answer 2

有了@Fil和一些代码中的提示“svg上的某种后置处理(由Plot.返回)”，我现在能够用两行标记x轴标记。请查看可观察到的笔记本绘图。