Help:Jqplotseries format
| Jqplotseries format | |
|---|---|
| enable sets of numerical data to be displayed as a chart series using the jqPlot Javascript library | |
| Scenarios, examples, demos | |
| Example: | Category:Jqplotseries examples |
| Collection | |
Loading... | |
| Further Information | |
| Provided by: | Extension "Semantic Result Formats" |
| Added: | 1.8.0 |
| Removed: | still supported |
| Requirements: | none |
| Format name: | jqplotseries |
| Enabled? Indicates whether the result format is enabled by default upon installation of the respective extension. | Yes |
| Authors: | James Hong Kong |
| Categories: | charts |
| Group: | jqPlot , data visualization |
| Table of Contents | |
The result format jqplotseries, enables a set of numerical data to be displayed as a chart series using the jqPlot Javascript library.
The ['group'] (property, subject) parameter is used as indicator to distinguish between different sets of data within the same result set.
jqplotseries is an experimental printer supporting different chart layouts such as bar, line, stacked bar/line, and bubble charts.
Parameters[edit]
| Parameter | Type | Default | Description |
|---|---|---|---|
| min | whole number | no | The minimum value to show on the Y-axis |
| direction | text | vertical | Specify the direction of a chart or graph |
| charttitle | text | empty | The title of the chart |
| charttext | text | empty | Descriptive chart text |
| numbersaxislabel | text | empty | The label for the numbers axis |
| labelaxislabel | text | empty | The label for the label axis |
| height | whole number | 400 | Specify the height (in pixels) of a chart or graph |
| width | text | 100% | Specify the width (in pixels or percent) of a chart or graph |
| smoothlines | yes/no | no | Apply a smoothing algorithm on line charts |
| valueformat | text | %d | Specify formatting rule for values |
| ticklabels | yes/no | yes | Enable display of tick labels |
| highlighter | yes/no | no | Display a data point highlighter |
| theme | text | empty | Select a grid theme |
| filling | yes/no | yes | Individual filling option |
| chartlegend | text | none | Chart legend position |
| datalabels | text | none | Chart/graph data labels |
| colorscheme | text | empty | Select a color scheme |
| chartcolor | text | empty | Assign individual chart colors |
| class | text | empty | Specify an additional cascading style sheet class |
| infotext | text | empty | Display additional information on a corresponding info tab |
| stackseries | yes/no | no | Display chart as stacked series |
| group | text | subject | Series grouped by |
| grouplabel | text | subject | Determine the group label |
| charttype | text | bar | Available chart type |
| trendline | text | none | Enable simultaneous display of a chart and its trendline |
| cursor | text | none | Chart cursor display option |
| gridview | text | none | Display chart and data sets simultaneously. Allowed values: "none" and "tabs". Default: "none" |
| hidezeroes | yes/no | no | Hide zero values from the chart |
Parameter options[edit]
- chartlegend ( 'none', 'nw','n', 'ne', 'e', 'se', 's', 'sw', 'w' )
- charttype( 'bar', 'line', 'donut', 'bubble', 'scatter' )
- colorscheme ( see
$srfgColorScheme) - datalabels ( 'none', 'value', 'label', 'percent' )
- direction ( 'horizontal', 'vertical' )
- group ( 'property' , 'subject' )
- grouplabel ( 'property' , 'subject' )
- startangle ( '10', etc. ) some number between 0 and 359 for charttype donut
- theme ( 'vector', 'simple' )
How to group data sets[edit]
Depending of its source (page as subject, or property as subject marker), data can be grouped either as "property" or "subject" with some chart types require a certain order of how data are presented as rows/columns.
How to influence display and styling[edit]
The height and width parameter are responsible for specifying a charts dimension while the class parameter can be used to adjust its position within page (float right, float left etc. see some examples here)
Another possibility to influence the display is to use the parameter "tableview" showing a chart and its corresponding datatable next to each other using a tabs ui (see here).
Usage[edit]
Bubble chart[edit]
The bubble chart is expecting data in a pre-defined order with properties representing a specific container class of content. Each data row is expected to be defined by four columns including a label (string type), x value (number type), y value (number type), and radius value (number type).
Data model[edit]
| Column 0 | Column 1 | Column 2 | Column 3 | |
|---|---|---|---|---|
| Purpose | Label | X value | Y value | Radius |
| Data Type | string | number | number | number |
| Role | data | data | data | data |
Scatter plot[edit]
The scatter plot requires that x-axis values are of type string therefore a data set declaration should include [x as (string), x as(number), y(number), y2 ... ). A regression (trendline) will be generated for available data sets.
Data model[edit]
| Column 0 | Column 1 | ... | Column N | |
|---|---|---|---|---|
| Purpose | Data point X values | Series 1 Y values | ... | Series N Y values |
| Data Type | number | number | ... | number |
| Role | data | data | ... | data |
Examples[edit]
- Jqplotseries/An experimental study using scatter plots
- Jqplotseries/Bubble chart
- Jqplotseries/City data
- Jqplotseries/Data
- Jqplotseries/Data sets with different grouping
- Jqplotseries/Donut chart to display series data
- Scatter plot (x, y) values for a set of data ...
- Stacked series resulting bar/line shows the combined result of that group ...
Best practices
- Experimental study of the effect of three different methods of instruction on reading comprehension in children ...
- Survey how to visualize survey data using stacked bar from different sources ...
See also[edit]
- jqplotseries and jqplotchart do not support the display in tabs (or headertabs), if you are interested in a solution please visit the following website.
