p5：调整画布大小，以固定的起始宽度/高度？

问题描述

我正在使用p5和tensorflow玩耍。我创建了一个“面部过滤器”，使用张量流跟踪鼻子和耳朵，并将图像附加到这些位置。例如，如果我的滤脸器是“小丑”，鼻子将变成红色鼻子，耳朵将变成小丑耳朵。

一切正常，但是现在我正在尝试使画布具有响应性。

我的画布尺寸为createCanvas(1200,768)，位于CSS中。

如何根据浏览器的宽度使画布响应？我只是不确定如何在windowResized函数中设置代码。

function windowResized(){
  resizeCanvas(width?,height?);
}

感谢我能得到的任何输入。

解决方法

p5.js提供系统变量windowWidth和windowHeight，width和height。 width和height存储画布的当前大小，而windowWidth和windowHeight存储内部窗口的宽度。
在windowResized()中使用windowWidth和windowHeight来调整画布的大小：

function windowResized() {
  resizeCanvas(windowWidth,windowHeight);
}

在创建画布时也可以使用变量：

function setup() {
  createCanvas(windowWidth,windowHeight);
}