Report Designer: Image Placeholder Help

Ignition
1

I’m attempting to use the “Image Placeholder” component in the Report Designer, and have some questions. Basically, what I am wanting to do is to use the Image placeholder to display a picture of a graph (an Equipment Schedule Component from the root container) in the Report Designer. The report designer has some good functions, but it can’t make what I want to display in the Equipment Schedule Component. I want to make some special plots using the Ignition components and include them in the Report, thereby extending the functionality of the Report Designer.

I can get an java.awt.image.BufferedImage object by:

img=system.print.createImage(event.source.parent.getComponent('Equipment Schedule'))

but I can’t figure out how to convert this object to a Byte Array needed by the Image Placeholder. I want to eventually get to:

event.source.parent.getComponent('Report Viewer').imagedata=system.dataset.toDataSet(bytedataforimage)

but I am missing the conversion code between it.

In the Report designer, I have a custom property “imagedata” as an empty dataset, which is set as the “key” of the Image Placeholder. If I write the byte array to that dataset, it should work to create an image of the equipment schedule.

So, how do I convert from the Buffered Image to a Byte Array that I can write to a dataset? I can’t find a method in the javax.imageio class to help, and there’s no BufferedImage.toByteArray() function available natively. Thanks.

2

To convert an image in to a byte array you will need to do something like this.

from javax.imageio import
from java.io import ByteArrayOutputStream
 
chart = event.source.getComponent("Easy Chart")
 
bufferedImg = system.print.createImage(chart)
baos = ByteArrayOutputStream()
ImageIO.write(bufferedImg, "PNG", baos)
bytes = baos.toByteArray()
 
ds = system.dataset.toDataset(["bytes"], [[bytes]])
 
report = event.source.parent.getComponent("Report Viewer")
report.ChartImage = ds

Then once you have that byte array the only other tricky step to remember is that you will need to set the key for the Image Placeholder to ChartImage.bytes[0][0]

3

Yep, that works perfectly and I’ve found it to be an excellent way of augmenting the functionality of the Report Designer with other Ignition components. My reports are now much more interesting…thanks!