The byte array is not a recognized imageformat - Custom Visualization Component not working in PDF mode

[greta.vala]

I'm trying to create a PDF with Custom Visualization Component but I'm getting the following error while running it:

net.sf.jasperreports.engine.JRRuntimeException: net.sf.jasperreports.engine.JRException: java.io.IOException: The byte array is not a recognized imageformat.    at com.jaspersoft.jasperreports.customvisualization.export.CVElementPdfHandler.exportElement(CVElementPdfHandler.java:69)    at net.sf.jasperreports.engine.export.JRPdfExporter.exportGenericElement(JRPdfExporter.java:3215)    at net.sf.jasperreports.engine.export.JRPdfExporter.exportElements(JRPdfExporter.java:1117)    at net.sf.jasperreports.engine.export.JRPdfExporter.exportPage(JRPdfExporter.java:1068)    at net.sf.jasperreports.engine.export.JRPdfExporter.exportReportToStream(JRPdfExporter.java:932)    at net.sf.jasperreports.engine.export.JRPdfExporter.exportReport(JRPdfExporter.java:552)    at com.jaspersoft.studio.editor.preview.actions.export.AExportAction.exportWithProgress(AExportAction.java:223)    at com.jaspersoft.studio.editor.preview.actions.export.AExportAction.doPreview(AExportAction.java:347)    at com.jaspersoft.studio.editor.preview.actions.export.AExportAction$3.run(AExportAction.java:191)    at org.eclipse.core.internal.jobs.Worker.run(Worker.java:55)Caused by: net.sf.jasperreports.engine.JRException: java.io.IOException: The byte array is not a recognized imageformat.    at net.sf.jasperreports.engine.export.JRPdfExporter$InternalImageProcessor.processImageRetainShape(JRPdfExporter.java:1764)    at net.sf.jasperreports.engine.export.JRPdfExporter$InternalImageProcessor.process(JRPdfExporter.java:1621)    at net.sf.jasperreports.engine.export.JRPdfExporter$InternalImageProcessor.access$300(JRPdfExporter.java:1547)    at net.sf.jasperreports.engine.export.JRPdfExporter.exportImage(JRPdfExporter.java:1487)    at com.jaspersoft.jasperreports.customvisualization.export.CVElementPdfHandler.exportElement(CVElementPdfHandler.java:61)    ... 9 moreCaused by: java.io.IOException: The byte array is not a recognized imageformat.    at com.lowagie.text.Image.getInstance(Unknown Source)    at net.sf.jasperreports.engine.export.JRPdfExporter$InternalImageProcessor.processImageRetainShape(JRPdfExporter.java:1759)    ... 13 more[/code]

 

This is my .jrxml:

<?xml version="1.0" encoding="UTF-8"?><!-- Created with Jaspersoft Studio version 7.1.0.final using JasperReports Library version 6.4.3  --><jasperReport xmlns="http://jasperreports.sourceforge.net/jasperreports" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://jasperreports.sourceforge.net/jasperreports http://jasperreports.sourceforge.net/xsd/jasperreport.xsd" name="TOI_Circle_test" pageWidth="595" pageHeight="842" columnWidth="555" leftMargin="20" rightMargin="20" topMargin="20" bottomMargin="20" uuid="31c5bd3e-7f1a-4ab1-b4e4-a617f592984c">    <property name="com.jaspersoft.studio.data.defaultdataadapter" value="One Empty Record"/>    <property name="ireport.jasperserver.url" value="[[url]]"/>    <property name="ireport.jasperserver.user" value="[[uSER]]"/>    <property name="ireport.jasperserver.reportUnit" value="[[PATH]]"/>    <parameter name="pProfit" class="java.lang.Long"/>    <queryString language="SQL">        <![CDATA[]]>    </queryString>    <title>        <band height="376" splitType="Stretch">            <componentElement>                <reportElement x="0" y="100" width="555" height="276" uuid="fbb36477-0a3a-4763-98ce-94237b08671e"/>                <cvc:customvisualization xmlns:cvc="http://www.jaspersoft.com/cvcomponent" xsi:schemaLocation="http://www.jaspersoft.com/cvcomponent http://www.jaspersoft.com/cvcomponent/component.xsd" evaluationTime="Report">                    <cvc:itemProperty name="script" value="CVCGuage.min.js"/>                    <cvc:itemProperty name="module" value="cvcguage"/>                    <cvc:itemProperty name="css" value="CVCGuage.css"/>                    <cvc:cvData>                        <cvc:item>                            <cvc:itemProperty name="profit">                                <valueExpression><![CDATA[$P{pProfit}]]></valueExpression>                            </cvc:itemProperty>                        </cvc:item>                    </cvc:cvData>                </cvc:customvisualization>            </componentElement>            <staticText>                <reportElement x="0" y="33" width="555" height="30" uuid="ec1b8809-255d-42d4-9d68-65a847de2904"/>                <textElement textAlignment="Center" verticalAlignment="Middle">                    <font size="16" isBold="false"/>                </textElement>                <text><![CDATA[CVC Demo]]></text>            </staticText>        </band>    </title></jasperReport>[/code]

And this is a simple .js I used, it showld only draw a static circle:

define('cvcguage',['d3', 'jquery', 'liquidFillGauge'], function (d3) {     return function (instanceData) {                     var w = instanceData.width,                    h = instanceData.height;        var margin = 20;        var diameter = Math.min(w,h) - margin;        var svg = d3.select("#" + instanceData.id).insert("svg")                    .attr("id", instanceData.id + "svg")                    .attr("width", w)                    .attr("height", h);         var circle = svg.append("circle")                        .attr("cx", w/2)                        .attr("cy", h/2)                        .attr("r", diameter/2);                    };        });[/code]

If I run it in HTML mode it works fine, but I need to use Custom Visualization Component in a PDF and I can't make it work.

Can someone please help me?

Thanks a lot.

[samuelgaraymen]

If  you are trying to use a QR code with the Barcode4j component, I solved this problem by setting the property

net.sf.jasperreports.components.barcode4j.image.producer = image

This way we override the default value "svg" to "image". For some reason it fails with svg producer (At least in 6.14 JasperReports Library version).

[lfernandortiz]

Hi, I also have the same problem with the custom visualization component, but I could not solve it. If you already I would really appreciate it if you share the solution.