Typescript + p5js

import p5 from "p5";

export class p5Main{


    public _width       :number = 512;
    public _height      :number = 512;
    private _p5         :p5;
    private _dom        :HTMLElement;
    private _bg         :number=0;
    private _callback   :()=>void;

    constructor(){
      
    }

    init(callback:()=>void){

        this._callback=callback;

        new p5((p: p5)=>{
            /** 初期化処理 */
            p.setup = ()=>{
                this.setUp();                
            }
            /** フレームごとの描画処理 */
            p.draw = ()=> {
                this.draw();
            }

            this._p5 = p;
        });
        
    }


    setUp(){
        let r = this._p5.createCanvas(
            512,
            512
        );
        r.id('p5canvas');
        this._p5.frameRate(30);
        this._p5.noSmooth();
        
    }


    reset(){
        
    }

    draw(){
        this._p5.fill(Math.random()*255);
        this._p5.rect(
            Math.random()*512,
            Math.random()*512,
            Math.random()*512,
            Math.random()*512
        )
       
    }

}

注意

new p5()のところで

this.p5instance = new p5((p: p5)=>{

});

と書いたらundefinedになることがあった。そこで以下のように。

new p5((p: p5)=>{
this.p5instance = p;
});