INSTRUCTIONS
To create thumbnail trend graphs ('Sparklines') on webpages using webtags from Cumulus.
http://omnipotent.net/jquery.sparkline/#s-docs
http://sandaysoft.com/
1) If you are already using cumuluswebtags add the contents of sparkline_tags.txt to your cumuluswebtags.txt file.
2) If you have no existing webtags file, Save 'sparkline_tags.txt' and have Cumulus Process and Upload as sparkline_tags.php
In spark.php change the path to your webtags file.
FOR EXAMPLE:
include("/sparkline_tags.php");
OR
include($_SERVER["DOCUMENT_ROOT"] . "/cumulus/cumuluswebtags.php");
3) Upload to your WEBSPACE in the directory of your choice:
jquery.min.js
jquery.sparkline.min.js
spark.php
4) Add to the WEBPAGE that requires Sparklines:
5) Insert one of the following in html at the location you wish the relevant Sparkline to appear:
..
..
..
.. Only if supplied by weather station.
..
.. 'Pie' chart of average wind direction.
..
..
..
..
..
..
6) If no Sparklines appear:
Check sparkline_tags.php is populated on webserver.
If 'View Source' of page shows Variables to be empty or zero, check Name/Paths of webtag file.
7) Customisation:
a) Under user variables in spark.php there are limited colour choices.
b) $width = 60; //Graph width $height = 16;//Graph height - Set the desired width and height of the Sparkline - Should not be larger than the holding container!
c) $cnt = 12; //number of data points/tags for graph. This allow the number of webtags/datapoints on the graph to be changed. Default is 12 with supplied tags.
d) $param = array( temp, rain, wind, solar, baro); // names - Add other parameters here - ensuring webtags are created FIRST !.
Other parameters may be created and added here ensure additional webtags are created and number must equal $cnt.
e) Time intervals may be changed by editing sparklines_tag.txt (See Cumulus Wiki - http://wiki.sandaysoft.com/a/Webtags)
f) A page using colours/tags as supplied here can be seen at http://lethamshank.co.uk/met/localwx.htm?page=current
g) More advanced custom options available at http://omnipotent.net/jquery.sparkline/#s-docs