# Image display from database

**URL:** <https://forum.inductiveautomation.com/t/image-display-from-database/44613>\
**Category:** Ignition\
**Created:** [March 18, 2021, 6:42am UTC](https://forum.inductiveautomation.com/t/image-display-from-database/44613 "2021-03-18T06:42:04Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![jrd](https://avatars.discourse-cdn.com/v4/letter/j/b9bd4f/32.png) [@jrd](https://forum.inductiveautomation.com/u/jrd)\
**Post date:** [March 18, 2021, 6:42am UTC](https://forum.inductiveautomation.com/t/image-display-from-database/44613/1 "2021-03-18T06:42:04Z")

</div>

Hi guys  
I would like to display pulled from a database on an image on a Vision window. I understand I can do this with a paintable canvas component.  
I have read “all” the posts on this forum and tried most options.

I suspect that my image blob is not correct format.  
I am generating the image via an OpenCV python script. Database is MariaDB, column type is blob.  
When I pull it out in Ignition the datatype is either ndArray (numPy) or unicode.  
I have deduced (perhaps incorrectly) that neither of these is correct.

Has some one done this successfully?  
Precisely what format do I need to generate in my python script?

Any help would be appreciated.

---

<div class="post-metadata">

**Author:** ![jrd](https://avatars.discourse-cdn.com/v4/letter/j/b9bd4f/32.png) [@jrd](https://forum.inductiveautomation.com/u/jrd)\
**Post date:** [March 18, 2021, 6:43am UTC](https://forum.inductiveautomation.com/t/image-display-from-database/44613/2 "2021-03-18T06:43:31Z")

</div>

OOPS!

I would like to display “AN IMAGE” pulled …

---

<div class="post-metadata">

**Author:** ![zacht](https://avatars.discourse-cdn.com/v4/letter/z/ea5d25/32.png) [@zacht](https://forum.inductiveautomation.com/u/zacht)\
**Post date:** [March 18, 2021, 3:28pm UTC](https://forum.inductiveautomation.com/t/image-display-from-database/44613/3 "2021-03-18T15:28:32Z")

</div>

I've successfully displayed .jpg files in a paintable canvas from a database after slightly tweaking this code.

> [@Updating Image component based off of newest image in a directory](http://forum.inductiveautomation.com/t/updating-image-component-based-off-of-newest-image-in-a-directory/14972/7):
>
> Here’s some code to display an image, scaled, on the paintable canvas. Also caches the read image to avoid a little bit of extra load: g = event.graphics filename = r"path/to/file.png" cachedName = event.source.getClientProperty("img-bytes-cached-name") bytes = event.source.getClientProperty("img-bytes-cached") if filename!=cachedName or not bytes: # Image not cached - load from database #bytes = system.db.runScalarQuery("SELECT data FROM image\_test WHERE imgname='%s'"%name) bytes = system.…

---

<div class="post-metadata">

**Author:** ![jrd](https://avatars.discourse-cdn.com/v4/letter/j/b9bd4f/32.png) [@jrd](https://forum.inductiveautomation.com/u/jrd)\
**Post date:** [March 19, 2021, 12:30am UTC](https://forum.inductiveautomation.com/t/image-display-from-database/44613/4 "2021-03-19T00:30:53Z")

</div>

Thanks Zacht  
That works great for images stored on client machine

But, my images are on the gateway, so that’s the reason I stored images in database

I have identified my issue: the format in which the image is stored.

So the solution is to use PIL (Python Imaging Library) to convert the OpenCV array to bytes, using the function ‘fromarray()’ function before storing the result in the database.

Hope this helps anyone else using OpenCV

Thanks