Scale canvas in web editor

p5.js
1

Hi! I have a big canvas which doesn’t fit in my screen with editor. Can I somehow change its scale so I could see it whole without zooming out the whole page?

2

are you GUYS (and gals) CRAZY???
can you not help a person with a problem???

btw struggling with the same issue need some help

3

Yes. The first command in draw can be scale()

Please do not be rude! The people on this forum are volunteers – many have jobs and busy lives. They respond when they can.

1 Like
4

sorry im sorry :heart::heart::heart::heart::heart::heart::heart::heart::heart::heart::heart::heart:

1 Like
5

Hi Jeremy! Looks like it doesn’t work the way I want it to work.

My issue is I have a 1600x1600 canvas and I want it to appear on screen as for example 600x600 so I could see it whole without scrolling. Currently as I can tell it is not possible unless you use createGraphics with the size you want and then place it to the smaller canvas as an image. But it is not super convenient.

6

Hello,

This discussion is related:

I use the Processing editor for P5.js and can comfortably edit the sketch (font and size of my choosing) and launch it in a separate monitor in a browser (can zoom as required).

``:)`

1 Like
7

If you express your sketch elements in units relative to width and height then you can just modify createCanvas() and your sketch will scale anytime you modify createCanvas.

function setup() {
  createCanvas(600, 600);
}

function draw() {
  background(220);
  ellipse(width/2, height/2, width*.75, height*.75);
}
8

Wow thank you I didn’t know I could use processing editor for p5.js it is super cool!