Función p5.js map()

La función map() en p5.js se usa para normalizar un número que tiene un rango de min1 a max1 en un rango de min2 a max2.

La normalización es muy útil en p5.js si está escalando sus elementos. Porque como sabemos, la normalización se ocupa de todas las proporciones en la escala, por lo que obtenemos una escala completamente equilibrada.

No solo el escalado, sino también la normalización de cualquier operación de transformación es muy útil.

Sintaxis:

map(value, start1, stop1, start2, stop2, [withinBounds])

Parámetros: esta función acepta seis parámetros, como se mencionó anteriormente y se describe a continuación:

  • valor: El valor que desea normalizar.
  • min1: Valor mínimo del rango actual del valor.
  • max1: Valor máximo del rango actual del valor.
  • min2: Valor mínimo del rango objetivo del valor.
  • max2: valor máximo del rango objetivo del valor.
  • withinBounds (opcional): esto restringe el valor normalizado del valor en el rango de [min2, max2].

Ejemplo 1: Dentro de los límites es falso de forma predeterminada.

Javascript

function setup() {
    noLoop();
}
  
function draw() {
  
    background(220);
  
    // Assume value has range [0, 100]
    let value = 50;
  
    // We want to convert value 
    // in range of [0, 50]
    let newValue = map(value, 0, 100, 0, 50);
  
    console.log(newValue);
}

Producción:

25

Ejemplo 2: observe cómo withinBounds limita el rango de valor

Javascript

function setup() {
    noLoop();
}
  
function draw() {
  
    background(204);
  
    // Value has a range[0, 100]
    let value = 150;
  
    // We are mapping it in range of [0, 50]
    let newValue1 = map(value, 0, 100, 0, 50);
  
    console.log(newValue1);
  
    // Notice the last parameter is true
    // we are mapping it in range of [0, 50]
    let newValue2 = map(value, 0, 100, 0, 50, true);
  
    console.log(newValue2);
}

Producción:

75
50

Publicación traducida automáticamente

Artículo escrito por pratikraut0000 y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *