p5.js에서 복수개의 canvas함수를 그리는 법

최근 p5.js를 공부하면서 복수개의 캔버스를 그리는 법에 대해 생각해 보았다.

처음에는 쉬울거라 생각했는데, 그 방법이 잘 안 나왔고,

찾았어도 복잡한 경우가 많았다.

결국 이틀만에 해결방법을 찾았다.

다행이도 p5.js는 이러한 상황에 대처할 수 있는 함수를 제공해주고 있었다.

바로 그 함수는 createGraphics() 이다.

해당함수에 대한 자세한 설명은 아래의 링크에 나와있다.

https://p5js.org/reference/#/p5/createGraphics

그리고 마지막에 image() 함수를 빼먹지 말아야 한다.

솔직히 이 함수를 왜 쓰는지 모르겠지만 없애니 렌더링이 되지 않았다.