Javascript 如何在p5.js中设置rect的样式

我在p5.js中有一个

rect（）

：

rect(10, 10, 10, 10);

我想把它设计成这样：

box-shadow: 20px 20px 50px #00d2c6,
-30px -30px 60px #00ffff;

然而，我不确定如何做到这一点。检查，我似乎应该能够简单地使用：

let testSquare = rect(10, 10, 10, 10);
testSquare.style('box-shadow: 20px 20px 50px #00d2c6,');
testSquare.style('-30px -30px 60px #00ffff;') ;

但是，在运行此操作时，我遇到以下错误：

platformer.js:7 
Uncaught TypeError: testSquare.style is not a function
    at draw (platformer.js:7)
    at p5.redraw (p5.js:49679)
    at p5.<anonymous> (p5.js:44342)
    at p5.<anonymous> (p5.js:44236)
    at new p5 (p5.js:44525)
    at _globalInit (p5.js:46308)

platformer.js:7
未捕获的TypeError:testSquare.style不是函数
抽签时（platformer.js:7）
在p5.redraw（p5.js:49679）
在p5。（p5.js:44342）
在p5。（p5.js:44236）
在新的p5（p5.js:44525）
at_globalInit（p5.js:46308）

---

有人知道这可能是什么原因以及如何修复吗？

您不能更改“样式”。只是在画布上画一个形状。此函数仅更改某些像素的颜色，但不生成任何（DOM）对象。将此函数视为在位图图像上绘制。

您不能更改“样式”。只是在画布上画一个形状。此函数仅更改某些像素的颜色，但不生成任何（DOM）对象。将此函数视为在位图图像上绘制。

我同意这些评论，您不能更改样式。虽然还有其他方法，但它们可能不会给出完全相同的结果

绘制一个稍微偏移的黑色矩形（取决于灯光的位置）

在其上的原始位置绘制原始矩形

如下所示（从左上角射出的灯光）：

---

我同意你的意见，你不能改变风格。虽然还有其他方法，但它们可能不会给出完全相同的结果

绘制一个稍微偏移的黑色矩形（取决于灯光的位置）

在其上的原始位置绘制原始矩形

如下所示（从左上角射出的灯光）：

---

文档中不太清楚，但是

Rect

s不是

DOM

元素（它们是在画布上绘制的

p5

模型），因此不能使用css设置样式。您可以使用css设置

div

的样式，而

div

s或多或少是

DOM

rect

s。文档中不太清楚，但是

rect

s不是

DOM

元素（它们是画布上绘制的

p5

模型），因此不能使用css设置样式。不过，您可以使用css设置

div

的样式，而

div

s或多或少是

DOM

rect

s。

fill(100,100,100); //A kind of darkish grey
rect(10 + 5, 10 + 5, 10, 10);  //Slight offset
fill(original colour);
rect(10,10,10,10);