SVGGraph Horizontal Bar Graphs
SVGGraph currently contains these classes for drawing horizontal versions of the standard bar graphs: HorizontalBarGraph; HorizontalStackedBarGraph; HorizontalGroupedBarGraph. An example of each type is shown below.
Example code
Here are the settings and PHP code used to generate the graphs above:
require_once('includes/SVGGraph.php'); $settings = array( 'back_colour' => '#eee', 'stroke_colour' => '#000', 'back_stroke_width' => 0, 'back_stroke_colour' => '#eee', 'back_image' => 'images/svgbg.png', 'axis_colour' => '#333', 'axis_overlap' => 2, 'axis_font' => 'Georgia', 'axis_font_size' => 10, 'grid_colour' => '#666', 'label_colour' => '#000', 'pad_right' => 20, 'pad_left' => 20, 'link_base' => '/', 'link_target' => '_top', 'minimum_grid_spacing' => 20 ); $values = array( array('Dough' => 30, 'Ray' => 50, 'Me' => 40, 'So' => 25, 'Far' => 45, 'Lard' => 35), array('Dough' => 20, 'Ray' => 30, 'Me' => 20, 'So' => 15, 'Far' => 25, 'Lard' => 35, 'Tea' => 45) ); $colours = array(array('red','yellow'), array('blue','white')); $links = array('Dough' => 'jpegsaver.php', 'Ray' => 'crcdropper.php', 'Me' => 'svggraph.php'); $graph = new SVGGraph(300, 200, $settings); $graph->colours = $colours; $graph->Values($values); $graph->Links($links); $graph->Render('HorizontalBarGraph');
If you have already looked at the bar graph page,
this code should be familiar - the only change is 'HorizontalBarGraph' in the call
to $graph->Render. (I have also removed the 'project_angle' option,
since that is only used by the vertical 3D bar graph.)
Change 'HorizontalBarGraph' to one of the other class names to draw that type instead.
Settings
These options are common to all graph types:
| Option | Default | Description |
|---|---|---|
title |
NULL |
Contents of title tag, or NULL for none |
description |
NULL |
Contents of desc tag, or NULL for none |
stroke_colour |
rgb(0,0,0) |
Colour of graph lines |
stroke_width |
1 |
Thickness of graph lines, 0 disables line drawing |
back_colour |
rgb(240,240,240) |
Background colour of graph |
back_round |
0 |
Radius of rounded background edge |
back_stroke_width |
1 |
Thickness of background edge |
back_stroke_colour |
rgb(0,0,0) |
Colour of background edge |
back_image |
NULL |
Image to use for background (NULL for none). See the SVGGraph background image page for details. |
back_image_width |
100% |
Width of background image |
back_image_height |
100% |
Height of background image |
back_image_opacity |
1.0 |
Opacity of background image (0.0-1.0) |
back_image_top |
0 |
Top offset of background image |
back_image_left |
0 |
Left offset of background image |
back_image_mode |
auto |
Background image display method. Options are:
|
pad_top |
10 |
Space at top of graph |
pad_bottom |
10 |
Space at bottom of graph |
pad_left |
10 |
Space to left of graph |
pad_right |
10 |
Space to right of graph |
link_base |
|
Prepended to all links |
link_target |
_blank |
Link target frame |
namespace |
false |
Option to use the svg: namespace prefix |
doctype |
false |
Option to output the DOCTYPE |
show_tooltips |
true |
Enables display of tooltips over graph markers |
tooltip_colour |
black |
Tooltip text/border colour |
tooltip_stroke_width |
1 |
Tooltip border thickness |
tooltip_back_colour |
#ffffcc |
Tooltip rectangle background colour |
tooltip_font |
sans-serif |
Font for tooltips |
tooltip_font_weight |
normal |
Tooltip font weight |
tooltip_font_size |
10 |
Tooltip font size |
tooltip_padding |
3 |
Tooltip rectangle padding |
tooltip_round |
0 |
Radius of rounded tooltip corner |
tooltip_shadow_opacity |
0.3 |
Opacity of tooltip shadow (0.0-1.0, 0 disables shadow) |
tooltip_offset |
10 |
Distance between cursor and tooltip |
compat_events |
false |
Set to TRUE to fall back to inline event handlers, required by Adobe IE plugin |
graph_title |
NULL |
Title displayed on the graph |
graph_title_font |
sans-serif |
Font for graph title |
graph_title_font_size |
12 |
Font size for graph title |
graph_title_font_weight |
normal |
Font weight for graph title |
graph_title_space |
10 |
Spacing around graph title |
graph_title_colour |
rgb(0,0,0) |
Colour of graph title |
graph_title_position |
top |
Where to show graph title ("top", "bottom", "left", "right") |
legend_entries |
NULL |
Array of entries for the legend |
legend_position |
top right |
Position of the legend. Supports "top", "bottom", "left", "right", "inner", "outer" and pairs of X and Y offsets |
legend_stroke_width |
1 |
Thickness of legend border |
legend_stroke_colour |
rgb(0,0,0) |
Colour of legend border |
legend_back_colour |
rgb(255,255,255) |
Colour of legend background |
legend_round |
0 |
Radius of rounded corners for legend border |
legend_font |
sans-serif |
Font for legend entries |
legend_font_weight |
normal |
Font weight for legend entries |
legend_font_size |
10 |
Font size for legend entries |
legend_font_adjust |
0.6 |
Ratio of font width to height |
legend_colour |
rgb(0,0,0) |
Colour of legend entries text |
legend_padding |
5 |
Amount of spacing between entries in legend |
legend_entry_width |
20 |
Width of legend entry box |
legend_entry_height |
20 |
Height of legend entry box |
legend_title |
|
Title for legend |
legend_title_font |
NULL |
Font for legend title (NULL = use legend_font) |
legend_title_font_size |
NULL |
Font size for legend title (NULL = use legend_font_size) |
legend_title_font_weight |
bold |
Font weight for legend title |
legend_title_font_adjust |
NULL |
Ratio of font width to height (NULL = use legend_font_adjust) |
legend_title_colour |
NULL |
Colour of legend title (NULL = use legend_colour |
legend_text_side |
right |
Which side of the entry box the text should be on ("left", "right") |
legend_draggable |
true |
Makes the legend draggable with the mouse |
legend_autohide |
false |
Makes the legend hide when the cursor is over it |
These options are used by the horizontal and vertical bar graphs, and many are also used by the line and scatter graphs:
| Option | Default | Description |
|---|---|---|
show_grid |
true |
Grid on/off option |
show_axes |
true |
Axes on/off option |
show_divisions |
true |
Axis division points on/off |
show_axis_text_h |
true |
Horizontal axis division numbering or labels on/off |
show_axis_text_v |
true |
Vertical axis division numbering on/off |
grid_colour |
rgb(220,220,220) |
Colour of grid lines |
axis_colour |
rgb(0,0,0) |
Colour of axis lines |
axis_font |
monospace |
Font for axis division text |
axis_font_size |
10 |
Axis division font size |
axis_font_adjust |
0.6 |
Approx ratio of font width to height |
axis_overlap |
5 |
Amount to extend axes past graph area |
axis_text_colour |
rgb(0,0,0) |
Colour of axis division text |
division_size |
3 |
Length of division lines |
division_colour |
NULL |
Colour of division lines, or NULL to use axis colour |
minimum_grid_spacing |
15 |
Minimum distance between grid/axis lines |
minimum_grid_spacing_h |
NULL |
Minimum distance between divisions on horizontal axis |
minimum_grid_spacing_v |
NULL |
Minimum distance between divisions on vertical axis |
bar_space[1] |
10 |
Space between bars |
group_space[2] |
3 |
Space between bars of group |
axis_min_h[3] |
NULL |
Minimum extent of X-axis |
axis_max_h[3] |
NULL |
Maximum extent of X-axis |
grid_division_h[3] |
NULL |
Grid interval on X-axis |
show_subdivisions |
false |
Enables axis subdivisions |
subdivision_size |
2 |
Size of axis subdivision markings |
subdivision_colour |
division_colour |
Colour of axis subdivision markings |
show_grid_subdivision |
false |
Enables grid subdivisions |
grid_subdivision_colour |
rgba(220,220,220,0.5) |
Colour of grid subdivision lines |
minimum_subdivision |
5 |
Minimum distance between subdivisions |
subdivision_h |
NULL |
Subdivision grid interval on X-axis |
subdivision_v |
NULL |
Subdivision grid interval on Y-axis |
label_h[4] |
|
Horizontal axis label |
label_v[4] |
|
Vertical axis label |
label_x[4] |
|
X-axis label |
label_y[4] |
|
Y-axis label |
label_space[4] |
6 |
Spacing around axis labels |
label_font[4] |
sans-serif |
Font for axis labels |
label_font_size[4] |
10 |
Font size for axis labels |
label_font_weight[4] |
normal |
Font weight for axis labels |
label_colour[4] |
rgb(0,0,0) |
Colour for axis label text |
- [1]For HorizontalGroupedBarGraph,
bar_spaceis the space between groups of bars - [2]Only used for HorizontalGroupedBarGraph
- [3]These options override SVGGraph's calculations for axis start, end and division values. They will also affect the grid for vertical bar graphs, but not in a useful way. See the axis and grid options page for more details.
- [4]The axis labelling options were added in version 2.6. For details, see the titles, labels and legends page.
