在 amcharts 甘特图中绘制代表当前日期的移动垂直线？

Question

我正在使用 amCharts4，并且能够在我的甘特图上绘制一条表示当前日期时间的垂直线，如下所述：。但是，如何根据当前时间使垂直线在图表上每秒移动一次？这是代码：

var range = dateAxis.axisRanges.create();
range.date = new Date("2020-10-29 07:04:56");
range.grid.stroke = am4core.color("red");
range.grid.strokeWidth = 2;
range.grid.strokeOpacity = 1;

Answer 1

您可以添加一个每秒运行一次的 setInterval 来更新范围内的日期，如下所示：

// First, create your range marker
var range = dateAxis.axisRanges.create();
range.grid.stroke = am4core.color("red");
range.grid.strokeWidth = 2;
range.grid.strokeOpacity = 1;
range.date = new Date();

// Then, update the position of your range marker every second
range.date = new Date(2018, 0, 1, 8, 0, 0, 0);
var timeout = window.setInterval(() => {
  range.date = new Date(range.date.getTime() + 1000);
}, 1000);

chart.events.on('beforedisposed', () => {
   clearTimeout(timeout);
});

Here is an example

更新

你想对超时做的一件事是当你不再需要它时也清除它——例如，当你处理图表或标记时。

我已经更新了上面的代码，以便在处理图表之前清除它。

在 amcharts 甘特图中绘制代表当前日期的移动垂直线？

Draw a moving vertical line representing the current date in amcharts gantt chart?

amcharts4