Using clear() correctly, Magic Leap Example

Zevensuy · May 31, 2019, 7:28pm

Hi all, I am working on some examples of using p5js with the Magic Leap One Headset. The Magic Leap comes built in with its own browser called Helios. One of the “tricks” that the browser can do is set basically a transparent body using a meta tag in the html.

This example is just a ball jumping around the screen.

github.com

zevenrodriguez/MagicleapExamples/blob/master/helios-p5js/sketch.js

var posX = 0;
var posY = 0;

var xDir = false;
var yDir = false;

var img;

function setup() {
  // put setup code here
  createCanvas(windowWidth,windowHeight);
  posX = random(width);
  posY = random(height);
}

function draw() {
  // put drawing code here
  clear();
  //background(255,0);
  fill(255,0,0);

This file has been truncated. show original

My current example works using the clear tag. I tried using the background with an alpha, but it left a trail of ellipses on the screen. I also tried to see if a png with an alpha would work, but it did not.

My question, am I using the clear function correctly/in its intended use. Is there a more efficient/faster method or way that I am over looking.

Thanks all

Chrisir · June 2, 2019, 6:04am

background(255);

Maybe?