Dynamic image embedding and display from SQL Query using transform

Ignition
1

Hi All,

I want to test the following concept.

I have a database table with the images stored in a column as bytestream.

I want to be able to return the images from the database into ignition table, but I want to display the images in the table.

Is it possible to

add a transform in my query that adds the image component as follows in each table row and link it's source property to the image bytestream column in the table?

{
	  "type": "palette-item",
	  "payload": {
	    "componentId": "ia.display.image",
	    "variantId": ""
	  }
}

at the moment, I am returning the photo bytestream like this :smiley: , but I don't want to display that value in the table:

image
image841×683 58.1 KB

Can I use the below transform script that adds the image in the column and links the source to the byte stream data?

image
image1525×692 46.4 KB

2

This task is perfect for my Blob Server module. You'd include the photoID (not bytes) as a column in the table, and set that column to render with a view. In the embedded view, concatenate the base URL for the named query with the image ID parameter to produce the complete URL for the actual Image. The table is fast because it contains very little raw data. The images load quickly because the browser can efficiently handle image bytes.

1 Like
3

Auto table cell render would not be capable to property decode by itself. Use an embedded view image id parameterized. This view should have a markdown html enabled and your image coming from a query and base64 encoded. Ones ready, use this view as column render for the table. I would avoid loading the binary within the table as shown in your post.

4

This is very slow compared to directly delivering the bytes of the Image with the (free) Blob Server module. Suitable (barely) only if 3rd party modules are forbidden in your situation. (Your advice and my advice are identical, but for the URL in the cell render view.)

5

Do you mean a database with the image URLs and the local repository where the images are stored on a drive? Meaning you would only access the database table with images to get the image URL?

6

No, the Blob Server module requires the image data to be in a BLOB column within the database. (Datatype names for "blob" vary by brand of DB. But something that accepts and returns a java byte array.)

If you intend to use files in the gateway filesystem, use the WebDev module.

7

Yeah, the data type in the MS SQL is varbinary. So in the BLOB Server Module do you convert the byte stream to display it? Where is the URL pointing to?

Are there any project examples available for this?

I am used to MVC.Net where I would pass the data to the browser with the SP on the database side that has Partition By clause and displays the number of thumbnails per page as you prefer to display it.
This same solution is used on websites like Amazon or Ebay.
My understanding is that the Ignition SCADA uses web technology in it's Perspective module, so I was hoping that this can be used in the same way.

I think I will need to check your BLOB module, thanks.

8

If you read through this topic, the discussion and examples should answer your questions:

1 Like