# Display local image file in Perspective

**URL:** <https://forum.inductiveautomation.com/t/display-local-image-file-in-perspective/24953>\
**Category:** Ignition\
**Tags:** perspective\
**Created:** [May 13, 2019, 11:28pm UTC](https://forum.inductiveautomation.com/t/display-local-image-file-in-perspective/24953 "2019-05-13T23:28:45Z")\
**Posts on this page:** 8\
**Page:** 1

<div class="post-metadata">

**Author:** ![chenlu.han](https://avatars.discourse-cdn.com/v4/letter/c/47e85d/32.png) [@chenlu.han](https://forum.inductiveautomation.com/u/chenlu.han)\
**Post date:** [May 13, 2019, 11:28pm UTC](https://forum.inductiveautomation.com/t/display-local-image-file-in-perspective/24953/1 "2019-05-13T23:28:45Z")

</div>

Hi All,

I want Ignition to display an image from a local directory. In vision, I was able to do it as below:  
 ![Vision_Image](https://us1.discourse-cdn.com/inductiveautomation/original/2X/7/78093136a9fcb10d71b1d4e54dc7543046bb3114.png)

The same path string does not work on a Perspective Image component when entered to props.source field:  
 ![Perspective_Image](https://us1.discourse-cdn.com/inductiveautomation/original/2X/d/dabf3b9de3d54844a606eff28d48e458855d08b6.png)  
 ![Perspective_Binding](https://us1.discourse-cdn.com/inductiveautomation/original/2X/a/a5e7ff4390321aec03e3c35f1afd7eea665aea06.png)

My test was done on the gateway machine, so both Perspective and Vision should have access to the image file.

Appreciate any suggestion.

---

<div class="post-metadata">

**Author:** ![pturmel](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/pturmel/32/3295_2.png) [@pturmel](https://forum.inductiveautomation.com/u/pturmel)\
**Post date:** [May 14, 2019, 12:57am UTC](https://forum.inductiveautomation.com/t/display-local-image-file-in-perspective/24953/2 "2019-05-14T00:57:26Z")

</div>

Browsers generally do not allow web resources to access local files. Other than through user-controlled upload forms. Because that would be a _ **huge** _ security hole. Vision runs as a local application, so it is trusted with local resources.

---

<div class="post-metadata">

**Author:** ![cmallonee](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/cmallonee/32/6416_2.png) [@cmallonee](https://forum.inductiveautomation.com/u/cmallonee)\
**Post date:** [May 14, 2019, 2:27pm UTC](https://forum.inductiveautomation.com/t/display-local-image-file-in-perspective/24953/3 "2019-05-14T14:27:38Z")

</div>

As @pturmel said, it's all about what Perspective (ie: browser) has access to. If you want an image file to be displayed in Perspective, there a re a few options, but these are the two easiest:

1. From Tools \> Image Management, you could upload a file to the internal database, and then in the image component supply a source of '/system/images/path\_to\_image/filename.extension". This solution is not the best if you expect to need many photos, as it will slow down the internal database.
2. Place photos you will need in  
`C:\Program Files\Inductive Automation\Ignition\webserver\webapps\main`, and then refer to them by setting `Image.props.source` to "path\_to\_image/filename.extension". This method allow for many photos without adverse effects on the internal database. **Important note: This approach is not officially supported. It works only because of how the internal server settings of the Gateway work. At any point in the future, this may cease working and would be considered neither breaking behavior nor a bug. Use this route at your own risk.**

---

<div class="post-metadata">

**Author:** ![smcfarlane](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/smcfarlane/32/42150_2.png) [@smcfarlane](https://forum.inductiveautomation.com/u/smcfarlane)\
**Post date:** [September 20, 2022, 3:25am UTC](https://forum.inductiveautomation.com/t/display-local-image-file-in-perspective/24953/4 "2022-09-20T03:25:24Z")

</div>

When attempting to implement option 2 here Im not getting anything in the image viewer. Am I doing something wrong? I’ve tried with and without quotes for the file path.

![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/2/4/249fd09a3d2dee5c448f34df94fb2629d8888d06.png)

 ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/a/1/a177cd1a6b422f95802bedbbe8f50e46d3de4cb2.png)

---

<div class="post-metadata">

**Author:** ![0sm0](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/0sm0/32/15228_2.png) [@0sm0](https://forum.inductiveautomation.com/u/0sm0)\
**Post date:** [September 20, 2022, 5:35am UTC](https://forum.inductiveautomation.com/t/display-local-image-file-in-perspective/24953/5 "2022-09-20T05:35:10Z")

</div>

Just use `/lion.jpg`

---

<div class="post-metadata">

**Author:** ![cmallonee](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/cmallonee/32/6416_2.png) [@cmallonee](https://forum.inductiveautomation.com/u/cmallonee)\
**Post date:** [September 20, 2022, 1:27pm UTC](https://forum.inductiveautomation.com/t/display-local-image-file-in-perspective/24953/6 "2022-09-20T13:27:31Z")

</div>

> [@cmallonee](#):
>
> “path\_to\_image/filename.extension”

Is meant to be understood as "the path to the image within the `main` directory, followed by a slash, followed by the name and extension of the target file".

---

<div class="post-metadata">

**Author:** ![MTekin](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/mtekin/32/50257_2.png) [@MTekin](https://forum.inductiveautomation.com/u/MTekin)\
**Post date:** [June 1, 2023, 3:43pm UTC](https://forum.inductiveautomation.com/t/display-local-image-file-in-perspective/24953/7 "2023-06-01T15:43:27Z")

</div>

In case anyone else stumbles on this post: I needed to use /path\_to\_image/filename.extension. It wasn't working for me until I added the leading forward slash (running 8.1.27)

---

<div class="post-metadata">

**Author:** ![Ashlin\_Antony](https://avatars.discourse-cdn.com/v4/letter/a/df705f/32.png) [@Ashlin\_Antony](https://forum.inductiveautomation.com/u/Ashlin_Antony)\
**Post date:** [April 5, 2024, 6:58am UTC](https://forum.inductiveautomation.com/t/display-local-image-file-in-perspective/24953/8 "2024-04-05T06:58:55Z")

</div>

You have to add the forward slash for it to work.
