如何使用Plot.plot函数在Observable中换行长刻度文本?
以下是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吗?
2条答案
按热度按时间lhcgjxsq1#
我们已经在https://github.com/observablehq/plot/issues/460上讨论过这个问题,但是目前还没有官方的支持。我们的想法是在tick格式中考虑换行,好吧,创建一个新行,就像我们在Plot.text中做的那样。草稿可以在https://github.com/observablehq/plot/pull/609和https://github.com/d3/d3-axis/pull/83上找到
1rhkuytd2#
通过@Fil的提示“**......对Plot......**返回的svg进行一些后处理”和一些D3代码,我现在能够用两行标记x轴标记。请查看Observable的笔记本data_plot。