时间戳

首页 > 解决方案 > P5.js - 在实例模式下使用 erase() 返回“p.erase 不是函数”

javascript - P5.js - 在实例模式下使用 erase() 返回“p.erase 不是函数”

问题描述

我目前在实例模式下使用 p5.js，并且我正在使用由 p5 对象的绘制函数调用的以下代码块。p5 对象的绘制函数将 p5 对象传递p给下面的绘制函数。

//Snippet 1
this.draw = function(p){
    ...    

    p.push();
    p.noStroke();
    tempColour = someFunc(); //returns color object
    p.fill(tempColour);
    p.ellipse(p.mouseX, p.mouseY, diameter);
    p.pop();
    ...
}

上面的代码按预期工作，没有异常。现在，只要我使用 erase() 函数（见下文）TypeError: p.erase is not a function. (In 'p.erase()', 'p.erase' is undefined)，控制台就会抛出异常。

//Snippet 2
this.draw = function(p){
    ...    

    p.push();
    
    //newly inserted start
    p.erase();
    p.ellipse(p.mouseX, p.mouseY, diameter);
    p.noErase();
    //newly inserted end
    
    p.noStroke();
    tempColour = someFunc(); //returns color object
    p.fill(tempColour);
    p.ellipse(p.mouseX, p.mouseY, diameter);
    p.pop();
    ...
}

我曾尝试在调用 push() 之前使用 erase() 函数，但不幸的是结果是一样的。我还检查了我没有意外地在 p5 对象上重新分配/重新声明擦除。我正在努力理解 erase() 与 fill() 或 stroke() 或任何其他 p5 函数有何不同，以及它如何导致异常。

我的目标： 我传递给 ellipse 函数的颜色可能包含小于 255 的 alpha 值。片段 1中的代码当前将椭圆绘制在彼此之上，最终导致完全不透明的椭圆（如果 mouseX 和 mouseY 保持不变）。我试图用 Snippet 2 实现的是椭圆函数绘制我传递给它的确切颜色，而不会增加不透明度。

任何帮助深表感谢

标签： javascriptp5.js

解决方案

问题解决了，我使用的是旧版本的 p5 库。

推荐阅读