Question

我想在基于Amcharts的甘特图中显示时间表。它将包含整整一周的时间，以及本周每天的不同时段。

这意味着，当我看到整个星期时，它将在X轴上显示日期： 4月1日，4月2日，4月7日...

当我放大特殊的一天时，它将显示几个小时： 08:00，08:30 ... 13:30，14:00。

在寻找解决方案时，我发现只有几天或只有几个小时的示例。但是永远不要有我需要的混合轴。 Amcharts可以吗？

现在，我的代码如下：

var dateAxis = chart.xAxes.push(new am4charts.DateAxis());
dateAxis.dateFormatter.dateFormat = "yyyy-MM-dd HH:mm";
dateAxis.renderer.minGridDistance = 50;
dateAxis.baseInterval = { count: 10, timeUnit: "minute" };
dateAxis.max = new Date(2018, 0, 5, 24, 0, 0, 0).getTime();
dateAxis.strictMinMax = true;
dateAxis.renderer.tooltipLocation = 0;

但是它只显示几个小时，用户很难理解图表。

Answer 1

您不能直接绘制多个轴值（除非amcharts找到用例并添加包装器），但是您可以侦听click或zoom事件并用轴的新值更新图表。缩小时将其重置。无论如何，您都将以缩放方式重新绘制图表，因为每次缩放时都必须重新计算绘图比例。

如果可以接受，我将用代码更新答案。同时，您也可以按照上述逻辑自行尝试。

Answer 2

我在Amcharts V3中找到了以下解决方案。

第一个是将日期作为X轴，将时间作为Y轴：https://www.amcharts.com/docs/v3/tutorials/using-gantt-chart-display-multi-segmented-columnsbars/

第二个实际上按我想要的方式工作，并在以下问题中进行了解释：https://www.amcharts.com/docs/v3/tutorials/gantt-chart-legend/

谢谢，希望它能一次帮助别人。

Amcharts：基于日期和时间的时间表轴

2 个答案: