Using the image placeholder in a report

I found this while searching the forum.

[quote]Yes, you can. Add an “image placeholder” onto the report, and bind its key to something that represents the URL to the image you wish to display.

For instance, you could add a new String dynamic property to the report called “imageURL”, bind the image placeholder component’s key to “imageURL” and set the value of the “imageURL” property to an image address (something.com/myimage.jpg)[/quote]

I tried this and it works as stated but I want to have a table on the report with an image in the table.

[ul]I placed the table
added an image placeholder in the table
set the url property = @data.imageURL@
(I also tried to set the key to @data.imageURL@)
added the other fields I wanted
[/ul]

I cannot get this to work. How do I get it to display an image in the table?
Thank you,

You don’t need the @ symbols around the data.imageURL. Take those out and it should show up just fine. Also, if your table’s Dataset Key is already pointed to data you will want the image’s key to just be imageURL.

I’ve got image placeholder put on a report. The report also has a dynamic property,
which contains the URL of the image. I’ve bound the property to the image placeholder
using it’s “Key”.

But there’s a problem.

This doesn’t display anything and giving no hints of what’s going on:

file:///home/cgz/test.png

OTOH, this does show up correctly:

http://www.inductiveautomation.com/resources/com.inductiveautomation.website.BasePage/images/logos/logo.png

Any ideas?
Thanks!

Your images need to be avail from the java client(s). Try serving them up via apache and passing the http link instead of the file link.

Does that image exist in Ignition? If so you can use the following url:

ipaddress:8088/main/system/images/myimage.png

Otherwise, you will have to have a network drive or an apache server to serve up the images.

Could you make it so that the “file://”-approach worked for tempfiles at least?

Since I also tried (my first approach) using a tempfile created by the client itself,
which didn’t work either.

If so, why would a tempfile be a problem? Seems a reasonable expectation to me.

In my case, the images reside in a database, but they’re accessed using the DTO
pattern. So the “raw” SQL queries are not meant here to be put directly anywhere but DAO,
so I can’t use the BLOB field support of the placeholder either.

Creating a servlet for this feels a bit cumbersome, because otherwise there hasn’t
been any major problems (using the canvas for displaying these images elsewhere) .

Thanks!

