Question

如果我创建文本元素并添加拖动处理程序，则它不会在触摸设备上移动。我可以看到move事件被触发，但元素没有被拖动。如果我创建一个路径元素并附加相同的拖动处理程序，那么路径元素在触摸设备上移动得很好。我的笔记本电脑上的Chrome和Firefox上的所有元素都可以正常移动。

为了让文字元素在触摸设备上拖动，我还有什么特别之处吗？

这是我正在做的事情的片段。我确实删除了一些不相关的代码，所以看起来有点奇怪。

var word = paper.text(xVal, yVal, "text"]);
word.drag(window.move, window.start, window.up)

window.start = function() {
  this.lastDx = 0;
  this.lastDy = 0;
};

window.move = function(dx, dy) {
  this.transform("...T" + (dx - this.lastDx) + "," + (dy - this.lastDy));
  this.lastDx = dx;
  this.lastDy = dy;
  return this;

};

window.up = function() {
  this.lastDx = 0;
  this.lastDy = 0;
};

Answer 1

经过一些试验和错误，我能够通过创建一个“包裹”文本的矩形来解决这个问题。我对矩形进行了填充，但不透明度为0，然后将矩形和文本组合在一起，使得该组成为可拖动的部分。

Answer 2

Raphael 2.1.1针对此问题进行了修复。先前版本在触摸设备上报告了NaN / dx dy，因此如果您使用这些版本进行拖动，那么它将无法正常工作。

请参阅https://github.com/DmitryBaranovskiy/raphael/issues/328

RaphaelJS中的文本元素没有拖动触摸设备

2 个答案: