createGraphics()

Creates an additional canvas that can be overlaid on any other existing canvases

Example

def setup():
  ...
  global canvas2
  canvas2 = createGraphics(200, 200)
  
def draw():
  ...
  
  canvas2.background(112, 88, 255)
  canvas2.fill(176, 235, 51)
  canvas2.circle(100,100,100)
  
  image(canvas2, 100, 100)

Syntax

createGraphics(w, h)

Inputs	Description
w	width of the off-screen buffer
h	height of the off-screen buffer

Description

the createGraphics() function is used to create an off-screen graphics buffer that can be manipulated and then displayed on the main canvas.

The buffer is displayed on the main canvas using image(buffer, x, y).

Using createGraphics() allows you to create complex graphics that can be drawn off-screen before being displayed on the main canvas. This is particularly useful when you want to create more complex animations or drawings that would be difficult to create directly on the main canvas.

Example:

Below program uses one background under setup() and one under draw()

Example full code

def setup():
  createCanvas(400,400)
  frameRate(7)
  global buffer
  buffer = createGraphics(200, 200)
  background(255, 79, 132)
  
def draw():
  noStroke()
  fill(255, 164, 28,100)
  circle(random(width),random(height),50)
  # drawTickAxes()
  buffer.background(112, 88, 255)
  buffer.noStroke()
  # buffer.drawTickAxes()
  buffer.fill(176, 235, 51)
  buffer.circle(random(20,190),random(20,190),50)
  image(buffer, 100, 100)

Find these documents helpful? Let the people who made them help your child learn to code at Strivemath!

We'd love to hear your Feedback/Comments here.