2016-06-14 13 views
0

で正確な時間の長さを取得します。 ここに音楽がないものがありますが、ノートパソコンのタッチパッドをタップしてデータを取得できます。しかし、データは十分正確ではないようです。たとえば、少なくとも200ミリ秒です。私たちが安定してそれをタップすると、それはかなり変化する結果をもたらしました。誰かが私にそれを改善する方法を教えてくれる?は、どのように私は音楽と人々のタップ周波数を取得し、テスト用のコードにしようとしていますHTML

<!DOCTYPE html> 
<html onclick="myFunction()"> 
    <head> 
    <link rel="stylesheet" type="text/css" href="main.css"> 
    <title>Click</title> 
    </head> 
    <body> 
    <script> 
    function myFunction() { 
     inner = document.getElementById("time").innerHTML; 
     if(inner === ""){ 
     document.getElementById("time").innerHTML = Date(); 
     } 
     else{ 
     var curr = new Date(); 
     console.log(curr); 
     var past = new Date(inner); 
     console.log(inner); 
     console.log(past); 
     var gap = curr.getTime() - past.getTime(); 
     console.log(gap); 
     document.getElementById("time").innerHTML = curr; 
     var gapText = document.getElementById("gap").innerHTML; 
     gapText = gapText + gap + "<br>"; 
     document.getElementById("gap").innerHTML = gapText; 
     } 
    } 
    </script> 
    <div><text>The current time is </text><text id="time"></text></div> 
    <div><text>The tap durations are (milliseconds):</text></div> 
    <div><text id="gap"></text></div> 

    </body> 
</html> 
+0

私はこれを試して、動作しているようです。ところで、毎回要素の内容を解析するのではなく、変数を使うことができます。 –

+0

ユーザーが使用しているハードウェアのタッチパッドに大きく依存するようです。 –

答えて

0

は、私はまた、ChromeでのMacBook Proの実行中に、あなたのコードとの時間差の大きな変数を得た:

は、ここに私のコードです。その後、私はあなたのコードをリファクタリングし、一般的に〜30ms以内に、大幅に優れたパフォーマンスを得ました。 Matthew Herbst氏の言うとおり、ハードウェアが重要な役割を果たすだろうが、パフォーマンスを改善する方法はあると思う。私のリファクタリングされたコードは以下の通りですが、いくつかの観察:

  1. すべてのconsole.logを取り出してください。パフォーマンスにはあまり影響しませんが、ミリ秒単位で作業することを心配している場合は、パフォーマンスが低下します。あなたは絶対にしなければならないとき
  2. だけDOMと対話します。たとえば、現在の値を計算するために、DOMに最後のタイムスタンプを取得することになります。変数に保存すると、より速くなります。

ここで私は、それはあなたのために働くどれだけ知っている、私のコードです。お役に立てれば。

<!DOCTYPE html> 
<html onclick="myFunction()"> 
    <head> 
    <link rel="stylesheet" type="text/css" href="main.css"> 
    <title>Click</title> 
    </head> 
    <body> 
    <script> 
    var newTime; 
    function myFunction() { 

     if (newTime === undefined){ 
     newTime = new Date(); 
     // This will only run once 
     document.getElementById("time").innerHTML = newTime; 
     } 
     else{ 
     // Here I'm not getting values from the DOM. I'm saving the value as a variable. 
     var oldTime = newTime; 
     newTime = new Date(); 
     var gap = newTime.getTime() - oldTime.getTime(); 
     var gapText = gap + "<br>"; 
     document.getElementById("gap").innerHTML = gapText; 
     } 
    } 
    </script> 
    <div><text>The current time is </text><text id="time"></text></div> 
    <div><text>The tap durations are (milliseconds):</text></div> 
    <div><text id="gap"></text></div> 

    </body> 
</html> 
+0

The current time is
The tap durations are (milliseconds):

+0

だから、それは今働いていますか? – Paul

+0

はい、ありがとうございますが、私はまだそれがどれほど正確であるかをテストする必要があります –

関連する問題