If your image is a BLOB in the database you can use the image placeholder. You have to bring back the image BLOB in a dataset (since there isn’t a byte array data type for a dynamic (custom) property.

If I fetch the BLOB with a SQL query binding, I get the dataset pasted below,
but the placeholder doesn’t display anything. The image is a GIF.

Also, the “DTO pattern” I told about, already procudes the dataset,
but by creating the dataset with java constructor:

com.inductiveautomation.ignition.common.BasicDataset

Shouldn’t that be equal to a direct SQL expression binding, and
100% compatible in this case?

I’m using Kubuntu, Sun Java build 1.6.0_22-b04.

#NAMES
“ID”,“ID_FileObject”,“Data”,“SequenceNum”,"_LID"
#TYPES
“L”,“L”,"[byt",“I”,“I”
#ROWS”,“1”
“1930001”,“1000001”,“R0lGODlhSwAXAOZ/AMfkoIORnrW+xUxic9jsvY6bpqKttuHxzHmJluvu8OXo6+3w8e744H6Nms7p
qdDW2p2psvT19lptfVZqesvR1qjXaXSFktzg5LG6wl9ygdvf4vP09ers7uDk521+jPDy9Kexus7U
2UdcbvP56cTL0oWUoL3Ey53OW8bM0tfc4GR3hpqmsMHIzmp8ivn99lFmdomXosnP1Y/HRP39/a+5
wePm6a22vtbb4Jairejq7b/GzbrCyaWvubvDypCdqNPY3M3T2JSgq2Bzgqq0vWd5h7e/xpmlr3CB
j3GCkHeHlGl7iWN1hIzGP/7+/vv8/Pv7/Pr6+/Lz9d/j5vb3+MLJz/j5+tTZ3dXa3lxwf8LKz+Hl
6Pf4+Zekrtne4dbb37K7w/Dx88DHzcPK0HyLmPn6+uLl6LnByLHYfG5/joCPm93h5WFzg+Pn6ZOg
qp+rtMDH0MDhlLzDzJLJSbnAytjd4ePm6mx9i9vf4/f78H+Nnfj5+f7+/dXZ35jMU0Vbbf///yH5
BAEAAH8ALAAAAABLABcAAAf/gH+Cg38pNE+CCTQKhI2Oj5CRkpOPQRIagj0SApSdnp+dLX5oGg8T
fj6gkU9Nqq5/VGx/ORJ+trcWEX8/FI8RJVKSekgpnoiCIQVOnlR+LwGnt9JEabbBjU4+15ETIZ1X
aYMpQZ81L7cDBWI3fDt5IrcquoROQFezCSk294J3NlQSrEThF8VKqyckbDyIwGVCFi0bYihI8GDQ
jwR/LtjQUYVQCVtHtg0CgsWWDUdVGogAYyNDmgYDehV50cCCCCkUMrSKIWHGBw8tArSgkGRAAxYd
MlioMaDDHzYvEhSZEACNhw+CONRCM+/PHgIOBNWphQSKow8TFgxRMeNPABgf/waI+bPlEoU1rShg
+eOjxbJlWYgMKuLhj4UVfyAEiDLA2x8lBlYgKTmgBqEDTJgQEEQCngoLnAYlSAsCgSA3Jajs/VMF
SxcKS/JmeLKmCCETKgZ9KYxizRYVdGKICJAmgJA252wVaOTiBJM+eASJsmWB0OgFIJIIggBjRwZB
rbvEyP3nQQYoGWwPMiFY0O4/TpQEQfLHxIQudOhIAWPFgy0SfzBAwIAEnJEZHKf5IUIDjIhGmnaJ
BVCGHxVFcJ8VL0zxBwgS/AEDGmaBQUYWE7Tyx3t/DOGHGX8oEJMgGv6hBjxq/FFBZjhmJgMDf8zh
hwTHOIhddYk18AcXAyCAwP8AKUDRggpptLDGDAs8iUAGP0SQQQswNCGAHYLkQMQ8X0yAgAUNLOOF
LRfYmCOOcozQ449dCfIEHU4kcE0OWgjygABd3KFLBCbEEMEFrZBBggB0ICIVCn+AUaMgDQrSgQBU
LPAHCULY8sYfIxwg6gEGMgGAICvY4oEXr7TKWhSTJOdHCY2M0AcTJ7jwxwwq3EJfJx1M6ooaTv0h
xReT2CCUHwPQcVlmBwhSBHUlZEFIDxBUCOkVwRSAgLMfgAACrAoU4QYLBrAgCAUQqOvhGG0K0EsT
Zrhxxx8b6GBAD4NEsIYfKmg6yAGb/UHHOWM88kMPFkyRAK0g8AuCG7AWwIL/GeSEAQMFaPyAgKYa
sGBBjQbwsMGJiJmBgwZjTMGGBVaMUWkAtixRUSNxRHNSI1sYMEQSHySwHA0m/CEAv06YFkHCLNAA
RSo+KNAEDTw0UBEG7obgBl9A/FGCFgq08QcOXQhCxwDSjIFBDCTwgIY0WGBFiAZpJGBBDhuMoUYA
Re/QBgceUmBCKiaA8IuHOUyRBAclQPoFFxjFgBgGEHSAQARawPBHAc7+gcKPK/QqDS44DPCCLPRg
AAINNeqwwhDBRGCEbRxA4AYYGT1Ahg5/hAErul94EwUX/JYRwx9Q2LACqwuoKwZGgvygqZa2DIC2
H2O0VYawrnavihJ+fMxGE0mpeG/+Kwa00GAMLYRx/vuRBAIAOw==”,“0”,“192”

Here’s a complete test for it.
image_placeholder_problem.vwin (13 KB)

Ok, I found the problem. Thanks for posting the window. Since the image (byte array) is inside of the dataset you cannot create an image placeholder that points to “ImageObject.Data”. You have to drag the ImageObject dataset onto the report as a table. You can put the image placeholder in the details row of the table. You have to make the details row unstructured first. Once it is in the table it works just fine.

Thanks, I finally got it to work. Even though it was a fight.

The hard part for me was that there were no hints of how to do it.
On the other hand there were plenty of options of doing it wrong.

Also, once the image is inside the row, you must take care of not pulling
it too much downwards, or you cannot touch the image anymore, being
forced to rebuild the table from scratch.

One of the wrong approaches gave me this exception:

java.lang.ClassCastException: com.reportmill.shape.RMImage cannot be cast to com.reportmill.shape.RMTableRow
	at com.reportmill.panels.TableTool.mousePressed(TableTool.java:619)
	at com.reportmill.panels.SelectTool.mousePressed(SelectTool.java:218)
	at com.reportmill.editor.RMEditorEvents.mousePressed(RMEditorEvents.java:174)
	at com.reportmill.editor.RMEditor.mousePressed(RMEditor.java:780)
	at com.reportmill.editor.RMRptEditor.mousePressed(RMRptEditor.java:177)
	at com.reportmill.RMViewer.processMouseEvent(RMViewer.java:576)
	at java.awt.Component.processEvent(Component.java:6032)
	at java.awt.Container.processEvent(Container.java:2041)
	at java.awt.Component.dispatchEventImpl(Component.java:4630)
	at java.awt.Container.dispatchEventImpl(Container.java:2099)
	at java.awt.Component.dispatchEvent(Component.java:4460)
	at java.awt.LightweightDispatcher.retargetMouseEvent(Container.java:4577)
	at java.awt.LightweightDispatcher.processMouseEvent(Container.java:4235)
	at java.awt.LightweightDispatcher.dispatchEvent(Container.java:4168)
	at java.awt.Container.dispatchEventImpl(Container.java:2085)
	at java.awt.Window.dispatchEventImpl(Window.java:2478)
	at java.awt.Component.dispatchEvent(Component.java:4460)
	at java.awt.EventQueue.dispatchEvent(EventQueue.java:599)
	at java.awt.EventDispatchThread.pumpOneEventForFilters(EventDispatchThread.java:269)
	at java.awt.EventDispatchThread.pumpEventsForFilter(EventDispatchThread.java:184)
	at java.awt.EventDispatchThread.pumpEventsForFilter(EventDispatchThread.java:178)
	at java.awt.Dialog$1.run(Dialog.java:1046)
	at java.awt.Dialog$3.run(Dialog.java:1098)
	at java.security.AccessController.doPrivileged(Native Method)
	at java.awt.Dialog.show(Dialog.java:1096)
	at java.awt.Component.show(Component.java:1563)
	at java.awt.Component.setVisible(Component.java:1515)
	at java.awt.Window.setVisible(Window.java:842)
	at java.awt.Dialog.setVisible(Dialog.java:986)
	at com.inductiveautomation.factorypmi.designer.property.CustomizerDialog.setVisible(CustomizerDialog.java:153)
	at com.inductiveautomation.factorypmi.designer.property.propertytable.PropertyTablePanel.handleCustomizerAction(PropertyTablePanel.java:217)
	at com.inductiveautomation.factorypmi.designer.workspace.WindowWorkspace.handleDoubleClick(WindowWorkspace.java:940)
	at com.inductiveautomation.ignition.designer.designable.tools.SelectionTool.onDoubleClick(SelectionTool.java:524)
	at com.inductiveautomation.ignition.designer.designable.DesignPanel$ToolMouseListener.onClick(DesignPanel.java:986)
	at com.inductiveautomation.ignition.client.util.gui.CommonMouseAdapter.mouseReleased(CommonMouseAdapter.java:69)
	at java.awt.AWTEventMulticaster.mouseReleased(AWTEventMulticaster.java:273)
	at java.awt.AWTEventMulticaster.mouseReleased(AWTEventMulticaster.java:272)
	at java.awt.AWTEventMulticaster.mouseReleased(AWTEventMulticaster.java:272)
	at java.awt.AWTEventMulticaster.mouseReleased(AWTEventMulticaster.java:272)
	at java.awt.Component.processMouseEvent(Component.java:6267)
	at javax.swing.JComponent.processMouseEvent(JComponent.java:3267)
	at java.awt.Component.processEvent(Component.java:6032)
	at java.awt.Container.processEvent(Container.java:2041)
	at java.awt.Component.dispatchEventImpl(Component.java:4630)
	at java.awt.Container.dispatchEventImpl(Container.java:2099)
	at java.awt.Component.dispatchEvent(Component.java:4460)
	at java.awt.LightweightDispatcher.retargetMouseEvent(Container.java:4577)
	at java.awt.LightweightDispatcher.processMouseEvent(Container.java:4238)
	at java.awt.LightweightDispatcher.dispatchEvent(Container.java:4168)
	at java.awt.Container.dispatchEventImpl(Container.java:2085)
	at java.awt.Window.dispatchEventImpl(Window.java:2478)
	at java.awt.Component.dispatchEvent(Component.java:4460)
	at java.awt.EventQueue.dispatchEvent(EventQueue.java:599)
	at java.awt.EventDispatchThread.pumpOneEventForFilters(EventDispatchThread.java:269)
	at java.awt.EventDispatchThread.pumpEventsForFilter(EventDispatchThread.java:184)
	at java.awt.EventDispatchThread.pumpEventsForHierarchy(EventDispatchThread.java:174)
	at java.awt.EventDispatchThread.pumpEvents(EventDispatchThread.java:169)
	at java.awt.EventDispatchThread.pumpEvents(EventDispatchThread.java:161)
	at java.awt.EventDispatchThread.run(EventDispatchThread.java:122)

Ignition v7.3.4 (b599)
Java: Sun Microsystems Inc. 1.6.0_22

Yeah, the report designer can be a little hard to work with at times. Glad you got it working. :smiley:

For anyone else who comes across this thread (including future me), you can avoid having to put the image in a table:

If your image is inside a dataset, you can use “ImageObject[0].Data”.

The confusing thing is that in the rest of the report interface “ImageObject.Data” works, and automatically uses the first row, but this shortcut does not work for the image placeholder component.