Using Paintable Canvas to get Blob image from MySQL

Ignition
, ,
1

I am trying to get an image from a BLOB column in ignition. I have an image stored in MySQL in a blob column currently and am trying to display it with the paintable canvas in Ignition Vision 8.1. The code I am using currently is not working. Any help would be appreciated!

Capture
Capture1069×1035 68.1 KB

2

What does happen? Any errors in the console? Your approach there is still relatively inefficient, by the way - ImageIO's construction of the image isn't free and is going to be called often. It'd be better to cache the actual Image instance.

3

There aren't any errors in the console. When I put the designer into preview mode nothing shows up for the paintable canvas, and no errors are put into the console.

4

This may help simplify your efforts
Automation Professionals' Blob Server Module - 3rd Party Modules - Inductive Automation Forum

1 Like
5

Not necessary for Vision. Vision can call a named query natively.

1 Like
6

Pssst! Don't run a query inside a repaint event! Run the query as a named query binding on a custom property. Then the repaint event can just read the bytes. (And draw nothing when no bytes are present.)

1 Like
7

For anyone that comes into this to check for solution. I ended up getting it to work by defining column and row index from sql query return. Also used @pturmel suggestion and placed the query inside a custom property.

image
image813×695 41.5 KB

8

This was very helpful to render an image blob from a database table, thanks! Is there a way to get the image rendered to resize to fit the canvas?

9

You can generate an AffineTransform from the sizes of the image and the graphics space, then use this drawImage overload:

https://docs.oracle.com/en/java/javase/11/docs/api/java.desktop/java/awt/Graphics2D.html#drawImage(java.awt.Image,java.awt.geom.AffineTransform,java.awt.image.ImageObserver)

Or this one:

https://docs.oracle.com/en/java/javase/11/docs/api/java.desktop/java/awt/Graphics.html#drawImage(java.awt.Image,int,int,int,int,int,int,int,int,java.awt.image.ImageObserver)

10

Perhaps more simplistically stated, the width and height parameters can be specified within the drawImage call.

Example:

# graphics.drawImage(image, x, y, width, height, observer)
graphics.drawImage(image, 0, 0, event.width, event.height, event.source)

Note: If graphics.scale(dX, dY) is being used, the width and height variables will need to be explicit to the scaled size
Example:

dX = (event.width-1)/100.0
dY = (event.height-1)/100.0
graphics.scale(dX,dY)

# graphics.drawImage(image, x, y, width, height, observer)
graphics.drawImage(image, 0, 0, 100, 100, event.source)
1 Like