Hi!
I’m looking for any examples of Processing code (or any leads) that people here might know of for generating random gifs.
I’ve been googling, but haven’t made any progress. It seems there are examples in other languages, but not Processing.
Thank you for your help!
Brad
mnse
April 25, 2023, 4:50am
2
Hi @Jbwilke ,
Not really clear from your post what you are trying to achieve, but you can take a look here
(Chapter: EXPORTING A GIF ANIMATION)
http://extrapixel.github.io/gif-animation/
The library can be installed via Library manager from PDE.
Cheers
— mnse
Thank you so much, mnse!
I will explore this and see how much headway I can make before coming back to the forum for assistance.
Much obliged!
Brad
1 Like
Do you want the animation functionality of a gif or do you just mean image (like jpg)?
For a simple random image you can just place lines
randomly (or curves):
strokeWeight(random(0.6, 4.9));
stroke( random(256), random(256), random(256));
line(random(width), random (height),
random(width), random (height));
Use a for loop with random upper bound to make many lines
int upperbound=int(random(3, 444));
for (int i=0; i<upperbound; i++){
// the lines above
}
Then use save or saveFrame(); afterwards
See reference
Chrisir
1 Like
Chrisir,
Thank you very much! This is super helpful.
To answer your question, I shouldn’t have used the word “generate” in this context. What I really mean is “pull” pre-existing GIFs from the internet (perhaps from Giphy), display them for a period of time, and then pull another (and another) with a loop function.
I really appreciate your time and thoughtful response, Chrisir!
Brad
1 Like
Hello, again!
I made some progress and was hoping someone might be able to answer a question.
Here (attached) is the error message I get when I run the following code.
I’m wondering if you might know how I can get this to display a gif that the API is calling when it needs to recognize it as an image.
What I get now is a black screen with that error message. The result I’m hoping for is a gif to be playing in the frame.
Thank you very much!
Brad
svan
May 4, 2023, 8:03pm
7
Error message says the url string doesn’t end with a supported extension (in your case .gif).
Yes, I tried adding “.gif” at the end of the URL string and it said it didn’t exist.
I just tried another variation and received the following error:
I really appreciate your insight and time here. Thank you!
jafal
May 4, 2023, 8:20pm
9
Hi
PImage webImg;
void setup() {
size(400,400);
//String url = "https://processing.org/img/processing-web.png";
// Load image from a web server
webImg = loadImage("https://processing.org/img/processing-web.png");
}
void draw() {
background(0);
image(webImg, 0, 0);
}
Loads an image into a variable of type PImage. Four types of images ( .gif, .jpg, .tga, .png) images may be loaded. To load correctly, images must be located in the …
Thank you, jafal!
I think I am getting closer. End state is that I want to grab a random gif from Giphy when I run this code. Here’s where I’m at now:
Any suggestions or ideas? Thank you!
jafal
May 4, 2023, 8:47pm
11
Hi
Looks like you are trying to load gif array not one gif try to load one gif first to make sure that you can load from your site then manage how to load image array
can you please post your entire code as text here?
Thank you both. Here is the code:
PImage webImg;
void setup() {
size(400,400);
//String url = ““https://api.giphy.com/v1/gifs/random?api_key=hSekXK4WNlmjys5ycowpCnQzNlQValQG ””;
// Load image from a web server
webImg = loadImage(“https://api.giphy.com/v1/gifs/random?api_key=hSekXK4WNlmjys5ycowpCnQzNlQValQG ”);
}
void draw() {
background(0);
image(webImg, 0, 0);
}
as with most API it returns JSON code.
That’s how far I got
It doesn’t work.
I was able to retrieve an url.
When you try to load it, it fails.
But you can paste into your browser and see something.
I didn’t know what to do with
https://media4.giphy.com/media/J5SaaMHrloUFNVhmFp/giphy.webp?cid=87e71c3e6c3543ddb2ffacd41e906473df24e54d4912ecb7&ep=v1_gifs_random&rid=giphy.webp&ct=g
Full Code
( jsonArray1
ist json3 in fact )
see docs: Docs | GIPHY Developers
PImage webImg;
JSONObject json;
void setup() {
size(400, 400);
//String url = ““https://api.giphy.com/v1/gifs/random?api_key=hSekXK4WNlmjys5ycowpCnQzNlQValQG 1””;
json = loadJSONObject("https://api.giphy.com/v1/gifs/random?api_key=hSekXK4WNlmjys5ycowpCnQzNlQValQG");
println(json);
JSONObject json2 = json.getJSONObject("data");
println("=========================\n");
println(json2);
JSONObject jsonArray1 = json2.getJSONObject("images");
println("=========================\n");
println(jsonArray1);
JSONObject json4 = jsonArray1.getJSONObject("original");
println("=========================\n");
println(json4);
String name1=json4.getString("webp");
println(name1);
JSONObject json5 = loadJSONObject(name1);
println("=========================\n");
println(json5);
// Load image from a web server
webImg = loadImage(name1);
}
void draw() {
background(0);
image(webImg, 0, 0);
}
2 Likes
or check this out
// fullscreen image as a screen saver
// from https://discourse.processing.org/t/crop-multiple-images-to-any-quad-shape-and-place-them-side-by-side-filling-the-canvas/41326
int seed = int(random(1000));
PImage img;
int timer;
// -------------------------------------------------------------------------------
// Two core functions
void setup() {
// size(560, 800);
fullScreen();
background(0);
getRandomImage(width, height);
timer=millis();
}
void draw() {
background(0);
if (millis()-timer>3999) {
getRandomImage(width, height);
timer=millis();
}
image(img, 0, 0);
}
// -------------------------------------------------------------------------------
// Input functions
void mousePressed() {
getRandomImage(width, height);
}
// -------------------------------------------------------------------------------
// functions
void getRandomImage(float w, float h) {
String url = "https://picsum.photos/seed/"
+ seed
+ "/"
+ int(w)
+ "/"
+ int(h)
+ ".jpg";
// println(url);
seed += 1;
img = loadImage(url);
}
//
1 Like
Chrisir,
This is super helpful. I really appreciate you taking the time to play around with the code and see if you could get it to work. I’m going to keep working on it via trial and error, and I think this code you shared is a huge step in the right direction.
Thank you, again!
Brad
1 Like
svan
May 5, 2023, 6:59am
18
The following seems to work. All I did was add ‘.gif’ to the url.
PImage webImg;
void setup() {
size(400,400);
webImg = loadImage("https://tenor.com/view/gif-gif-19480288.gif");
}
void draw() {
background(0);
image(webImg, 0, 0);
}
1 Like
Yeah, that’s not an API. Different thing.
svan
May 5, 2023, 9:26am
20
I’m trying to figure out what he’s trying to do. Why does it have to be an API? What I’ve seen done is download the image(s), create your own animation and then upload that if that’s what you want to do with your work. There is also an animation library for Processing, but have no experience using it.