CreateGraphics1

Link here. Drag the mouse over the canvas. On the phone, click the link and then move the finger over the canvas.

The code:

var x = 200;
var y = 200;
var extraCanvas;



function setup() {
  createCanvas(400, 400);
  extraCanvas = createGraphics(400, 400)
  //extraCanvas.background(255, 0, 0)
  extraCanvas.clear()
  background(0)
}

function draw() {
  //image(extraCanvas, 0, 0)
  //no trails!!!!
  background(0);
  x += random(-5, 5)
  y += random(-5, 5)
  fill(255, 200)
  stroke(255)
  rectMode(CENTER)
  rect(x, y, 20, 20)
  
  
  //trails!!!!
  if(mouseIsPressed){
    extraCanvas.fill(255, 150)
    extraCanvas.noStroke()
    extraCanvas.ellipse(mouseX, mouseY, 50, 50)
  }
  image(extraCanvas, 0, 0)
}






Leave a Reply