Adjust pixels array but don't render on screen p5 js

p5.js Coding Questions
1

Hello,

I want to train a neural network, which will use the pixels array as input but I don’t want it to constantly render it while I am training it. Is it possible to not render any of the lines and vertices I drew but let it keep adjusting the pixels array? I need the pixels array. I’m not sure if this is the right place to ask this, perhaps it has more to do with javascript than p5, but thought i’d ask here first

1 Like
2

Can you create a PGraphics or PImage and use that object’s pixels array instead? Then there would be no need to display it.

2 Likes
3

note that for p5.js this would be a p5.image, not a (java) PImage

2 Likes
4

Thanks for the inputs! So, creating a P5.image, I would be creating a new “image” where I can set the background color and draw things like image.line(x,y) (let’s just say i called the p5.image object “image”) and it will just do that “in the background” without rendering anything and when I call its own pixels array I will be able to see the background color and this line that I drew? That’s pretty much what I need. Also, it will be more efficient right? I mean, it will take shorter time to draw a line let’s say because it won’t actually have to render anything, but rather just change the values in the pixels array

Ah, well guess I can just try it later today when I have time ahha

1 Like
5

Ok, I just realized I can’t draw a line on an image, I can only adjust the individual pixels. I need to be able to draw a line, also I use curveVertex. I wanna create like a canvas object where I can interact just as I would the rendered canvas, but this one should just update the pixels array accordingly and not render anything on the screen
edit: And my lines are not straight and not 1 pixel wide, I cant just draw a line manually by adjusting the pixels array myself

6

Then instead of a p5.Image, use createGraphics to create a p5.Renderer. That gets you the canvas methods as methods of the renderer object.

Creates and returns a new p5.Renderer object. Use this class if you need to draw into an off-screen graphics buffer. reference | p5.js

1 Like