Responsive canvas without stretching shape

oxxi

How can I have the background canvas take the full browser window size and not stretch the box depending on window re-size?

var img; var theta = 0;

function setup() { createCanvas(windowWidth, windowHeight, WEBGL);

img = loadImage("https://pbs.twimg.com/profile_images/502135348663578624/-oslcYof.png"); }

function draw() { background(25);

push(); rotateZ(theta * 0.1); rotateX(theta * 0.1); rotateY(theta * 0.1); texture(img); box(180, 180, 180); pop(); theta += 0.11;

}

function windowResized() { resizeCanvas(windowWidth, windowHeight); }

GoToLoop

https://forum.Processing.org/two/discussion/8045/how-to-format-code-and-text
https://forum.Processing.org/two/discussions/tagged?Tag=windowresized()

oxxi

Code is now formatted and your windowresized link didn't really help my issue.

var img; 
var theta = 0;

function setup() { 

  createCanvas(windowWidth, windowHeight, WEBGL);

  img = loadImage("https"+"://pbs.twimg.com/profile_images/502135348663578624/-oslcYof.png"); 
}

function draw() { 

  background(25);

  push(); 
  rotateZ(theta * 0.1); 
  rotateX(theta * 0.1); 
  rotateY(theta * 0.1); 
  texture(img); 
  box(180, 180, 180);    
  pop(); 
  theta += 0.11;
}

function windowResized() { 
   resizeCanvas(windowWidth, windowHeight); 
}