Heatbar, dynamic position offset of text

Question

I want to insert a new column in my report to graphically display a "needle" displaying the position in a range of 0% - 100% like so:

I am looking for ideas please!

My idea

Use graphic (rainbow 0%-100% in every detail column). Use a pixel offset (somehow??) where I simply place an overly large "|" type. So if 0%-100% are 200px that would mean that to display the needle at 50% I would offset the type 100px!

Another possibility is to create a [Chart Customizer](https://community.jaspersoft.com/documentation/tibco-jaspersoft-studio-user-guide/v640/chart-customizers). [Customizers](http://jasperreports.sourceforge.net/sample.reference/chartcustomizers/index.html) are based on JFreeChart, so you can change the look and feel of a [MinMaxCategoryRenderer](http://www.jfree.org/jfreechart/api/javadoc/org/jfree/chart/renderer/category/MinMaxCategoryRenderer.html), for example. See: https://stackoverflow.com/a/40275190/59087 — Dave Jarvis, Nov 07 '18 at 17:13
Ok. I can work with Adobe Illustrator just fine, yet I fail to understand how to manipulate the needle! (the black bar from my example) via java (iText)? I am already doing manipulation via java with "logawie iText (PDF Stamper)" - also I would guess that chartcustomizers (I already use those as well in other reports) are not an option in a report that has maybe a 1000 lines - each containing a chart needing to run the customizer — DavidDunham, Nov 08 '18 at 06:39

score 2 · Answer 1 · edited Nov 08 '18 at 16:41

The easiest / most straightforward option I have found and implemented:

<image scaleImage="RetainShape" onErrorType="Blank">
    <reportElement x="575" y="1" width="100" height="13" uuid="7cf54aff-65ac-40e5-8dc9-7f95d6f34d49"/>
        <imageExpression>
        <![CDATA[net.sf.jasperreports.renderers.BatikRenderer.getInstanceFromText("
        <svg id=\"Layer_1\" data-name=\"Layer 1\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" width=\"100\" height=\"13\" viewBox=\"0 0 100 13\">
            <defs>
            <linearGradient id=\"linear-gradient\" x1=\"-176.88\" y1=\"316.13\" x2=\"-150.45\" y2=\"316.13\" gradientTransform=\"matrix(3.78, 0, 0, -3.78, 689.01, 1202.56)\" gradientUnits=\"userSpaceOnUse\">
            <stop offset=\"0\" stop-color=\"green\"/>
            <stop offset=\"1\" stop-color=\"green\" stop-opacity=\"0\"/>
            </linearGradient>
            </defs>
            <path d=\"M0,1.26H100v10.4H0Z\" style=\"fill: url(#linear-gradient)\"/>
            <path d=\"M" + !!! OFFSET CALCULATION !!! + ",0V13\" style=\"fill: none;stroke: #000\"/>
        </svg>
        ")]]></imageExpression>
</image>

Result:

That's nice and simple. Try replacing `\"` with `'`. – Dave Jarvis Nov 08 '18 at 16:43 — Dave Jarvis, Nov 08 '18 at 16:43

Heatbar, dynamic position offset of text

1 Answers1