Jaspersoft BI Tools

iReport,Jaspersoft Design Studio,Jaspersoft Server, Schema Workbench,Analysis,Dashboards, Self Service BI, Domains,Topics,Ad-Hoc Reports, Jaspersoft ETL, Embedding BI,HTML-5 charts, Fusion Charts,JFree Charts,Drill down reports , Drill down Dashboards,Visualize.js, Performance Tuning, D3 Charts, Jaspersoft Customization

Tuesday, April 17, 2018

Horizontal bullet widget visualization example in Jasper reports 6.4.2 or later

Hi folks, 

In this page, you would see how to work with Horizontal bullet widget that should look like as shown in below sample output. 
Bullet widget takes two values.
1) Bullet Value
2) Target Value

Using this visualization one can plot a value against a target having different ranges.

Sample query for this visualization is : 
SELECT  47 AS value, 78 AS target FROM customer limit 1

In the widget properties provide these values as shown in below image.

For color range, provide min and max values as follows

red --> min=0 max=30
yellow --> min=31 max=45
green --> min =46 max=85
blue --> min=86 max=100

To get the exact look and feel as shown in top of the post, play with Widget properties
For instance, below image would give an idea


Save your report and preview the visualization. This way, the desired output can be visualized in jasper reports using Horizontal bullet widget.

- Sadakar Pochampalli

JRXML (Supports from 6.4.2 professional jasper studio, database : "foodmart" db of postgres)

