Difference between revisions of "Chart"
Jump to navigation
Jump to search
| Line 53: | Line 53: | ||
|colspan="2"|value[n] | |colspan="2"|value[n] | ||
| − | |Same as "value", but | + | |Same as "value", but applies to a specific set of values |
|- | |- | ||
| Line 65: | Line 65: | ||
|colspan="2"|values[n] | |colspan="2"|values[n] | ||
| − | |Same as "values", but | + | |Same as "values", but applies to a specific set of values |
|- | |- | ||
| Line 101: | Line 101: | ||
|colspan="2"|valuelabels[n] | |colspan="2"|valuelabels[n] | ||
| − | |Same as "valuelabels", but | + | |Same as "valuelabels", but applies to a specific set of values |
|- | |- | ||
| Line 110: | Line 110: | ||
|colspan="2"|spacing[n] | |colspan="2"|spacing[n] | ||
| − | |Same as "spacing", but | + | |Same as "spacing", but applies to a specific set of values |
|- | |- | ||
| Line 148: | Line 148: | ||
|bgcolor | |bgcolor | ||
|CSS color | |CSS color | ||
| − | |background color | + | |background color |
|- | |- | ||
|valuecolor | |valuecolor | ||
|CSS color | |CSS color | ||
| − | | | + | |a color that applies to all values |
|- | |- | ||
|valuecolor[n] | |valuecolor[n] | ||
|CSS color | |CSS color | ||
| − | | | + | |a color that applies to all values in the specified value set |
|- | |- | ||
|valuecolors | |valuecolors | ||
|comma-separated list of CSS colors | |comma-separated list of CSS colors | ||
| − | | | + | |list of colors, one for each data point in values |
|- | |- | ||
|valuecolors[n] | |valuecolors[n] | ||
|comma-separated list of CSS colors | |comma-separated list of CSS colors | ||
| − | | | + | |list of colors, one for each data point in values in the specified value set |
|- | |- | ||
| Line 176: | Line 176: | ||
|- | |- | ||
| − | |barborder | + | |rowspan="2"|barborder |
| − | | | + | |true |
| − | | | + | |show bars/points border |
| + | |- | ||
| + | |false | ||
| + | |hide bars/points border | ||
|- | |- | ||
|axiscolor | |axiscolor | ||
| − | | | + | |CSS color |
| − | | | + | |axis color |
|- | |- | ||
|notchcolor | |notchcolor | ||
| − | | | + | |CSS color |
| − | | | + | |color of the axis notches |
|- | |- | ||
|labelcolor | |labelcolor | ||
| − | | | + | |CSS color |
| − | | | + | |color of the axis and bars labels |
|- | |- | ||
| Line 202: | Line 205: | ||
|thresholds | |thresholds | ||
| − | | | + | |comma-separated list of values |
| − | + | |List of values at which to display a line (threshold) | |
| − | |||
| − | |||
| − | |||
| − | |||
| − | | | ||
|- | |- | ||
|thresholdcolor | |thresholdcolor | ||
| − | | | + | |CSS color |
| − | | | + | |Color of threshold lines |
|- | |- | ||
|thresholdcolors | |thresholdcolors | ||
| − | | | + | |comma-separated list of CSS colors |
| − | | | + | |List of colors of threshold lines, one value each line |
|- | |- | ||
|stroke | |stroke | ||
| − | | | + | |number of pixel |
| − | | | + | |Pixel size of the stroke that applies to line and spline chart's types |
|- | |- | ||
| − | |stroke[n] | + | |colspan="2"|stroke[n] |
| − | | | + | |Same as "colspan", but applies to a specific set of values |
| − | |||
|- | |- | ||
Revision as of 15:52, 13 January 2014
For a description and a complete list of UI Objects, see Draws a chart. Its appearance and data are set with UI Attributes. More than one set of values can be specified.
Parameters
- id: the object's ID, used by UISets. Required
- position: the object's position. Use the pixels or rows and columns coordinates format
- size: the chart's area's width and height
- attributes: list of UI attribute ids and values defining the chart's aspect and data. Setting this parameter is the same as setting each UI attribute with a UISet
Syntax
(chart!<id> <address>; <position>; <width>; <height>; <attributes>)
E.g.
(chart!chart1 x3y187; 312; 180; (type=line; values=0,10,24,12,7,35,42,1,23,4))
UI Attributes
Chart attributes
| Name | Value | Description |
|---|---|---|
| type | bars | Draw bars |
| gauge | Draw a gauge, for charts with a single value. Use with the "value" attribute | |
| points | Draws points | |
| line | Draws a line connecting the values | |
| spline | Draws a spline connecting the values | |
| orientation | vertical | Default value. Draws a vertical chart |
| horizontal | Draws an horizontal chart | |
| value | single value | Value to be drawn. To be used when "type" is gauge |
| value[n] | Same as "value", but applies to a specific set of values | |
| values | comma-separated list of values | Values to be drawn. E.g. 2,3,1.2,4 |
| comma-separated list of arrays | Sets of values to be drawn. E.g. [2,3,1.2,4],[4,1,0,0.2] | |
| values[n] | Same as "values", but applies to a specific set of values | |
| valuerange | [min],[max] | Range of values displayed. E.g. -2,10 |
| axislabels | auto | Default. Labels on the x axis (if vertical) or y axis (if horizontal) will go from 1 to the total number of values. |
| none | No label is shown on the x axis (if vertical) or y axis (if horizontal) | |
| comma-separated list of values | Custom labels on the x axis (if vertical) or y axis (if horizontal) | |
| valuelabeltype | inside | Value labels are shown inside (if "type" is bars, points or gauge) or over (if "type" is line or spline) |
| outside | Value labels are shown above or below | |
| popup | Value labels are shown on mouseover, or on touch (if on a touch-enabled device) | |
| valuelabels | comma-separated list of values | Custom values to show in value labels |
| valuelabels[n] | Same as "valuelabels", but applies to a specific set of values | |
| spacing | 0-100 | Percentage of spacing between bars or points |
| spacing[n] | Same as "spacing", but applies to a specific set of values | |
| offset[n] | percentage | Percentage of value offset. Used to shift a specific set on the x axis if vertical, or on the y axis if horizontal. Used to show background sets. E.g. "offset[0]=-20; offset[1]=20" |
| drawaxis | true | Default. The axes are visible (also notches and labels) |
| false | The axes are not visible (also notches and labels) | |
| axisoffset | percentage | The axis offset (y if vertical, x if horizontal) expressed as percentage or as the value series index. E.g. "50%" or "3" |
| origin | value | moves the origin to a value different from 0 ( e.g. origin=3.2 ) |
| notches | value | number of notches on the x-axis (for vertical charts) or on the y-axis (for horizontal charts) |
| pointsize | number of pixels | points size (use for the points chart type) |
| bgcolor | CSS color | background color |
| valuecolor | CSS color | a color that applies to all values |
| valuecolor[n] | CSS color | a color that applies to all values in the specified value set |
| valuecolors | comma-separated list of CSS colors | list of colors, one for each data point in values |
| valuecolors[n] | comma-separated list of CSS colors | list of colors, one for each data point in values in the specified value set |
| barshadow | ||
| barborder | true | show bars/points border |
| false | hide bars/points border | |
| axiscolor | CSS color | axis color |
| notchcolor | CSS color | color of the axis notches |
| labelcolor | CSS color | color of the axis and bars labels |
| valuelabelcolor | ||
| thresholds | comma-separated list of values | List of values at which to display a line (threshold) |
| thresholdcolor | CSS color | Color of threshold lines |
| thresholdcolors | comma-separated list of CSS colors | List of colors of threshold lines, one value each line |
| stroke | number of pixel | Pixel size of the stroke that applies to line and spline chart's types |
| stroke[n] | Same as "colspan", but applies to a specific set of values | |
A CSS color can be specified as
- hex value: #<rr><gg><bb> E.g. #FF1010
- color name: red, blue, white...
- as rgb: rgb(<r>,<g>,<b>) E.g. rgb(255,30,30)
- as rgba: rgba(<r>,<g>,<b>,<alpha>) E.g. rgba(255,30,30,0.5)
