javascript - 捕获 `touchmove`事件时访问触摸历史记录

Question

我正在尝试学习如何使用touchmove event在浏览器中检测多点触控手势。当捕获 touchmove 事件时，我可以获得当前触摸点的列表。然而，这对于检测手势并不是很有用。我喜欢获取触摸事件的历史记录。例如，我想获取每个当前不同触摸点之前的最后 10 个触摸点(如果可用)的列表。我画了下图，试图形象化我所追求的东西:

正如我所说，在这种情况下，用户以两种不同的模式(来自不同手的手指)在屏幕上拖动两个单独的手指，我在 touchmove 事件中仅收到两个触摸点。是否可以访问两个点在到达 A 和 B 之前所处位置的历史记录？

以下是捕获 touchmove 事件的相关代码:

document.addEventListener('touchmove', touchMove, false);

function touchMove(e) {
  console.log("length is: ", e.touches.length);
  e.preventDefault();
}

请不要建议第三方库 - 我的目标是学习如何定义和检测我自己的自定义真正多点触控手势。

Answer 1

是的，您可以将先前的位置存储在数组中并对其进行迭代。

1. 在 touchstart 中重置它们的历史记录事件
2. touchmove 内部事件，将当前坐标作为对象推送到每个数组上，通过 identifier 标识Touch的属性(property)目的。您可以通过pageX访问坐标。和pageY Touch的属性对象可在 event.targetTouches. To only store 10, call 中使用插入数组后，切片(-10)`。