<?xml version="1.0" encoding="UTF-8"?>
<!-- Created with Jaspersoft Studio version 6.4.2.final using JasperReports Library version 6.4.1  -->
<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="BulletChart" pageWidth="700" pageHeight="842" columnWidth="660" leftMargin="20" rightMargin="20" topMargin="20" bottomMargin="20" uuid="ce0d4c3e-a968-4446-bbf4-b5ee95e7a1d2">
<property name="com.jaspersoft.studio.unit." value="pixel"/>
<property name="com.jaspersoft.studio.unit.pageHeight" value="pixel"/>
<property name="com.jaspersoft.studio.unit.pageWidth" value="pixel"/>
<property name="com.jaspersoft.studio.unit.topMargin" value="pixel"/>
<property name="com.jaspersoft.studio.unit.bottomMargin" value="pixel"/>
<property name="com.jaspersoft.studio.unit.leftMargin" value="pixel"/>
<property name="com.jaspersoft.studio.unit.rightMargin" value="pixel"/>
<property name="com.jaspersoft.studio.unit.columnWidth" value="pixel"/>
<property name="com.jaspersoft.studio.unit.columnSpacing" value="pixel"/>
<property name="com.jaspersoft.studio.data.defaultdataadapter" value="foodmartlatha"/>
<property name="com.jaspersoft.studio.data.sql.tables" value=""/>
<property name="ireport.jasperserver.url" value="http://localhost:8080/jasperserver-pro/"/>
<property name="ireport.jasperserver.user" value="superuser"/>
<property name="ireport.jasperserver.report.resource" value="/EarthlySystems/Horizontal_Bullet_Widget_Chart_files/main_jrxml"/>
<property name="ireport.jasperserver.reportUnit" value="/EarthlySystems/Horizontal_Bullet_Widget_Chart"/>
<queryString>
<![CDATA[SELECT  47 AS value, 78 AS target FROM customer limit 1]]>
</queryString>
<field name="value" class="java.lang.Integer"/>
<field name="target" class="java.lang.Integer"/>
<background>
<band splitType="Stretch"/>
</background>
<summary>
<band height="116" splitType="Stretch">
<componentElement>
<reportElement x="0" y="71" width="640" height="45" uuid="10f1d42b-9236-40d3-aee0-cd4ab0954674">
<property name="com.jaspersoft.studio.unit.height" value="pixel"/>
</reportElement>
<fw:horizontalBullet xmlns:fw="http://jaspersoft.com/fusion" xsi:schemaLocation="http://jaspersoft.com/fusion http://jaspersoft.com/schema/fusion.xsd">
<fw:widgetProperty name="showLimits">
<fw:propertyExpression><![CDATA[Boolean.FALSE]]></fw:propertyExpression>
</fw:widgetProperty>
<fw:widgetProperty name="showTickValues">
<fw:propertyExpression><![CDATA[Boolean.FALSE]]></fw:propertyExpression>
</fw:widgetProperty>
<fw:widgetProperty name="setAdaptiveMin">
<fw:propertyExpression><![CDATA[Boolean.FALSE]]></fw:propertyExpression>
</fw:widgetProperty>
<fw:widgetProperty name="showTickMarks">
<fw:propertyExpression><![CDATA[Boolean.FALSE]]></fw:propertyExpression>
</fw:widgetProperty>
<fw:widgetProperty name="showValue">
<fw:propertyExpression><![CDATA[Boolean.FALSE]]></fw:propertyExpression>
</fw:widgetProperty>
<fw:widgetProperty name="showShadow">
<fw:propertyExpression><![CDATA[Boolean.FALSE]]></fw:propertyExpression>
</fw:widgetProperty>
<fw:widgetProperty name="ticksOnRight">
<fw:propertyExpression><![CDATA[Boolean.FALSE]]></fw:propertyExpression>
</fw:widgetProperty>
<fw:widgetProperty name="animation">
<fw:propertyExpression><![CDATA[Boolean.FALSE]]></fw:propertyExpression>
</fw:widgetProperty>
<fw:widgetProperty name="caption">
<fw:propertyExpression><![CDATA["rate of interest%"]]></fw:propertyExpression>
</fw:widgetProperty>
<fw:widgetProperty name="subCaption">
<fw:propertyExpression><![CDATA["(avg interest)"]]></fw:propertyExpression>
</fw:widgetProperty>
<fw:widgetProperty name="borderColor">
<fw:propertyExpression><![CDATA[new java.awt.Color(-1)]]></fw:propertyExpression>
</fw:widgetProperty>
<fw:widgetProperty name="paletteThemeColor">
<fw:propertyExpression><![CDATA[new java.awt.Color(-16777216)]]></fw:propertyExpression>
</fw:widgetProperty>
<fw:widgetProperty name="plotBorderColor">
<fw:propertyExpression><![CDATA[new java.awt.Color(-1)]]></fw:propertyExpression>
</fw:widgetProperty>
<fw:widgetProperty name="bgColor">
<fw:propertyExpression><![CDATA[new java.awt.Color(-1)]]></fw:propertyExpression>
</fw:widgetProperty>
<fw:widgetProperty name="baseFontColor">
<fw:propertyExpression><![CDATA[new java.awt.Color(-16777216)]]></fw:propertyExpression>
</fw:widgetProperty>
<dataset/>
<fw:valueExpression><![CDATA[new Double($F{value})]]></fw:valueExpression>
<fw:targetExpression><![CDATA[new Double($F{target})]]></fw:targetExpression>
<fw:colorRange color="#FF0000">
<fw:minValueExpression><![CDATA[0]]></fw:minValueExpression>
<fw:maxValueExpression><![CDATA[30]]></fw:maxValueExpression>
<fw:labelExpression><![CDATA["color1"]]></fw:labelExpression>
</fw:colorRange>
<fw:colorRange color="#FFFF00">
<fw:minValueExpression><![CDATA[31]]></fw:minValueExpression>
<fw:maxValueExpression><![CDATA[45]]></fw:maxValueExpression>
<fw:labelExpression><![CDATA["color2"]]></fw:labelExpression>
</fw:colorRange>
<fw:colorRange color="#008000">
<fw:minValueExpression><![CDATA[45]]></fw:minValueExpression>
<fw:maxValueExpression><![CDATA[85]]></fw:maxValueExpression>
<fw:labelExpression><![CDATA["color3"]]></fw:labelExpression>
</fw:colorRange>
<fw:colorRange color="#0000FF">
<fw:minValueExpression><![CDATA[86]]></fw:minValueExpression>
<fw:maxValueExpression><![CDATA[100]]></fw:maxValueExpression>
<fw:labelExpression><![CDATA["color4"]]></fw:labelExpression>
</fw:colorRange>
</fw:horizontalBullet>
</componentElement>
<textField>
<reportElement x="0" y="19" width="660" height="30" uuid="ec78046b-4fd5-4139-8ffe-1682459a7895"/>
<textElement textAlignment="Center" verticalAlignment="Middle">
<font size="18" isBold="true"/>
</textElement>
<textFieldExpression><![CDATA["Horizontal Bullet Widget Visualization Demo"]]></textFieldExpression>
</textField>
</band>
</summary>
</jasperReport>