|
Table of Contents
OverviewThe horizontal grouped barchart can be used to draw a variety of different charts just by changing a few query string options. The chart type code for the line chart is Getting Started
Colors (
|
Description | Image |
---|---|
Make the first bar set red (FF0000 ) and the second bar set green (00FF00 ). |
chd=s:sengelha,
|
chbh
)You can optionally specify custom values for bar widths and spacing between bars and groups. You can only specify one set of width values for all bars.
chbh= <bar_width_or_scale>,<space_between_bars>,<space_between_groups>
a
- space_between_bars and space_between_groups are
given in absolute units (or default absolute values, if not specified). Bars
will be resized so that all bars will fit in the chart.r
- space_between_bars and space_between_groups are
given in relative units (or default relative values, if not specified) Relative
units are floating point values compared to the bar width, where the
bar width is 1.0: for example, 0.5 is half the bar width, 2.0 is twice the
bar width. Bars can be clipped if the chart isn't wide enough.You cannot omit intermediate optional parameters; you must end with a stated
value. For example: chbh=a,5,10
is valid, chbh=a,,10
is
not, chbh=a,5,
is not.
Description | Image |
---|---|
The chart adds some spacing (15 pixels) between groups. |
chbh=a,5,15
|
chxt
, chxr
, chxl
, chxs
)
You can control chart axes using the chxt
, chxr
, chxl
, and
chxs
options.
The chxt
option controls which axes you wish to display.
The chxr
option controls a range for one or more axes. It
can only be used for the y and r axes.
The chxl
option allows you to manually specify the labels
for an axis.
chxr
is not supported for the x-axis. If you enable the x-axis, you must
specify labels by using chxl
.
The chxs
option allows you to specify the label-style
for an axis.
chxt=<axis_1>,...,<axis_n> chxr=<axis_1>,<range_start_1>,<range_end_1>,<opt_major_interval_1>,<opt_minor_interval_1> |...|<axis_n>,<range_start_n>,<range_end_n>,<opt_major_interval_n>,<opt_minor_interval_n> chxl=<axis_index_1>:|<label_1>|...|<label_n> |...|<axis_index_n>:|<label_1>|...|<label_n> chxs=<axis_index_1><opt_format_string>,<opt_label_color>,<opt_font_size> |...|<axis_index_n><opt_format_string>,<opt_label_color>,<opt_font_size>
Display the axis, using the following axis codes:
x
- X-Axis on the bottom of the charty
- Y-Axis on the left of the chartr
- Y-Axis on the right of the chartchxt
parameter. N<preceding_text>*<number_type><decimal_places>zs<x
or y>*<following_text>
<preceding_text>
- Literal text to precede each value.*...*
- An optional block wrapped in literal asterisks,
in which you can specify formatting details for numbers. The following
values are supported, and are all optional:
<number_type>
- The number format, for numeric values. Choose one of the following:
f
- [Default] Floating point format.p
- Percentage format. A % sign is appended automatically.
k
- Thousand abbreviated number. The value will be divided by 1,000 before display.
<following_text>
or <preceding_text>
.m
- Million abbreviated number. The value will be divided by 1,000,000 before display.
<following_text>
or <preceding_text>
.e
- Scientific notation format.c<CUR>
- Format the number in the
currency specified, with the appropriate currency marker. Replace <CUR>
with
a three-letter currency code. Example: cEUR
for Euros.
You can find a list of codes on the ISO
web site, although not all symbols are supported.<decimal_places>
- An integer specifying
how many decimal places to show. The value is rounded (not truncated)
to this length. Default is 2.z
- Display trailing zeros. Default is no.s
- Display group separators. Default is no.x
or y
- This parameter is not currently supported - its content will be ignored.<following_text>
- Literal text to follow each value.Description | Image |
---|---|
Display an x-axis on the bottom of the chart with an automatically determined range. |
chxt=x
|
Display an x-axis on the bottom of the chart with a range from 0 to 50 in steps of 10. Draw the axis labels in 12 point red font, with trailing % symbol |
chxt=x
|
chgx
)
You can control the chart grid lines using the chgx
option.
chgx
stands for axis-aligned grid lines. The horizontal grid
lines are drawn aligned with the axis major interval for the y/r-axis, as
specified by the chxr
option. For vertical grid-lines, grid
lines are drawn for every point with a non-empty label on the x-axis, as
specified by the chxl
option. Use a space or non-empty
string to denote the place where you want to denote a grid line to be drawn
and an empty string to denote no grid line.
chgx=<axis>,<opt_dash_length>,<opt_space_length>,<opt_color>,<opt_thickness> |...| <axis>,<opt_dash_length>,<opt_space_length>,<opt_color>,<opt_thickness>
The axis with whose major interval you want the grid lines synchronized.
x
- Vertical grid lines aligned with the x-axis major intervaly
- (not currently supported) Horizontal grid lines aligned with the y-axis major interval.000000
)Description | Image |
---|---|
Turn off all grid lines. |
chgx=
|
Draw a chart with dotted gray (CCCCCC ) vertical axis lines. |
chgx=x,1,3,CCCCCC
|
Draw a chart with 3-pixel-thick dashed red (FF0000 )
vertical grid lines. |
chgx=x,4,2,FF0000,3
|
chf
)The background color of the chart can be controlled using the chart fill option.
chf=<fill_type>,s,<color>
The part of the chart being filled. Specify one of the following values:
bg
- Background fillc
- Chart area fill - the part of the chart that contains the dataDescription | Image |
---|---|
Fill the chart background with pale grey (EFEFEF ). |
chf=bg,s,EFEFEF
|
Fill only the charting area with pale grey (EFEFEF ). |
chf=c,s,EFEFEF
|
Fill the chart background with semi-transparent yellow (FBF8DDCC ). |
chf=bg,s,FBF8DDCC
|
Fill the charting area with semi-transparent yellow (FBF8DDCC ). Note: We must also
make the chart background fully transparent (00000000 ), otherwise the semi-transparent
area will simply show the default chart background (white). |
chf=bg,s,00000000
|
chft
and chfts
)
The fonts that BPCharts uses to renders labels can be controlled using the
chft
(font name) and chfts
(font size) options.
For raster (e.g. PNG) charts, only fonts which exist on the BPCharts server may be used. For vector (e.g. SVG) charts, the font does not need to exist on the BPCharts server but the client which renders the SVG must have the font installed.
chft=<font_name> chfts=<font_size>
The size of the font to use to render the chart. For raster charts (e.g. PNG) this is in pixels; for vector charts (e.g. SVG) this is in points.
For raster charts, defaults to 11 pixels tall. For vector charts, defaults to 8 points tall.
Description | Image |
---|---|
Draw the axis labels in 18-pixel-tall Times New Roman. |
chft=Times New Roman
|
chmg
)A chart's margins are defined as the area outside of the rendering of the chart data itself. The chart margin may include labels or legends.
By default, BPCharts automatically picks chart margins which fit the labels and legends.
chmg=<top>,<right>,<bottom>,<left>
Description | Image |
---|---|
Adjust the chart margins to 5 pixels on top, 30 pixels on the right, 20 pixels on the bottom, and 10 pixels on the left. Use background and chart area colors to demonstrate the separation between the two. |
chmg=5,30,20,10
|
chm=C/D/H/N/V
)You can combine markers with
any other chm
parameters using a pipe character ( |
)
to separate the chm
parameters.
Syntax
Specify one set of the following parameters for each series that should be marked. To mark multiple series, create additional parameter sets, delimited by a pipe character. You do not need to mark up all series. If you do not assign markers to a data series, it will not get any markers.
chm= [@]<marker_type>,<color>,<series_index>,<opt_which_points>,<size>,<opt_z_order> |...| [@]<marker_type>,<color>,<series_index>,<opt_which_points>,<size>,<opt_z_order>
N<opt_format_string>
- The value of the data at this point, with optional formatting. N<preceding_text>*<number_type><decimal_places>zs<x
or y>*<following_text>
<preceding_text>
- Literal text to precede each value.*...*
- An optional block wrapped in literal asterisks,
in which you can specify formatting details for numbers. The following
values are supported, and are all optional:
<number_type>
- The number format, for numeric values. Choose one of the following:
f
- [Default] Floating point format.p
- Percentage format. A % sign is appended automatically.
k
- Thousand abbreviated number. The value will be divided by 1,000 before display.
<following_text>
or <preceding_text>
.m
- Million abbreviated number. The value will be divided by 1,000,000 before display.
<following_text>
or <preceding_text>
.e
- Scientific notation format.c<CUR>
- Format the number in the
currency specified, with the appropriate currency marker. Replace <CUR>
with
a three-letter currency code. Example: cEUR
for Euros.
You can find a list of codes on the ISO
web site, although not all symbols are supported.<decimal_places>
- An integer specifying
how many decimal places to show. The value is rounded (not truncated)
to this length. Default is 2.z
- Display trailing zeros. Default is no.s
- Display group separators. Default is no.x
or y
- This parameter is not currently supported - its content will be ignored.<following_text>
- Literal text to follow each value.V
- Vertical line of spanning the full height of the chart.Description | Image |
---|---|
Mark data values as percentages with one decimal place (no trailing zeros). Mark a red vertical line on the chart at 2 percent. |
chm=N*f1*%25,FF0000,0,-1,10|V,FF0000,0,2
|