Creation of windrose graphs first requires the inclusion of the library extension
The creation of Windrose graphs otherwise follows the traditional steps in the library of creating a graph and then adding one or several windrose plots to the canvas.
Create a basic canvas graph as an instance of
Create an instance of one or several windrose plots as instances of
class WindrosePlot, set up the scale and appearance and
then add them to the graph canvas.
Send back the graph to the client with a call to
WindroseGraph::Stroke(). As usual this can be used to
either send back the graph to the client (e.g.browser) or write the graph to
a file by specifying a filename as the first argument to
The example in Figure 21.6. A basic 16 direction windrose graph
( show a windrose graphs using
just the default values for all parameters.
Example 21.3. A basic 16 direction windrose graph (
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24
require_once ('jpgraph/jpgraph.php'); require_once ('jpgraph/jpgraph_windrose.php'); // Data can be specified using both ordinal index of the axis // as well as the direction label $data = array( 0 => array(5,5,5,8), 1 => array(3,4,1,4), 'WSW' => array(1,5,5,3), 'N' => array(2,3,8,1,1), 15 => array(2,3,5)); // First create a new windrose graph with a title $graph = new WindroseGraph(400,400); $graph->title->Set('A basic Windrose graph'); // Create the windrose plot. $wp = new WindrosePlot($data); // Add and send back to browser $graph->Add($wp); $graph->Stroke();
Figure 21.6. A basic 16 direction windrose graph
In the same way as for other graph types one or several Windrose plots can be added and positioned freely in the Windrose graph by specifying the position as either absolute coordinates or as fractions of the width/height of the overall graph.
An easier way to position Windrose plots is to use layout classes as described in Using layout classes to position Windrose plots
Each instance of the
WindrosePlot is added to the overall graph with a
call to the standard method
To avoid that all the plots collide in the middle the positioning and sizing methods as shown in the previous sections should be used.
The following script shows how two plots are displayed in the same graph.
Example 21.4. Adding two windrose plots to the same graph (
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43
require_once ('jpgraph/jpgraph.php'); require_once ('jpgraph/jpgraph_windrose.php'); // Data can be specified using both ordinal idex of axis as well // as the direction label $data = array( 1 => array(10,10,13,7), 2 => array(2,8,10), 4 => array(1,12,22), ); $data2 = array( 4 => array(12,8,2,3), 2 => array(5,4,4,5,2), ); // Create a new small windrose graph $graph = new WindroseGraph(660,400); $graph->SetShadow(); $graph->title->Set('Two windrose plots in one graph'); $graph->title->SetFont(FF_ARIAL,FS_BOLD,14); $graph->subtitle->Set('(Using Box() for each plot)'); $wp = new WindrosePlot($data); $wp->SetType(WINDROSE_TYPE8); $wp->SetSize(0.42); $wp->SetPos(0.25,0.55); $wp->SetBox(); $wp2 = new WindrosePlot($data2); $wp2->SetType(WINDROSE_TYPE16); $wp2->SetSize(0.42); $wp2->SetPos(0.74,0.55); $wp2->SetBox(); $wp2->SetRangeColors(array('green','yellow','red','brown')); $graph->Add($wp); $graph->Add($wp2); $graph->Stroke();
Figure 21.7. Adding two windrose plots to the same graph
The scale is a property of each plot and is access though the instance variable
WindrosePlot::scale. The scale consists of the epi-centric circles
that radiates from the center of the Windrose plot. The step between each circle can
be set manually or it can be done automatically by the library depending on the data
(In order to keep the flow of the text this section leaves the full examples to the example section.)
To manual set the scale of the circles the following method is used:
$aMax, The maximum scale value
$aStepSize, The step between each scale circle
By default the library tries multiple of 5:s and 2:s for a visually esthetic grid spacing.
Other example of methods available to adjust the scale are
Specify font for all scale labels apart from the 0-label (in the center)
Specify the font for the 0-label (in the center)
Specify font color for all scale labels apart from the 0-label (in the center)
Specify the font for the 0-label (in the center)
Set the background color for the labels
Set the label text alignment
Set the label format. This is specified as a "
Hide the scale labels
Examples of how to use these methods are shown in the following sections.
Fonts can be specified for both the labels on the scale as well as separately
for the label in the center of the plot. The following code snippet shows how to
do this (we assume we have already created a windrose plot called
1 2 3 4 5 6 7
// Font and color for scale labels $windplot->scale->SetFont(FF_VERDANA,FS_NORMAL,10); $windplot->scale->SetFontColor('navy'); // Font and color for the center (Zero circle) label $windplot->scale->SetZFont(FF_VERDANA,FS_NORMAL,10); $windplot->scale->SetZFontColor('navy');
By default the library automatically determines a scale range and step size taking into account the maximum value of data, size of the plot and the font size specified for the scale labels.
However it is possible to force a manual scale and step size with a call to
Set($aMaxValue,$aStepSize). This call sets the maximum scale
value as well as the step size. The step size is optional. If the step size is
not specified it will be automatically determined.
1 2 3 4 5
// Specify both maximum value and a step size $windplot->scale->Set(40,8); ... // Specify just the maximum value $windplot->scale->Set(40);
The automatic scaling tries to first use step sizes as multiples of 5 and then multiples of 2 to achieve a suitable spacing of the scale lines.
It might be surprising to see that the scale steps may change when the label font is changed. However, this is by design. The reason for this is that there is only a certain amount of space available for the labels between each step. In order for large fonts to fit the space between the grids the step between each circle must be large enough.
The labels for the scale is placed along a line radiating from the center of the windrose plots. The angle for the labels can be either manually or automatically determined.
The labels for the scale is placed along one of the sixteen compass directions if you choose automatic positioning of the labels. By default the library tries to choose a direction with as little data around it as possible.
To manually specify the angle a call to
the angle (in degrees) as argument.
The code snippet below shows how to do this
// Show the labels at 45 degrees angle $windplot->scale->SetAngle(45);
To specify that the library should do this automatically (which is the default) the angle is specified as the string 'auto' as
// Let the library determine a good angle $windplot->scale->SetAngle('auto');
With direction labels we mean the names of the compass directions surrounding the windrose plot. By default they are given the English short form for the 16 discrete compass named directions. This can also be localized (described in ??).
Fonts for the axis titles are specified with (with the usual arguments)
as the following example shows
Wen using the free direction windrose plots the default label is the direction for the data in degrees. This is fully customizable by using the following method.
The input data to this method is an associative array where the keys are the direction and the content is the text to be displayed.
Please note that for regular Windrose plots, i.e. with only compass direction
the label can not be changed. This is only available if the type of the windrose
The following example specifies a data point at 50 degrees and a text "Point\n#7315" as the label.
Labels can contain "\n" which will be interpreted as a line break.
1 2 3 4 5
$data = array( 50 => array(12,12,2) ); $labels = array( 50 => 'Point #7315' ); ... $windplot = new WindrosePlot(); $windplot->SetLabels($labels);
There are two basic ways of adjusting the position of the compass labels around the plot:
Adjusting the margin between the label and the outer plot circle
Adjusting the anchor point of the labels.
The easiest way to explain this is to first imagine an invisible circle around the plot. The margins specifies how far from the outer scale circle this imaginative circle is placed.
In order to position the labels on that circle around the plot there are several possible ways to select what point of the text should be positioned on the circle. The easiest way is to select the center (both in X and Y directions) of the text. This works well if all labels are roughly the same size. If there are big difference between the smallest and largest label it might be necessary to have a very large margin to avoid the text to "collide" with the plot.
A better way is to determine the closest point of the text to the plot and then make that point lay on the circle. The closets point depends on what compass direction the label is on, for example for the "East" label the closes point is the middle of the left side of the text and for the "West" the closes point is the middle of the right side.
The library supports both way of positioning through the method
Valid values for $aPosition are
The following code snippet shows how to specify both margin and position do this:
The red circle in ?? and ?? illustrates the "imaginative" circle on which the labels are placed. The distance from the out most plot circle to the label anchor point is the margin.