リファレンス createCanvas()

createCanvas()

ウェブページにキャンバス要素を作成します。

createCanvas()はスケッチのメインの描画キャンバスを作成します。 これはsetup()の最初に一度だけ呼び出すべきです。 createCanvas()を複数回呼び出すと予期せぬ動作を引き起こします。

最初の2つのパラメータ、widthheightはオプションです。これらは キャンバスの寸法とwidthおよび heightシステム変数の値を設定します。 例えば、createCanvas(900, 500)を呼び出すと、900×500ピクセルの キャンバスが作成されます。デフォルトでは、widthheightは どちらも100です。

3番目のパラメータもオプションです。P2DまたはWEBGLの いずれかの定数が渡された場合(例:createCanvas(900, 500, WEBGL))、 スケッチのレンダリングモードが設定されます。既存の HTMLCanvasElement が渡された場合(例:createCanvas(900, 500, myCanvas))、 それがスケッチによって使用されます。

4番目のパラメータもオプションです。既存の HTMLCanvasElement が渡された場合(例:createCanvas(900, 500, WEBGL, myCanvas))、 それがスケッチによって使用されます。

注意:WebGLモードでは、ブラウザがサポートしている場合、キャンバスはWebGL2コンテキストを 使用します。使用されているバージョンを確認するにはwebglVersion システム変数をチェックするか、setAttributes({ version: 1 })を呼び出して WebGL1コンテキストを作成してください。

実例

シンタックス

createCanvas([width], [height], [renderer], [canvas])
createCanvas([width], [height], [canvas])

パラメーター

width
Number:

キャンバスの幅。デフォルトは100です。

height
Number:

キャンバスの高さ。デフォルトは100です。

renderer
Constant:

P2DまたはWEBGL。デフォルトはP2Dです。

canvas
HTMLCanvasElement:

スケッチに使用される既存のキャンバス要素。

リターン

p5.Renderer: キャンバスを保持する新しい`p5.Renderer`。
Notice any errors or typos? Please let us know. Please feel free to edit src/core/rendering.js and open a pull request!

関連するリファレンス