使用 Chart JS 或其他库的甘特图变体

Question

描绘的条形图的图像

我想创建一个堆叠条形图的变体，它是浮动的并在多次出现时接受相同的活动/输入，Y 轴显示 24 小时时间（上午 12 点 - 晚上 11:59），X 轴显示日历日 (9/2, 9/3)。 此图表的目的是显示您全天的所有活动。

每个条都将用其关联的活动进行颜色编码，并且必须具有开始和结束时间才能在关联的时间段 Y 轴中显示该条。 您也可以在同一天（x 轴）输入相同的活动，它不会加总，但仍将其放在正确的时间段中。 我还希望每个条都在同一列上对齐。 这假设没有活动可以相互重叠。

这可以用 Chart JS 实现吗？ 我见过堆叠条形图和其他甘特图变体，但它们都没有在同一列上显示同一活动的多次出现以及开始/结束时间。 如果不是，我可以使用哪些其他框架？

Answer 1

我认为您应该能够使用x-range系列类型创建这种类型的图表。

API: https://www.highcharts.com/docs/chart-and-series-types/x-range-series