2016-12-30 48 views
0

我一直在研究這個代碼筆項目涉及到一個紡車。我想知道如何檢測指針指向哪個段。以下是javascript。我想我必須按照我所擁有的細分數量來劃分360度。預先感謝並對我的英語不好。我來自阿根廷。紡輪分段檢測系統

http://codepen.io/AndreCortellini/pen/vERwmL

//set default degree (360*5) 
var degree = 1800; 
//number of clicks = 0 
var clicks = 0; 

$(document).ready(function(){ 

    /*WHEEL SPIN FUNCTION*/ 
    $('#spin').click(function(){ 

     //add 1 every click 
     clicks ++; 

     /*multiply the degree by number of clicks 
     generate random number between 1 - 360, 
    then add to the new degree*/ 
     var newDegree = degree*clicks; 
     var extraDegree = Math.floor(Math.random() * (360 - 1 + 1)) + 1; 
     totalDegree = newDegree+extraDegree; 

     /*let's make the spin btn to tilt every 
     time the edge of the section hits 
     the indicator*/ 
     $('#wheel .sec').each(function(){ 
      var t = $(this); 
      var noY = 0; 

      var c = 0; 
      var n = 700;  
      var interval = setInterval(function() { 
       c++;     
       if (c === n) { 
        clearInterval(interval);     
       } 

       var aoY = t.offset().top; 
       $("#txt").html(aoY); 
       console.log(aoY); 

       /*23.7 is the minumum offset number that 
       each section can get, in a 30 angle degree. 
       So, if the offset reaches 23.7, then we know 
       that it has a 30 degree angle and therefore, 
       exactly aligned with the spin btn*/ 
       if(aoY < 23.89){ 
        console.log('<<<<<<<<'); 
        $('#spin').addClass('spin'); 
        setTimeout(function() { 
         $('#spin').removeClass('spin'); 
        }, 100);  
       } 
      }, 10); 

      $('#inner-wheel').css({ 
       'transform' : 'rotate(' + totalDegree + 'deg)'   
      }); 

      noY = t.offset().top; 

     }); 
    }); 



});//DOCUMENT READY 

回答

0

我們需要先找到在[0..360]度方面的學位,所以我們計算(totalDegree % 360)
然後,我們看到,[31..90]代表橙,[91..150]是黃色的,[151..210]是深藍色等等...
換句話說,

[31..90] => 1, orange 
[91..150] => 2, yellow 
[151..210] => 3, dark blue 
[211..270] => 4, blue 
[271..330] => 5, cyan 
[331..30] => 0, red 

這讓我想起了劃分和取整的:(deg/60)和圓形它爲整數。例如:

31/60 = 0.516 ~ 1 
32/60 = 0.533 ~ 1 
... 
45/60 = 0.750 ~ 1 
... 
88/60 = 1.466 ~ 1 
89/60 = 1.483 ~ 1 
90/60 = 1.500 ~ 2 
91/60 = 1.516 ~ 2 
... 

所以,你可以看到,該函數roundToInteger((deg/60))完全符合我們的宗旨!
在JavaScript方面:

var sector = ((totalDegree % 360)/60).toFixed(0); 
$("#txt").html(sector); 

http://codepen.io/mr_nameless/pen/yVmRxW

+0

你是個天才。沒有你,我無法做到。非常感謝您 –

+0

歡迎您:) –