SteelSeries FAQ

The Steelseries Gauges FAQ 
If you think a question is missing from the FAQ, please add it - together with the answer! 
= Installing and Running =
== I get funny symbols on the gauges before the degree sign ==
The Steelseries scripts are supplied in UTF-8 format, if you have edited the files and saved them in another file format, that can be cause.
Another cause can be the hosting page, if that uses a character set other than UTF-8 you can again get character corruptions.
== Using the SteelSeries Gauges with the Saratoga Templates ==
The older versions of the Saratoga templates from Ken True use the ISO-8859-n character set particular to the language you are using. This is fundamentally incompatible with the UTF-8 character set used by the SteelSeries gauges.
Ken has updated his templates to work with the HTML5 gauges, if you haven't already done so you will need to update your templates from Ken's website. Then in the SteelSeries zip file is a PHP include file for the Saratoga templates - gauges-ss-basic-inc.php. Use this include file as the basis for your gauges page.
== My HTML page gets corrupted when Cumulus processes it ==
This happens if you have used extended character sets in your gauges-ssT.htm file and then saved it as UTF-8 (as you should). Unfortunately old versions of Cumulus did not understand UTF-8 and when it processes the page old Cumulus versions will re-save it as ANSI encoded. 
Upgrade to the latest version of Cumulus, reading the release notes for all the builds inbetween your old one and that you have now installed paying particular attention to any mention of UTF-8. 
== My gauges are not using the right minimum and maximum ==
The pressure gauge uses the all-time highest and lowest values to determine what scale to display. The other gauges use that day's lowest and highest values to determine the scale to display. Check your source does not have some rogue values distorting the range displayed.
= Additional Gauges =
== I'd like to add gauge XXXX from the demo pages ==
The copy of the SteelSeries library supplied with the weather gauges only contains a subset of all the gauges available in SteelSeries Canvas library. The supplied gauges are Radial, RadialBargraph, DisplaySingle, WindDirection, and Odometer. If you want to display any other types of gauges, then you will have to download the full SteelSeries library from Github. The SteelSeries demo pages have some very basic code to display each of the gauge types, all the configuration parameters for each gauge can be found by looking in the SteelSeries.js source file - there is no on-line documentation for the library.
= Tweaking the Wind Rose =
== How do I alter the Wind Rose plot colours? ==
The Wind Rose is based on the RGraph Rose component, in windrose.js you will find a line (around line 160 as of v2.2.2) like this:
 rose.Set('chart.colors', ['Gradient(gray:red)']);
This controls the colour of the plot sectors. Please refer to the RGraph website for information on how to use the gradient syntax.
== How do I alter the gap between the Wind Rose sectors? ==
In windrose.js you will find a line (around line 161 as of v2.2.2) like this:
 rose.Set('chart.margin', Math.ceil(50 / data.length));
