Javascript 使用snap.svg使用键盘箭头按增量移动

我试图通过不移动到某个位置来移动一个名为myCurser的svg。 目标是沿栅格移动形状，在本例中为40x40。 随后，增量将动态更改

我知道我可以移动到并为svg指定一个新的cx。但我不会写字 cx=cx+40

---

这是我在电子邮件中给出的答案

你会想做一些像

myCurser.attr('cx', +myCurser.attr('cx') + 10)

Snap.plugin( function( Snap, Element, Paper, global ) {
   Element.prototype.increaseAttr = function(myattr, value) {
      return this.attr(myattr, +this.attr(myattr) + value);
   }
});


myCurser.increaseAttr('cx', -10) //// Move left

注意，这里的额外+是为了确保它不添加字符串，而只是添加数字

您也可以添加一个插件来做类似的事情，这可能有点混乱，但如果您必须重复代码，它会很有用。所以这个插件看起来像

myCurser.attr('cx', +myCurser.attr('cx') + 10)

Snap.plugin( function( Snap, Element, Paper, global ) {
   Element.prototype.increaseAttr = function(myattr, value) {
      return this.attr(myattr, +this.attr(myattr) + value);
   }
});


myCurser.increaseAttr('cx', -10) //// Move left

这是一个代码笔，其中一个方法向右移动，另一个方法向左移动

如果要移动更复杂的对象，可能需要查看变换