Processing Js background image....not working

ashwinj92

Processing Js background image....not working

in Processing with Other Languages • 5 months ago

The problem am facing is that when i run the example Background image the example runs properly on Chrome and firefox
but when i copy that program and save it in Processing sketch folder with an other name say "example1" it doesnt work in Javascript mode but works in Javamode of processing ide

version 2.08b Note:i have placed the image in the folder named "data" and i see that the image gets imported once i run the program into the web-export folder but the problem is that background image is not set

please tell me if i am missing any step

the below is the code which i tried

Copy code

/**
* Background Image.
*
* This example presents the fastest way to load a background image
* into Processing. To load an image as the background, it must be
* the same width and height as the program.
*/

// The next line is needed if running in JavaScript Mode with Processing.js
/* @pjs preload="helloworld.jpg"; */

PImage bg;
int y;

void setup() {
size(621, 401);// the changes i made to match the image size

bg = loadImage("helloworld.jpg");
}

void draw() {
background(bg,2,2);

stroke(226, 204, 0);
line(0, y, width, y);

y++;
if (y > height) {
    y = 0;
}
}

Replies(4)

benj.n.su..

Re: Processing Js background image....not working

5 months ago

can you say which example you are referring to using the following method:

FILE>>EXAMPLES>>BASICS>>ETC>>ETC

benj.n.su..

Re: Processing Js background image....not working

5 months ago

never mind. seems like you got it worked out: https://forum.processing.org/topic/problem-loading-images-in-chrome-firefox-in-processing-js

ashwinj92

Re: Processing Js background image....not working

5 months ago

hi benj.n

Thank you for your reply

The method in( https://forum.processing.org/topic/problem-loading-images-in-chrome-firefox-in-processing-js) this thread used to work and i had asked this 3 months ago if u notice and .....it used to work.

Now the problem am facing is that.....the examples in FILE>>EXAMPLES>>BASICS>>ETC>>ETC when i run them they are working fine

But when i copy this example code say(background image example in my case) code and save as another sketch in the processing sketch directory(n my case slideshow1) and then run by placing the images in the "data folder" inside the folder where this sketch resides see the below image to get a clear picture ..

so that this sketch i saved can access the images inside "data" folder

as described in the code which i have pasted above is not working,But it used to work now all of a sudden after some gap of one month i ran some old codes which used to work then are not working ( Processing.js codes which relate to image loading only ).

So im not sure whats wrong...so wanted to know if i was doing something wrongly. or missing some step

benj.n.su..

Re: Processing Js background image....not working

5 months ago

unfortunately i am not experiencing that problem. below i have included the steps that i took to try and replicate the problem based on the process you described. let me know how they match up to your own.

One imediate differences I see is that in my sketch folder, I have a file called sketch.properties which you not. That might be because it is hidden on Windows, or not necessary (I am on a mac). Also make sure your sketch is saved to the equivalent of Documents>>Processing. Tell me: What are the contents of the data folder and the web export folders?

METHOD A:

1) Open the BackgroundImage example.

2) Select all code in the example and copy it.

3) Open a new pde and paste the code into it.

4) Save the new pde as slideshow1

5) Goto Documents>>Processing>>slideshow1

6) Create folder called data

7) Go to the data folder of the original example and copy moonwalk.jpg

8) Go to Documents>>Processing>>slideshow1>>data and paste moonwalk.jpg

9) Open slideshow1.pde

10) Run slideshow1.pde

11) Success! (for me).

METHOD B:

1) Open the BackgroundImage example.

2) Save as slideshow1

3) Open and run slideshow1

4) Success!

Top Reply