4. 画布

4.5. 画布渲染环境


 drawingContext

示例:

▶️运行示例代码



function setup(){
  drawingContext.shadowOffsetX = 5;
  drawingContext.shadowOffsetY = -5;
  drawingContext.shadowBlur = 10;
  drawingContext.shadowColor = '#000000';
  background('#c8c8c8');
  ellipse(((width) / 2),((height) / 2),50,50);
};

舞台区显示的画布内容如下:


Description

The p5.js API provides a lot of functionality for creating graphics, but there is some native HTML5 Canvas functionality that is not exposed by p5. You can still call it directly using the variable drawingContext, as in the example shown. This is the equivalent of calling canvas.getContext('2d'); or canvas.getContext('webgl');. See this reference for the native canvas API for possible drawing functions you can call.

p5.js的API提供了很多创建图形的函数,但是没有包含一些原生的HTML5画布函数,这些函数仍然可以通过直接使用变量来调用drawingContext,具体调用函数的时候请参考原生HTML5的画布API。

Syntax

drawingContext