# Cannot display an image

**URL:** <https://discourse.processing.org/t/cannot-display-an-image/27256>\
**Category:** p5.js\
**Created:** [January 21, 2021, 1:28am UTC](https://discourse.processing.org/t/cannot-display-an-image/27256 "2021-01-21T01:28:11Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![skypickle](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/skypickle/32/11863_2.png) [@skypickle](https://discourse.processing.org/u/skypickle)\
**Post date:** [January 21, 2021, 1:28am UTC](https://discourse.processing.org/t/cannot-display-an-image/27256/1 "2021-01-21T01:28:11Z")

</div>

my html

```auto
<!doctype html>
<html>
  <head>
    <script src="p5/p5.js"></script>
    <script src="p5/addons/p5.dom.js"></script>
    <script src="sketch4.js"></script>
  </head>
  <body style="margin: 0; overflow: hidden;">
  </body>
</html>

```

my sketch4.js

```auto
let img;
function preload() {
  img = loadImage('google.png');
}
function setup() {
  image(img, 0, 0);
}

```

when i double click my html i just get a window that says ‘loading’  
my index.html and mysketch.js are in the same folder as ‘google.png’

Why am I not seeing the image?  
Is there a way I can use a url instead of downloading the image first ? like so

img = loadImage(“[https://www.google.de//images/branding/googlelogo/2x/googlelogo\_color\_272x92dp.png](https://www.google.de//images/branding/googlelogo/2x/googlelogo_color_272x92dp.png)”);

---

<div class="post-metadata">

**Author:** ![skypickle](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/skypickle/32/11863_2.png) [@skypickle](https://discourse.processing.org/u/skypickle)\
**Post date:** [January 21, 2021, 10:22pm UTC](https://discourse.processing.org/t/cannot-display-an-image/27256/2 "2021-01-21T22:22:40Z")

</div>

Figured it out

1)images need a server to display  
2)image call needs to be made in 'function draw()