p5.js:WebGL

code:webgl.js

function setup(){

createCanvas(windowWidth, windowHeight, WEBGL);

}

function draw(){

background(200);

rotateX(frameCount * 0.01);

rotateY(frameCount * 0.01);

box(200, 200, 200);

}

code:sketch.js

const sketch = p => {

p.setup = () => {

p.createCanvas(400, 400, p.WEBGL);

}

p.draw = () => {

p.background(220);

p.rotateX(p.frameCount * 0.01);

p.rotateY(p.frameCount * 0.01);

p.rotateZ(p.frameCount * 0.01);

p.torus(150,20);

p.rotateZ(p.frameCount * 0.02);

p.rotateY(p.frameCount * 0.02);

p.torus(100,20);

p.rotateX(p.frameCount * 0.03);

p.torus(50,20);

}

}

new p5(sketch, 'editor');

code:sketchxx.js

const sketch = p => {

p.setup = () => {

p.createCanvas(400, 400, p.WEBGL);

}

p.draw = () => {

p.background(220);

p.rotateX(p.frameCount * 0.01);

p.rotateY(p.frameCount * 0.01);

p.box(200, 200, 200);

}

}

new p5(sketch, 'editor');

https://img.shields.io/badge/p5.js-WebGL-ED225D.svg?logo=p5.js&style=for-the-badge