p5.js |宽度可变

p5.js 中的width变量是一个系统变量，用于存储绘图画布的宽度。一旦代码被执行，这个值就会被createCanvas()函数的第一个参数自动初始化。

句法：

width

参数：此函数不接受任何参数。

下面的程序说明了 p5.js 中的宽度变量：
示例 1：

function setup() {
    
    //create Canvas of size 380*80  
    createCanvas(380, 80);
}
  
function draw() {
    
    // set background color
    background(220);
    
    // set text size 
    textSize(16);
    
    // set the text alignment 
    textAlign(CENTER);
    
    //set the fill color
    fill(color('Green'));
    
    //use of width variable
    text("Width of Canvas is : "
         + width, 180, 50);
}

输出：

示例 2：

function setup() {
    
    //create Canvas of size 380*80 
    width = windowWidth;
    createCanvas(width, 80);
}
  
function draw() {
    // set background color
    background(220);
    
    // set text size 
    textSize(16);
    
    // set the text alignment 
    textAlign(CENTER);
    
    //set the fill color
    fill(color('Green'));
    
    //use of width variable
    text("Width of Canvas is equal to windowWidth i.e. : "
         + width, 180, 50);
}

输出：

参考： https://p5js.org/reference/#/p5/width