I have a database table with a column of type BLOB. In this column I have inserted pictures. I simply want to know how to get the picture in the database to show up on a table. I searched around and nothing was of much help.
EDIT: I found a page that seems to talk about what I want to do, but all it says is that I need to “Simply define the Key to the Blob image” but I have no idea what that is, I get the feeling that it is a feature of Ignition, but it could also be a poorly worded reference to a foreign key/ primary key, nor can I find a page that will tell me. This is mentioned in the “image placeholders” section of the page, which seems to be what I want to do, but I can’t find anywhere that actually tells me how to do it. Here is the page I was looking at:
http://www.inductiveautomation.com/support/usermanuals/reporting/source/reporting/components/images.htm
EDIT: After a lot of looking around I found out that the Image Placeholder and the “Key” are a part of the Report Designer, which is a part of the Report viewer. I do not believe that I want to create a Report viewer/ view, so this brings up my main question again. How do I display an Image that is stored in my DB as a BLOB?
EDIT: I just want to know how to display an image stored as a blob.
If there is any way I can make this easier for you, let me know. I want to help you help me.
This is one of those tasks that might take a few attempts the first time …
In report viewer retrieve image into a custom property dataset. i.e. ImageTest with column ‘Image’.
Ignition will automatically create byte array data type for db column ‘Image’ datatype varbinary(max).
In report viewer-
1 From Drag and Drop Keys drag dataset ‘ImageTest’ onto report, choose dataset key element ‘Table’.
2 Select table row, red border will appear.
3 Uncheck ‘Structured’ in inspector panel. Resize row height as desired.
4 From Tools, Add Image Placeholder to row. Make sure row is bordered in red and placeholder is inside red border.
5 Select Image Placeholder in row.
6 From Drag and Drop Keys, select the column name ‘Image’.
7 Drag and drop column name ‘Image’ into “Key” edit.
Preview- image should be visible.
[quote=“markdobtech”]This is one of those tasks that might take a few attempts the first time …
In report viewer retrieve image into a custom property dataset. i.e. ImageTest with column ‘Image’.
Ignition will automatically create byte array data type for db column ‘Image’ datatype varbinary(max).
In report viewer-
1 From Drag and Drop Keys drag dataset ‘ImageTest’ onto report, choose dataset key element ‘Table’.
2 Select table row, red border will appear.
3 Uncheck ‘Structured’ in inspector panel. Resize row height as desired.
4 From Tools, Add Image Placeholder to row. Make sure row is bordered in red and placeholder is inside red border.
5 Select Image Placeholder in row.
6 From Drag and Drop Keys, select the column name ‘Image’.
7 Drag and drop column name ‘Image’ into “Key” edit.
Preview- image should be visible.[/quote]
Using this strategy, is the picture only visible within the Report Viewer?
That is correct.
The Image component in the Display component group does not support blob to image. Rather, it relies on a path concept to the image storage manager in the gateway.
[quote=“markdobtech”]That is correct.
The Image component in the Display component group does not support blob to image. Rather, it relies on a path concept to the image storage manager in the gateway.[/quote]
Is there a way I can temp upload the blob to the gateway, so that I can use the picture component?
Off hand, I don’t recall a programmatic method for dynamic image manager upload. Hopefully, I’m wrong.
The paintable canvas component is very interesting and can be used all types of graphics requirements. I put together this test to see how it would work for a dynamic image- seems to work ok. I would recommend replacing the concept of using a file as the input stream by using other stream methods.
On a command button.
blobData = system.db.runQuery(“SELECT image FROM imageTest”)
if len(blobData) > 0:
data = blobData[0][0]
# open up a temp file
# store the file name in a custom property on the paintable canvas
# the paintable canvas repaint event will use this as input stream
filename = system.file.getTempFile(“jpg”)
system.file.writeFile(filename, data)
urlFile = ‘file:%s’ % filename
event.source.parent.getComponent(‘Paintable Canvas’).fileName = urlFile
On the paintable canvas repaint event:
Note: custom property on paintable canvas ‘fileName’ [string]
from javax.imageio import ImageIO
from java.net import URL
url = event.source.fileName
imageStream = URL(url)
image = ImageIO.read(imageStream)
event.graphics.drawImage(image, 0, 0, event.source)
[quote=“markdobtech”]Off hand, I don’t recall a programmatic method for dynamic image manager upload. Hopefully, I’m wrong.
The paintable canvas component is very interesting and can be used all types of graphics requirements. I put together this test to see how it would work for a dynamic image- seems to work ok. I would recommend replacing the concept of using a file as the input stream by using other stream methods.
On a command button.
blobData = system.db.runQuery(“SELECT image FROM imageTest”)
if len(blobData) > 0:
data = blobData[0][0]
# open up a temp file
# store the file name in a custom property on the paintable canvas
# the paintable canvas repaint event will use this as input stream
filename = system.file.getTempFile(“jpg”)
system.file.writeFile(filename, data)
urlFile = ‘file:%s’ % filename
event.source.parent.getComponent(‘Paintable Canvas’).fileName = urlFile
On the paintable canvas repaint event:
Note: custom property on paintable canvas ‘fileName’ [string]
from javax.imageio import ImageIO
from java.net import URL
url = event.source.fileName
imageStream = URL(url)
image = ImageIO.read(imageStream)
event.graphics.drawImage(image, 0, 0, event.source)[/quote]
Ok, thank you Mark.
PS: When you want to add code to a comment/ reply/ post, click the “Code” button above the comment box next to the other settings (e.g. B, i, u, etc) and then paste your code between the brackets. This gives it proper formatting which makes it much easier to read, e.g.:
#this is a loop
for x in range(0,100):
print x
I respond in any format I feel like.
When your offering help, I can’t tell you what to do. Only recommend.
I do hope you were able to get your issue resolved. Thanks for the help markdobtech
inductiveautomation.com/news/item/292
[quote]Do put your code in a code block.
There isn’t much technical know-how to using the forum, but this one is important. If you’re copying-and-pasting code into a forum post, surround it in code tags. This is applicable for Python scripts, SQL queries, and Expressions. If you don’t do this, the formatting (indentation) of the code will be lost, and it will be very hard to read.[/quote]