p5.j​​s将纹理加载到2D椭圆上

Question

我希望用P5.js制作云粒子系统。我打算用PNG云纹理填充许多省略号。然后使用这些省略号对系统进行编程。

不幸的是，当我尝试在p5.js中应用纹理时出现错误

未捕获的TypeError：this._renderer._getShader不是函数

var cloudImg;

//P5 Setup
function setup(){
    createCanvas(1500, 750);
    background('rgba(0, 0, 0, 0.3)');
    cloudImg = loadImage("cloud100.png"),
    numParts = 80,
    diam = 100;
}


//Render
function draw(){
    background(0);
    translate(mouseX, mouseY);
    beginShape();
    texture(cloudImg);
    var theta = TWO_PI / numParts;
    for (i=0; i<numParts; i++) {
    var angle = theta * i,
        x = cos(angle),
        y = sin(angle);
    vertex(x * diam, y * diam, (x+1)/2, (y+1)/2);
    }
    endShape();
}  

Answer 1

我认为texture()需要webgl作为渲染。

尝试createCanvas(1500, 750, WEBGL);

点击here查看texture()的官方文档。