This type of box is used to represent the information returned by a SQL query graphically. Using this utility it is possible to define different types of graphics in a form in a very simple way.

1 Types of graphics

Type of graphic Display
Timeseries
Cartesian
Pie
Gantt
Gauge
Heatmap
Funnel
Polar
Histogram

2 Parameters

Structure

Loading...

2.1 Main box


  • JChart allows the creation of a wide variety of both interactive and non-interactive charts.

  • Supports a number of various charts, including combined charts:

    • X-Y charts (line, spline and scatter). Time axis is possible.
    • Pie charts
    • Gantt charts
    • Bar charts (horizontal and vertical, stacked and independent). It also has built-in histogram plotting.
    • Single valued (thermometer, compass, speedometer) that can then be placed over map.
    • Various specific charts (wind chart, polar chart, bubbles of varying size, etc.).
wic_jrep_box_sqljcharth
Label Description
Id Identifier of the box

  • Default: THIS
Chart type Chart type

  • Default: 0
  • Values:
    • 0: Timeseries.
    • 1: Cartesian.
    • 2: Pie.
    • 3: Gantt.
    • 4: Gauge.
    • 5: Heatmap.
    • 6: Funnel.
    • 7: Polar.
    • 8: Histogram.
Title
Label Y axis Label Y axis
Data X axis (table)
Data X axis(column) Data of the X axis(columna)
Legend Legend

  • Default: 0
  • Values:
    • 1: Yes.
    • 0: No.
Interactive checkbox to indicate if the chart is interactive

  • Default: 0
  • Values:
    • 1: Yes.
    • 0: No.
Simbology
Filter column
Mode

  • Default: 0
  • Values:
    • 0: One chart.
    • 1: Combobox filter.
    • 2: Multiple charts.
Column number
SQL Stmt SQL Stmt

  • Format: SQLCOND_EXPR
jchart_sqlstmt_backup
Bar stacking Bar stacking mode

  • Default: 0
  • Values:
    • 0: None.
    • 1: Value.
    • 2: Percent.
Column stacking Column stacking mode

  • Default: 0
  • Values:
    • 0: None.
    • 1: Value.
    • 2: Percent.
Area stacking Area stacking mode

  • Default: 0
  • Values:
    • 0: None.
    • 1: Value.
    • 2: Percent.
Line stacking Line stacking mode

  • Default: 0
  • Values:
    • 0: None.
    • 1: Value.
    • 2: Percent.
Created by

  • Default: USER
Date created

  • Default: CURRENT
Modified by

  • Default: USER
Date updated Updated date

  • Default: CURRENT

2.2 Series


wic_jrep_box_sqljchartl
Label Description
Id Identifier of the box
Series type Series type

  • Default: 0
  • Values:
    • 0: Line.
    • 1: Column.
    • 2: Área.
    • 3: Scatter.
    • 4: Candlestick.
    • 5: Spline.
    • 6: Area-spline.
    • 7: Pie.
    • 8: Bar.
    • 9: Gantt.
    • 10: Gauge.
    • 11: Funnel.
Table Table of the diagram
Series data (table|column) Series data (table|column)
Own axis
Group Group of the diagram
Color Color

Link code Link code for SQL Objectl
Condition SQL condition
Created by
Date created
Modified by
Date updated

3 Examples

3.1 Type of graphic


Total SQL statement of sales, number of invoices per year and month

Copy 
<select>
	    <columns>
	        YEAR(invoicedate)  the_year,
	        MONTH(invoice.invoicedate) <alias name='the_month' />,
	        COUNT(*) <alias name='the_count' />,
	        SUM(invoice.total) <alias name='total' />
	    </columns>
	    <from table='invoice'/>    
	    <group>1,2</group>
	    <order>1,2</order>
	</select>

3.1.1 X axis

(1) In the table logic dictionary there is a record for the ideomatic translation of the column 'the_month'.

3.1.2 Y axis

(2) In the forms tag editor there is a record for the ideomatic translation of the code 'HDR_TOTAL'.

3.1.3 Legend

(3) For each of the series the ideomatic translation is shown in the logical table dictionary.

In this example, the total and the count (number of invoices).


Dictionary of tables:


The titles of the legend can be turned on or off to show or hide the series on the chart.


3.1.4 Filter by combo

(4) Value of the column of the SQL statement used in the filter.

In this example, the year


3.2 Symbology ranges

The symbology field is only applicable to gauge and heatmap modes

For the gauge type chart, a symbology of ranges from 0 to 100 is parameterized, showing the percentage of sale of each year with respect to the total.


Parameterization of the box.


* Creation of the symbology.


In this example 3 symbologies are created with a range from 0 to 25, from 25 to 75 and from 75 to 100.

3.3 Stacking

Stacking series of the same type.

In this example, column stacking is shown by value or percentage.

Starting from the sentence: sales by month and year obtaining the total of sale, the number of documents and the percentage with respect to the other months.

Since the series are of column type, the parameterized stacking is (column stacking).

Copy 
<select>
    <columns>
       the_year,
       the_month,
       the_total,
       the_count, 
       ROUND( (the_total) * 100 / (SELECT SUM(total) FROM  invoice WHERE MONTH(invoice.invoicedate) = the_month ),2) month_percent
    </columns>
    <from alias="itotal">
        <select>
            <columns>
                YEAR(invoicedate) <alias name='the_year' />,
                MONTH(invoice.invoicedate) <alias name='the_month' />,
                SUM(total) <alias name='the_total' />,
                COUNT(*) <alias name='the_count' />
            </columns>
            <from table="invoice" />
            <group>1,2</group>
        </select>
    </from>
    <order>1</order>    
