# How to load an image without function image();

**URL:** <https://discourse.processing.org/t/how-to-load-an-image-without-function-image/24566>\
**Category:** Coding Questions\
**Tags:** homework\
**Created:** [October 13, 2020, 10:40am UTC](https://discourse.processing.org/t/how-to-load-an-image-without-function-image/24566 "2020-10-13T10:40:13Z")\
**Posts on this page:** 12\
**Page:** 1

<div class="post-metadata">

**Author:** ![Ellie98](https://avatars.discourse-cdn.com/v4/letter/e/e47774/32.png) [@Ellie98](https://discourse.processing.org/u/Ellie98)\
**Post date:** [October 13, 2020, 10:40am UTC](https://discourse.processing.org/t/how-to-load-an-image-without-function-image/24566/1 "2020-10-13T10:40:13Z")

</div>

Hello,  
I have to get an europe-map image to the sketch-window by clicking the key l or L but without saving the picture and without using the function image();  
I tried it like this but it’s not working. Maybe there is an issue with the link…? Could someone help me please?  
Thanks so much in advance!

```auto
// Bildvariablen für die Karten
PImage europa;
PImage brexit;
// in welchem Programmstatus sind wir
byte status = 0;
// Positionsvariablen
int xPosMenueText = 50;
float xPosLaufschrift = 0;
int xPosBrexitKarte = 0;
int yPosBrexitKarte = 0;
int lineEnd = 0;
int lineStart = 0;

void setup() {
  surface.setTitle("Brexit");
  size(638, 493);
  background(190, 190, 190);
  surface.setLocation(319, 247);
  //Load image from a web server **HERE**
europa = loadImage("https://banner2.cleanpng.com/20180405/jhe/kisspng-europe-vector-map-royalty-free-europe-5ac6c0af154b29.0013899515229748950872.jpg");
}
void draw() {
  fill(0, 0, 255);
  textSize(24);
  text("(L)ade Europa", 50, 50);
  text("(E)xit", 50, 90);
  strokeWeight(8);
  line(80, 110, 638, 110);

  // Bei Status 0 wird das Anfangsmenü gezeigt (Europakarte laden / Ende)
  // . . .
  // Bei Status 1 wird Europa angezeigt + Menü (Englandkarte nachladen / Ende)
  // . . .
  // Bei Status 2 werden beide Karten angezeigt + Menü (Brexit / Ende)
  // . . .
  // Bei Status 3 kann England mit den Tasten was bewegt werden
  // . . .
  // Bei Status 4 wird keine Karte mehr angezeigt, dafür aber eine Laufschrift + Menü

  // . .
}

void keyPressed() {
  // Tasten auswerten

  // Programm verlassen
  if (keyPressed) {
    if (key == 'e' || key == 'E') 
      exit();
  }
  // Laden der Europakarte vorbereiten **HERE**
if(keyPressed){
  if(key == 'l' || key == 'L')
loadImage("europa");
  // Laden der Englandkarte vorbereiten
  // . . .
  // Englandkarte wird mobil
  // . . .
  // Steuerung der Englandkarte über die Europakarte
  // . . .
} 
}

```

---

<div class="post-metadata">

**Author:** ![noel](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/noel/32/213_2.png) [@noel](https://discourse.processing.org/u/noel)\
**Post date:** [October 13, 2020, 1:40pm UTC](https://discourse.processing.org/t/how-to-load-an-image-without-function-image/24566/2 "2020-10-13T13:40:57Z")

</div>

If the browser can access the page, and the Processing code cannot, maybe that is because the site sets a cookie (maybe during login). You may be able to handle this in code, you will have to explicitly add support for passing the cookie. But why don’t you publish the image on Pinterest?  
I managed this [here](https://discourse.processing.org/t/can-i-upload-an-image-to-the-web/15222/8).

---

<div class="post-metadata">

**Author:** ![Ellie98](https://avatars.discourse-cdn.com/v4/letter/e/e47774/32.png) [@Ellie98](https://discourse.processing.org/u/Ellie98)\
**Post date:** [October 13, 2020, 3:58pm UTC](https://discourse.processing.org/t/how-to-load-an-image-without-function-image/24566/3 "2020-10-13T15:58:25Z")

</div>

It’s actually working if I use the image(); function like you did but i’m not allowed to use the image function. I don’t know which other function or way I could use to let a web image appear by clicking a key.

---

<div class="post-metadata">

**Author:** ![noel](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/noel/32/213_2.png) [@noel](https://discourse.processing.org/u/noel)\
**Post date:** [October 13, 2020, 7:43pm UTC](https://discourse.processing.org/t/how-to-load-an-image-without-function-image/24566/4 "2020-10-13T19:43:10Z")

</div>

Do you mean not allowed to use this to display the image?

> image(europa, 0, 0);

That is impossible I´m afraid.  
The image link really doesn’t load in Processing. That’s why I posted the suggestion above.

---

<div class="post-metadata">

**Author:** ![noel](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/noel/32/213_2.png) [@noel](https://discourse.processing.org/u/noel)\
**Post date:** [October 13, 2020, 9:20pm UTC](https://discourse.processing.org/t/how-to-load-an-image-without-function-image/24566/5 "2020-10-13T21:20:13Z")

</div>

> [@Ellie98](#):
>
> without using the function image();

You could load the pixel array. Like:

```auto
PImage img; 
void setup() { 
  size(676, 592); // Note that the size is the same as image just to facilitate;to be able to use width and height
  img = loadImage("your_image.ext"); 
}                                  
void draw() { 
  loadPixels(); 
  img.loadPixels(); 
  for (int y = 0; y < height; y++ ) { 
    for (int x = 0; x < width; x++ ) { 
      int loc = x + y*width; 
      float r = red(img.pixels [loc]); 
      float g = green(img.pixels[loc]); 
      float b = blue(img.pixels[loc]);
      pixels[loc] = color(r, g, b);
    }
  }
  updatePixels();
}

```

---

<div class="post-metadata">

**Author:** ![glv](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/glv/32/18785_2.png) [@glv](https://discourse.processing.org/u/glv)\
**Post date:** [October 13, 2020, 10:17pm UTC](https://discourse.processing.org/t/how-to-load-an-image-without-function-image/24566/6 "2020-10-13T22:17:43Z")

</div>

Hello,

- Find a link that works.  
_[https://processing.org/reference/loadImage\_.html](https://processing.org/reference/loadImage_.html)_

- Check out the related functions:  
_[https://processing.org/reference/image\_.html](https://processing.org/reference/image_.html)_

- This tutorial has the answer you seek:  
_[https://processing.org/tutorials/pixels/](https://processing.org/tutorials/pixels/)_

I hope that the community will give you the opportunity to find it on your own.  
It is so much more rewarding that way!

`:)`

---

<div class="post-metadata">

**Author:** ![noel](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/noel/32/213_2.png) [@noel](https://discourse.processing.org/u/noel)\
**Post date:** [October 14, 2020, 7:29am UTC](https://discourse.processing.org/t/how-to-load-an-image-without-function-image/24566/7 "2020-10-14T07:29:02Z")

</div>

@glv Did you manage the 403 error with the openConnection.addRequestProperty() function, or in another way?

---

<div class="post-metadata">

**Author:** ![glv](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/glv/32/18785_2.png) [@glv](https://discourse.processing.org/u/glv)\
**Post date:** [October 14, 2020, 9:15am UTC](https://discourse.processing.org/t/how-to-load-an-image-without-function-image/24566/8 "2020-10-14T09:15:21Z")

</div>

> [@noel](#):
>
> Did you manage the 403 error with the openConnection.addRequestProperty() function, or in another way?

I simply used a link that worked and found a suitable image to meet the requirements of the question.

You already provide a link to a solution to that by posting on Pinterest.

> [@Ellie98](#):
>
> I have to get an europe-map image to the sketch-window … without using the function image()

Once a link is found that works a solution to this can be found in the second two bullet points.

`:)`

---

<div class="post-metadata">

**Author:** ![noel](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/noel/32/213_2.png) [@noel](https://discourse.processing.org/u/noel)\
**Post date:** [October 14, 2020, 9:52am UTC](https://discourse.processing.org/t/how-to-load-an-image-without-function-image/24566/9 "2020-10-14T09:52:23Z")

</div>

I was intrigued by the 403 error, and the solution I found doesn’t work on every browser. With that difficulty, I didn’t notice the homework tag, on which I normally do not react because I just can’t help myself.

---

<div class="post-metadata">

**Author:** ![glv](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/glv/32/18785_2.png) [@glv](https://discourse.processing.org/u/glv)\
**Post date:** [October 14, 2020, 12:09pm UTC](https://discourse.processing.org/t/how-to-load-an-image-without-function-image/24566/10 "2020-10-14T12:09:03Z")

</div>

Hello @noel

> [@noel](#):
>
> manage the 403 error with the openConnection.addRequestProperty() function

Can you elaborate on this?

`:)`

---

<div class="post-metadata">

**Author:** ![noel](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/noel/32/213_2.png) [@noel](https://discourse.processing.org/u/noel)\
**Post date:** [October 14, 2020, 12:42pm UTC](https://discourse.processing.org/t/how-to-load-an-image-without-function-image/24566/11 "2020-10-14T12:42:44Z")

</div>

I tried [this one](https://www.codepedia.org/ama/how-to-handle-403-forbidden-http-status-code-in-java/#:~:text=io.,response%20code%3A%20403%20for%20URL&text=Status%20code%20403%20responses%20are,requested%20resource%20by%20the%20client.).

---

<div class="post-metadata">

**Author:** ![JoseMY](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/josemy/32/2016_2.png) [@JoseMY](https://discourse.processing.org/u/JoseMY)\
**Post date:** [October 17, 2020, 8:08pm UTC](https://discourse.processing.org/t/how-to-load-an-image-without-function-image/24566/12 "2020-10-17T20:08:56Z")

</div>

Solutions posted here look weird to me. Why disallow using image() just to teach you how to use loadbytes?  
Making you develop a custom filter would be more useful.  
So I guess they want you use a svg image. There are SVG maps on the wikipedia, and there is a function to use SVG files in processing.