2017-06-30 13 views
0

からスワイプの角度を取得するにはどうしたら、次のコードがあります。javascriptのタッチイベント

swipeDetect = function(el, callback){ 

    var touchsurface = el, 
    swipedir, 
    startX, 
    startY, 
    distX, 
    distY, 
    threshold = 7, //required min distance traveled to be considered swipe 
    restraint = 100, // maximum distance allowed at the same time in perpendicular direction 
    allowedTime = 500, // maximum time allowed to travel that distance 
    maxangle=40, 
    elapsedTime, 
    startTime, 
    touchinprocess=false, 
    handleswipe = callback || function(swipedir){}; 

    touchsurface.addEventListener('touchstart', function(e){ 

     touchinprogress = true; 
     var touchobj = e.changedTouches[0]; 
     swipedir = 'none'; 
     dist = 0; 
     startX = touchobj.pageX; 
     startY = touchobj.pageY; 
     startTime = new Date().getTime(); 
    }, false); 

    touchsurface.addEventListener('touchmove', function(e){ 


     var touchobj = e.changedTouches[0]; 
     distX = startX - touchobj.pageX; 
     distY = startY - touchobj.pageY; 
     rads = Math.atan(distY,distX); 
     var deg = rads * (180/3.14); 
     console.log(deg); 
     if (Math.abs(distY) > restraint && Math.abs(deg) > maxangle) e.preventDefault(); 

    }, false); 

    touchsurface.addEventListener('touchend', function(e){ 

     var touchobj = e.changedTouches[0]; 
     distX = touchobj.pageX - startX; 
     distY = touchobj.pageY - startY; 
     elapsedTime = new Date().getTime() - startTime; 

     if (elapsedTime <= allowedTime){ // first condition for awipe met 
      if (Math.abs(distX) >= threshold && Math.abs(distY) <= restraint){ // 2nd condition for horizontal swipe met 
       swipedir = (distX < 0)? 'left' : 'right'; // if dist traveled is negative, it indicates left swipe 
      } 
      else if (Math.abs(distY) >= threshold && Math.abs(distX) <= restraint){ // 2nd condition for vertical swipe met 
       swipedir = (distY < 0)? 'up' : 'down'; // if dist traveled is negative, it indicates up swipe 
      }; 
     }; 
     handleswipe(e,swipedir); 
     return true; 
    }, false); 
}, 

は、私はタッチムーブ機能でタッチスワイプ度の角度を取得(およびデフォルトを殺すためにしようとしていますスワイプが一定の度数を超えている場合はスクロールします)。しかし、それは約80の数字を出力し続けます。私はどのようにスワイプします。ここで何が間違っていますか?

私はイメージのスワイプにこれを使用しています。私はスワイプして、同時にスクロールしてスワイプさせたくありません。

多分私はこれについてすべて間違っているつもりです。

ありがとうございました。

答えて

1

Math.atan(x) [1]の機能は、x以上yとの比である必要があり、あなたのケースでは、1つの引数をとります:

rads = Math.atan(distY/distX);

違いを確認するのは難しいことが、あなたの最初のでありますコードは/ではなく,です。私はこの変更であなたのコードを実行し、それは働いた。 Math.atan2(y,x)には2つの引数があります。

[1] https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math/atan

関連する問題