Joget DX Available for Download
Check out Joget DX, the next generation successor to Joget Workflow for faster, simpler digital transformation.
Chart (Formally known as SQL Chart allows ) allows you to define your own SQL query to determine the charts that you would like to generate, ranging from a number of graph types.
Figure 1: SQL Chart Properties
Item link slug. Optional field.
|Label||Menu label. Mandatory field.|
Chart Title to be displayed part of the generated graph.
Figure 2: SQL Chart Properties - Datasource
When Datasource is set to "Using Data Binder", this option will show up.
Please see Datalist Binder for available binder to use.
When Datasource is set to use any of the "Datasource", this option will show up.
SQL Query to produce the dataset required for the graph type.
The first column to be returned from the query must be a label (X-axis), followed by value columns for the Y-axis.
Figure 3: SQL Chart Properties - Data Binder & Chart Data Mapping (applicable for - using Data Binder)
|Order By||Column to be sorted in the graph dataset. This would affect how the graph is plotted.|
Figure 4: SQL Chart Properties - Chart Options (applicable for - using Datasource)
X-axis display as
|If checked, legend will be shown in the generated graph.|
Show Value Label in Chart?
|If checked, value label will be shown in the generated graph.|
|If checked, this will affect the generated graph.|
Display as Horizontal Chart?
|Display as Horizontal Chart.|
Width in character.
Height in character.
Series color. Optional field.
Comma separated values (CSV) of color codes.
Figure 5: SQL Chart Properties - Advanced
Userview Key Name
When defined, additional condition will be appended using the value defined here as the parameter and the userview key value as the value.
When userview key value is defined, you may define #userviewKey# in your SQL query to have it replaced with the userview key value.
|Custom Header in HTML.|
|Custom Footer in HTML.|
The following code can be modified and put in "Custom Footer" for interactive Chart.