Using Images In Browser with ProcessingJs

p5.js Beginners
1

So I am struggling a lot with processingjs. Not sure why but I just can’t figure out how to get my processing code properly into an html file. I have two problems right now that I need help with.

  1. I don’t know how to load images in with processingjs. I have /* @pjs preload=“image1.png image2.png image3.png”; crisp=“true”; */ but I don’t think that this is right. I’m assuming these images must be in the same folder as the html file or something like that. Not really sure which is why I’m asking.

Secondly, I am confused on how to have multiple pde’s. Previously, I have just copy and pasted the classes directly into the html file, but that’s obviously not the best idea. I have tried looking at processingjs’s reference but it is confusing me more. Here is the html I have so far (I couldn’t figure out how to paste code so here is pastebin):

2
1 Like
3

http://Studio.ProcessingTogether.com/sp/pad/export/ro.9bTfM49wCIJza

4

@GoToLoop Can you please provide a brief summary when you post links?

1 Like
5

@CrispyCabot Can you please post a MCVE that shows us exactly what you’re stuck on? Just a simple sketch that shows a single image, or a simple sketch that uses two PDE files would be very helpful. What is your directory structure? How are you deploying your files? What errors are you seeing?