Cómo calcular el ángulo de rotación del panel más cercano en el carrusel

Question

Tengo este carrusel que gira en 3D con el uso de -webkit-transform: rotateX(rotation in deg);. Tiene 10 paneles, lo que significa que cada 36deg hay un panel centrado.

Ahora, estoy tratando de crear un efecto "complemento" llamado en un evento touchend, estableciendo el panel más cercano centrado plano en el frente.

Mi problema es que, a partir de un valor de rotación arbitrario, digamos -1820 grados, ¿cómo puedo calcular qué panel, o mejor dicho, en qué medida es el panel más cercano?

Espero que tenga sentido. Una sugerencia sería muy apreciada.

Answer 1

Si respondí bien a su pregunta, debe usar el operador de módulo, que es básicamente el resto de la división, que según wg3schools se define como el signo de porcentaje%.

Ejemplo: de 5% 2 es igual a 1

En su caso se podría hacer semthing como

var initialAngle= getAngle(); //let's say it's 1820 
var closestPane= initialAngle%36; //which gives you 20. 

Así que ya saben la posición de su resepct ángulo a ángulo anterior (deja llamada A). Si realiza una operación simple adicional (36-20 = 16) también conoce la distancia desde el siguiente ángulo.

angle before ---- A ---- angle after 
      20deg 16deg 

Esperanza esto ayuda

Answer 2

Esto es lo que terminó con base a la entrada de Danele B ..

function snapToAngle(Angle) { 
var deltaAngle = Math.abs(Angle)%36; 

    if (Angle >= 0) { 
     (deltaAngle <= 18) ? Angle -= deltaAngle : Angle+=36-deltaAngle; 
    } else { 
     (deltaAngle <= 18) ? Angle += deltaAngle : Angle -= 36-deltaAngle; 
    } 
return Angle; 
} 

Estoy seguro de que hay una manera más ordenada de escribir esto, pero parece trabaje ..