2

マウスの移動座標を計算するために、以下のコードを記述しました

$(document).mousemove(function(e){
  console.log(e.pageX + ", " + e.pageY);
});

そしてここにフィドルがあります。

私の質問は、マウスをゆっくり動かすと、コンソールですべてのマウスが動かされた座標を見ることができるということです。しかし、私がより速く動くとき、私はすべてを見ることができませんでした。数えられるのはごくわずかですが、コードに問題はありますか?

4

2 に答える 2

1

いいえ、それは OS の設計された動作です。これはブラウザのせいではありません。ブラウザは、OS から取得したものだけを提供します。

于 2012-06-07T13:36:39.133 に答える
1

それらを補間する必要があります(つまり、自分自身の間のポイントを計算します)。ブラウザは、新しいティックごとに (たとえば 0.01 秒ごとに) マウスの位置を返すだけです。

幸いなことに、マウスの位置はときどきチェックされるだけです。そうしないと、OS がすぐにフリーズしてしまいます。

内挿は次のようになります

var posX, posY;
$(document).mousemove(function(e){
  var points = [];
  if(posX && posY) {
      // calculate a straight line that the mouse moved over
      // It gets more difficult if you want to take e.g. 
      // the current curved path into account
      var diffX = e.pageX - posX;
      var diffY = e.pageY - poxY;
      var length = Math.round(Math.sqrt((diffY*diffY)+(diffX*diffX)));
      for(n=0;n<length;n++) {
          var pointX = posX + (n/length) * diffX;
          var pointY = posY + (n/length) * diffY;
          points.push({x:pointX,y:pointY});
      }
  }
  points.push({x:e.pageX,y:e.pageY});
  posX = e.pageX;
  poxY = e.pageY;
  for(point in points) {
      console.log(point.x + ", " + point.y);
  }
});
于 2012-06-07T13:46:02.987 に答える