绘制：绘制带有相对时间的时间序列

Question

我想使用Plotly.js可视化时间序列，其中包含不同事件之间的相对时间（以毫秒为单位）。例如，我有以下数据：

[
{"group": 0, "event": "A", "relativeTime": 0},
{"group": 0, "event": "B", "relativeTime": 1000},
{"group": 0, "event": "C", "relativeTime": 2000},
{"group": 1, "event": "A", "relativeTime": 0},
{"group": 1, "event": "B", "relativeTime": 5000},
{"group": 1, "event": "C", "relativeTime": 10000},
{"group": 2, "event": "A", "relativeTime": 0},
{"group": 2, "event": "B", "relativeTime": 30000}
{"group": 2, "event": "C", "relativeTime": 300000},
]

数据呈现不同的组（在示例组0-2中），每个组具有几个事件（事件AC），以及一个相对时间跨度在组的第一个事件和当前事件之间，以毫秒为单位。例如：{“ group”：0，“ event”：“ B”，“ relativeTime”：1000}表示组“ 0”的事件“ B”与组“ 0”的事件“ A”相距1000ms。 / p>

要绘制图形，我使用了散点图，其中 groups 用于y轴， relativeTimes 用于x轴，以及事件进行着色。当我在散点图中绘制这些数据时，我得到的是这样的：

此外，我想提供放大的可能性。缩放后，图表看起来像这样：

屏幕截图显示了我的当前状态。

现在我的问题是：
如您在屏幕快照中看到的，x轴显示毫秒。但是，为了获得更好的可读性，我希望在几个月，几天，几小时甚至几分钟内显示此内容，具体取决于缩放级别。例如，如果图表未缩放，则图表应以天为单位显示时间（例如1d，2d，3d等），如果图表被缩放，则时间应以分钟为单位（例如10min，20min， 30分钟， ...）。有办法吗？