Versions Compared

Old Version 15

changes.mady.by.user Aadrian Zarin

Saved on

compared with

New Version 16

changes.mady.by.user Justin

Saved on

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

...

NameDescriptionScreens (Click to view)
X-axis Label 
X-axis Label 


Figure 4: Chart Options

X-axis display as
  • Category
  • Number
  • Date
Y-axis Label 
Y-axis Label 
Y-axis Prefix
Y-axis Prefix
Show Legend?
If checked, the legend will be shown in the generated graph.
Show Value Label in Chart?
If checked, the value label will be shown in the generated graph.
Stack Series?
If checked, this will affect the generated graph.
Display as Horizontal Chart?
Display as Horizontal Chart.
Width 

Width in character, for example 100%.

Height 

Height in character, example 300px.

Colors

Series color. Optional field.

Comma-separated values (CSV) of color codes.

Example 1: #3333FF,#66FF00,#FF9933,#990000


Example 2: red,orange,yellow,green,blue,indigo

Info
titleWhat are the default colors?

http://stackoverflow.com/questions/18332440/what-are-the-jqplot-default-series-colors

...


Advanced Properties

NameDescriptionScreens (Click to view)
Userview Key Name

When defined, the additional conditions will be appended using the value defined here as the parameter and the userview key value as the value.

Info
titleExample

SQL: SELECT category, count(category) FROM table1

Userview Key Name: type

Userview Key Value: val

Resultant SQL:  SELECT category, count(category) FROM table1 WHERE type = 'val'

When userview key value is defined, you may define #userviewKey# in your SQL query to have it replaced with the userview key value.

Info
titleExample

SQL: SELECT category, count(category) FROM table1 WHERE type = '#userviewKey#'

Userview Key Value: val

Resultant SQL:  SELECT category, count(category) FROM table1 WHERE type = 'val'

Figure 5: Advanced Properties

Custom Header
Custom Header in HTML.
Custom Footer
Custom Footer in HTML.

...

Note

 The charts are plotted using jqPlot. Head over to their website here to see the full list of available hooks for customization.


Hide gridlines from Chart Plot

The following code can be modified and put in "Custom Header" property, to hide gridlines from the chart plot.

Code Block
languagejs
<script>
    $(function(){
        $.jqplot.preParseOptionsHooks.push(function(args){
            args.axesDefaults.drawMajorGridlines = false;
        });
    });
</script>

Interactive Chart

The following code can be modified and put in "Custom Footer" for interactive Charts.

...