p5.js map()用法及代码示例

p5.js 中的 map() 函数用于将 min1 到 max1 范围内的数字标准化，范围为 min2 到 max2。

如果您要缩放元素，规范化在 p5.js 中非常有用。因为我们知道归一化处理缩放中的所有比例，所以我们得到了一个完全平衡的缩放。

不仅是缩放，而且在任何转换操作中，标准化都非常有帮助。

用法:

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

参数：该函数接受上述和以下所述的六个参数：

value:要标准化的值。
分钟1：值当前范围的最小值。
最大1：值当前范围的最大值。
分钟2：值的目标范围的最小值。
最大2：值的目标范围的最大值。
范围内(可选)：这将 value 的归一化值限制在 [min2, max2] 范围内。

范例1：默认情况下，WithinBounds 为 false。

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);
}

输出：

范例2：注意insideBounds 如何约束值的范围

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);
}

输出：

75
50

相关用法

注：本文由纯净天空筛选整理自pratikraut0000大神的英文原创作品 p5.js map() Function。非经特殊声明，原始代码版权归原作者所有，本译文未经允许或授权，请勿转载或复制。