# Dynamic images (string manipulation)

**URL:** <https://forum.inductiveautomation.com/t/dynamic-images-string-manipulation/2083>\
**Category:** Ignition\
**Created:** [July 27, 2010, 4:07pm UTC](https://forum.inductiveautomation.com/t/dynamic-images-string-manipulation/2083 "2010-07-27T16:07:10Z")\
**Posts on this page:** 9\
**Page:** 1

<div class="post-metadata">

**Author:** ![johannes](https://avatars.discourse-cdn.com/v4/letter/j/7ba0ec/32.png) [@johannes](https://forum.inductiveautomation.com/u/johannes)\
**Post date:** [July 27, 2010, 4:07pm UTC](https://forum.inductiveautomation.com/t/dynamic-images-string-manipulation/2083/1 "2010-07-27T16:07:10Z")

</div>

Hello Everyone,

I wonder how I can manipulate a part of a string, here is what I want to accomplish:

the string “image path” is for example c:/file1.jpg, c:/file2.jpg, c:/file3.jpg, c:/fileN.jpg  
now I want to change the image shown determine with an integer value, so that when my Int = 3 I get file3.jpg, when Int = 1 I want to see file1.jpg

How can I insert a variable into the image path? Or more general how can I integrate a variable into a string value?

Regards Johannes

---

<div class="post-metadata">

**Author:** ![Robert.McKenzie](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/robert.mckenzie/32/4134_2.png) [@Robert.McKenzie](https://forum.inductiveautomation.com/u/Robert.McKenzie)\
**Post date:** [July 27, 2010, 6:36pm UTC](https://forum.inductiveautomation.com/t/dynamic-images-string-manipulation/2083/2 "2010-07-27T18:36:55Z")

</div>

You can create dynamic strings for the image path of a component. Just use an Expression binding and pass in a property for the file number like this example:`"Builtin/Agitator/Agitator "+{Root Container.Image.status}+".png"`The only problem is that you can’t fetch a file off of your hard drive. You have to import the files you want to use into the gateway using the Image Browser in the designer.

---

<div class="post-metadata">

**Author:** ![johannes](https://avatars.discourse-cdn.com/v4/letter/j/7ba0ec/32.png) [@johannes](https://forum.inductiveautomation.com/u/johannes)\
**Post date:** [July 29, 2010, 2:35pm UTC](https://forum.inductiveautomation.com/t/dynamic-images-string-manipulation/2083/3 "2010-07-29T14:35:16Z")

</div>

![:thumb_right:](https://us1.discourse-cdn.com/inductiveautomation/original/1X/2026e28c0c425034352c1b75807edf956adc75f4.gif ":thumb\_right:") thank you Robert!

---

<div class="post-metadata">

**Author:** ![alex.ferrell](https://avatars.discourse-cdn.com/v4/letter/a/958977/32.png) [@alex.ferrell](https://forum.inductiveautomation.com/u/alex.ferrell)\
**Post date:** [August 3, 2010, 5:11pm UTC](https://forum.inductiveautomation.com/t/dynamic-images-string-manipulation/2083/4 "2010-08-03T17:11:52Z")

</div>

Is there any way to dynamically add images into the gateway for use in the project? We have an application where we are directing picking operations in a warehouse. Typically we show an image of the current product to pick. This image comes from a network file with the product part number as the file name. We have been using custom software to do this (not Ignition). I am looking into replacing the custom interface software with Ignition but I have not found a way to duplicate this feature.

---

<div class="post-metadata">

**Author:** ![ISDProj](https://avatars.discourse-cdn.com/v4/letter/i/58956e/32.png) [@ISDProj](https://forum.inductiveautomation.com/u/ISDProj)\
**Post date:** [August 3, 2010, 9:56pm UTC](https://forum.inductiveautomation.com/t/dynamic-images-string-manipulation/2083/5 "2010-08-03T21:56:30Z")

</div>

We’d be interested in this capability too. For an entirely different use though.

---

<div class="post-metadata">

**Author:** ![ttuttle387](https://avatars.discourse-cdn.com/v4/letter/t/59ef9b/32.png) [@ttuttle387](https://forum.inductiveautomation.com/u/ttuttle387)\
**Post date:** [August 4, 2010, 8:20pm UTC](https://forum.inductiveautomation.com/t/dynamic-images-string-manipulation/2083/6 "2010-08-04T20:20:55Z")

</div>

I was able to use the document viewer and pull a .gif image from my hard drive without going through the gateway import. You may be able to work that into your system.

---

<div class="post-metadata">

**Author:** ![ISDProj](https://avatars.discourse-cdn.com/v4/letter/i/58956e/32.png) [@ISDProj](https://forum.inductiveautomation.com/u/ISDProj)\
**Post date:** [August 4, 2010, 9:49pm UTC](https://forum.inductiveautomation.com/t/dynamic-images-string-manipulation/2083/7 "2010-08-04T21:49:01Z")

</div>

That may work for Alex but for our use we need to be able to access the images from multiple workstations as we overlay polygons on the image (e.g. using a Paintable canvas) and it would become a nightmare to maintain image stores across multiple locations.  
I realise we could have a network share and access the images from there but that would be difficult to set up as our network environment includes multiple VLANs that are Firewalled.

---

<div class="post-metadata">

**Author:** ![Carl.Gould](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/carl.gould/32/7262_2.png) [@Carl.Gould](https://forum.inductiveautomation.com/u/Carl.Gould)\
**Post date:** [August 5, 2010, 5:23pm UTC](https://forum.inductiveautomation.com/t/dynamic-images-string-manipulation/2083/8 "2010-08-05T17:23:08Z")

</div>

There are various other ways you could accomplish this.

1. If you serve them up via a web server (IIS, apache, etc) then you can use them directly. Our image component will load any image over an [tt]http://[/tt] url. Just set the path property to the URL, and you’re good to go.

2. If you serve them up over a windows file share or have them on the local computer, you can program up the Paintable Canvas component to display them, like so:

[code]from [java.net](http://java.net) import URL  
from javax.imageio import ImageIO

# Use this for a local file

#url = URL(“file:C:/my graphics/something.png”)

# Use this for a windows file share

url = URL(“file:\\file\_server\my graphics\something.png”)

icon = ImageIO.read(url)

event.graphics.drawImage(icon, 0, 0, event.source)  
[/code]

---

<div class="post-metadata">

**Author:** ![ISDProj](https://avatars.discourse-cdn.com/v4/letter/i/58956e/32.png) [@ISDProj](https://forum.inductiveautomation.com/u/ISDProj)\
**Post date:** [August 5, 2010, 9:34pm UTC](https://forum.inductiveautomation.com/t/dynamic-images-string-manipulation/2083/9 "2010-08-05T21:34:15Z")

</div>

Thanks Carl.  
As usual you guys are right on the ball ![:thumb_left:](https://us1.discourse-cdn.com/inductiveautomation/original/1X/e26afb081ddde6df016df6ee49159cf56aaca688.gif ":thumb\_left:")