</select>

Parameterization of the box.


Parameterization of the series.


3.3.1 Stacking value

3.3.2 Stacking percentage

3.4 Filter column

This example shows the total monthly sales and the number of invoices in a polar type chart.

A filter is added per year, to be able to visualize the data of a year, in combo mode and in multiple graphics mode.

The SQL statement used is:

Copy 
<select>
    <columns>
        YEAR(invoicedate)  <alias name='the_year' />,
        MONTH(invoice.invoicedate) <alias name='the_month' />,
        COUNT(*) <alias name='the_count' />,
        SUM(invoice.total) <alias name='total' />
    </columns>
    <from table='invoice'/>    
    <group>1,2</group>
    <order>1,2</order>
</select>

3.4.1 Filter by combo



3.4.2 Multiple graphics



3.5 Series

3.5.1 Types of series

Type of series Display
Line
Column
Area
Scatter
Spline
Area-spline
Pie
Bar

3.5.2 Groups in series

In this example, a pie chart with two series will be shown, representing the number of sales per year and artist.

Copy 
<select>
    <columns>
        YEAR(invoicedate)  <alias name='the_year'/>,
        artist.name, 
        COUNT(*) the_count
    </columns>    
    <from table='invoice'>
        <join table='invoiceline'>
            <on>invoice.invoiceid = invoiceline.invoiceid</on>
            <join table='track'>
                <on>track.trackid = invoiceline.trackid</on>
                <join table='album'>
                    <on>track.albumid = album.albumid</on>
                    <join table='artist'>
                        <on>album.artistid = artist.artistid</on>	
                    </join>	
                </join>		
            </join>	
        </join>                    
    </from>
    <where>
       artist.name IN('Pink Floyd','The Clash','R.E.M.') 
    </where>    
    <group>1,2</group>
</select>

3.5.3 Own axis in series

Used to indicate that the values of the series contain a measure of their own.

In this example we show two series, one with a total amount and another with a number of documents.

In the parameterization of the series for the column 'the_count' an own axis is established.

The sentence used is the following: (Sales and number of documents per month and year.)

Copy 
<select>
    <columns>
        YEAR(invoicedate)  the_year,
        MONTH(invoice.invoicedate) <alias name='the_month' />,
        COUNT(*) <alias name='the_count' />,
        SUM(invoice.total) <alias name='the_total' />
    </columns>
    <from table='invoice'/>    
    <group>1,2</group>
    <order>1,2</order>
</select>


3.5.4 Code link in series

Used to make a link to another object using the data of the series as a filter.

In this example, the total sales per month and year will be displayed, adding a link to show the data associated with the series.

The link object is invoice maintenance invoice and the parameterized condition is:

Copy 
YEAR(invoicedate)  = '#the_year' AND MONTH(invoice.invoicedate) = '#the_month'

The character ' #' + code of the column is used to obtain the value of the main cursor series and use it as a filter.



* The graph and the result are displayed after clicking on the column for the month of August (8).




All invoices for August 2009.

The invoice object was executed using the following statement:

Copy 
SELECT
invoice.rowid,
invoice.invoiceid,
invoice.customerid,
NVL(TRIM(customer.firstname), '') || ' ' ||
NVL(TRIM(customer.lastname),  '') customer_name,
invoice.invoicedate,
invoice.billingaddress,
invoice.billingcity,
invoice.billingstate,
invoice.billingcountry,
invoice.billingpostalcode,
invoice.total

FROM invoice
,OUTER customer
WHERE
invoice.customerid = customer.customerid
-- =================================================================================
--  Query condition ($0) + non XML security filters 
-- =================================================================================
   AND YEAR(invoicedate)  = '2009' AND MONTH(invoice.invoicedate) = '8' AND 1=0

Adding the filter of year and month parameterized in the condition of the series.

3.5.5 Colors in series

Hexadecimal value of the color to represent for the series.

Allowing to modify the color that you want to represent for each series.

This example shows the series of sales total with a purple color and the number of sales with a green color.



3.5.6 Series auto

When realizing a pivot of a set of values, the number of columns is variable.

They can be respresentadas of automatic form by means of the reserved word ' auto'.

Monthly sales per year, pivoting the country to be represented in the series.



  1. Graph type selector Cartesian
  2. Column of the sentence with temporary value, in this case the month the_month
  3. Flag legend activated to show the different series and also be able to use them as a filter.
  4. Filter by combo of the column The_year and thus be able to filter the graph by years.
  5. SQL statement to execute, in this case: XSQL-Script embedded.
Read more about XSQL-Script
Copy 
<call>
<![CDATA[
<xsql-script>
   <body>
       <vtable name='v_out'>
           <select>
                <columns>
                    customer.country,
                    year(invoicedate) the_year,
                     month(invoicedate) the_month,
                    SUM(invoice.total) total
                </columns>    
                <from table='invoice'>                    
                    <join table='customer'>
                        <on>invoice.customerid = customer.customerid</on>		
                    </join>	
                </from>
                <group>1,2,3</group>
                <order>2,3</order>
            </select>
        </vtable>
        <return><vtable.pivot name='v_out' pivotcolumns='country' pivotsort='the_year' datacolumns='total' /></return>
   </body>
</xsql-script>
]]>
</call>

* The process makes a pivot on the data, to transfer in columns the different values per country.


The parameterization of the series is:



The auto series is modified with a column parameter and a stacked value is made in columns in the box.




The result:



Filtering with the legend: