显示具有共享 x 轴的绘图子图中每个图形的 x 轴标签

Question

我用plotly.JS创建了一个子图，每个图共享x轴，如下图所示。

我想显示子图中所有图形的 x 轴值，而不是仅显示底部图形的 x 轴值。我使用锚属性实现了这一点，但图形没有很好地对齐。看下图，这里图2的600与其他两个图的位置不完全一样。

我希望所有图表共享 x 轴并在每个图表上显示 x 轴值。

Answer 1

这是一个老问题，但我花了很多时间寻找这个问题，所以希望这仍然有用。 事实证明，只要不使用

grid

layout

就非常可行。 这是演示它的笔：

https://codepen.io/cerenoc/pen/wvVaYQj

这里的关键部分是：

1. 使用

   domain

   沿 y 方向稍微缩小绘图，为 x 轴标签留出空间
2. 使用

   matches

   指定共享轴
3. 使用“锚点”定位新的 x 轴