This controls the gap between the sectors, to reduce the gap change '50' to a lower number (say 30), to increase the gap use a bigger number.
= Design customizations =
SteelSeries gauges could use hundreds designs with combination of style, size, colors and so on!
== Gauges size ==
Gauges could take near any size and to help using it, 3 different sizes has been created
You just have to find that line and change gaugeSizeStd parameter:
<canvas id="canvas_dew" class="gaugeSizeStd"></canvas>
Since these paramete are defined in gauge-cc.css file, you could edit for any size, keep odd numbers
Parameter 	Description
gaugeSizeSml	Size: 121px x 121px
gaugeSizeStd	Size: 151px x 151px
gaugeSizeLrg	Size: 261px x 261px
== Setting frame design ==
setFrameDesign function control "ring" appearance
Parameter 	Description
BLACK_METAL 	Black Metal
METAL 	Metal
SHINY_METAL 	Shiny Metal
BRASS 	Brass
STEEL 	Steel
CHROME 	Chrome
GOLD 	Gold
ANTHRACITE 	Anthracite
TILTED_GRAY 	Tilted Gray
TILTED_BLACK	Tilted Black
GLOSSY_METAL	Glossy Metal
== Setting background color ==
setBackgroundColor function control gauge background color, posible parameters are:
Parameter 	Description
DARK_GRAY 	Dark Gray
SATIN_GRAY 	Satin Gray
LIGHT_GRAY 	Light Gray
WHITE 	White
BLACK 	Black
BEIGE 	Beige
BROWN 	Brown
RED 	Red
GREEN 	Green
BLUE 	Blue
ANTHRACITE 	Anthracite
MUD 	Mud
PUNCHED_SHEET 	Punched Sheet
CARBON 	Carbon
STAINLESS 	Stainless steel
BRUSHED_METAL 	Brushed Metal
BRUSHED_STAINLESS	Brushed Stainless steel
TURNED 	Turned
== Settting needles color ==
setPointerColor function control needles color, parameters available:
Parameter	Description
RED 	Red
GREEN 	Green
BLUE 	Blue
ORANGE 	Orange
YELLOW 	Yellow
CYAN 	Cyan
MAGENTA 	Magenta
WHITE 	White
GRAY 	Gray
BLACK 	Black
RAITH 	Raith
GREEN_LCD	Green LCD
JUG_GREEN	JUG Green
== Settting needles design ==
setPointerColor function control needles type, parameters available:
Parameter	Description
TYPE1 	Type 1
TYPE2 	Type 2
TYPE3 	Type 3
TYPE4 	Type 4
TYPE5 	Type 5
TYPE6 	Type 6
TYPE7 	Type 7
TYPE8 	Type 8
TYPE9 	Type 9
TYPE10 	Type 10
TYPE11 	Type 11
TYPE12 	Type 12
TYPE13 	Type 13
TYPE14 	Type 14
TYPE15 	Type 15
TYPE16 	Type 16
== Settting LCD color ==
setLcdColor function control LCD display color, parameters available are:
Parameter 	Description
BEIGE 	Beige
BLUE 	Blue
ORANGE 	Orange
RED 	Red
YELLOW 	Yellow
WHITE 	White
GRAY 	Gray
BLACK 	Black
GREEN 	Green
BLUE2 	Blue2
BLUE_BLACK 	Blue Black
BLUE_DARKBLUE 	Dark Blue
BLUE_GRAY 	Blue Gray
STANDARD 	Standard
STANDARD_GREEN	Green
BLUE_BLUE 	True Blue
RED_DARKRED 	Dark Red
DARKBLUE 	Dark Blue
LILA 	Lila
BLACKRED 	Black Red
DARKGREEN 	Dark Green
AMBER 	Amber
LIGHTBLUE 	Light Blue
SECTIONS 	Sections
== Settting LED color ==
setLedColor function control LED color, parameters available are:
Parameter 	Description
RED_LED 	Red
GREEN_LED 	Green
BLUE_LED 	Blue
ORANGE_LED 	Orange
YELLOW_LED 	Yellow
CYAN_LED 	Cyan
MAGENTA_LED	Magenta
== Settting foreground design==
setForegroundType function control gauge foreground apearence, parameters available are:
Parameter	Description
TYPE1 	Type 1
TYPE2 	Type 2
TYPE3 	Type 3
TYPE4 	Type 4
TYPE5 	Type 5
TYPE6 	Type 6
== Settting Wind Avg Pointer Color ==
setPointerColorAvg function control Wind Avg Pointer color, parameters available:
Parameter	Description
RED 	Red
GREEN 	Green
BLUE 	Blue
ORANGE 	Orange
YELLOW 	Yellow
CYAN 	Cyan
MAGENTA 	Magenta
WHITE 	White
GRAY 	Gray
BLACK 	Black
RAITH 	Raith
GREEN_LCD	Green LCD
JUG_GREEN	JUG Green
== Settting Wind Avg Pointer design ==
setPointerAvg function control Wind Avg Pointer type, parameters available:
Parameter	Description
TYPE1 	Type 1
TYPE2 	Type 2
TYPE3 	Type 3
TYPE4 	Type 4
TYPE5 	Type 5
TYPE6 	Type 6
TYPE7 	Type 7
TYPE8 	Type 8
TYPE9 	Type 9
TYPE10 	Type 10
TYPE11 	Type 11
TYPE12 	Type 12
TYPE13 	Type 13
TYPE14 	Type 14
TYPE15 	Type 15
TYPE16 	Type 16
Category:SteelSeries