Steel Series Gauges
Contents |
How to configure the Stainless Steel Gauges for WeatherCat
The very first thing you need to do is download the latest version of the gauges from http://wiki.sandaysoft.com/a/SteelSeries_Gauges
Once you have extracted all the files from the download, open the gauges.js file using a text editor or your favourite project tool.
The edits you will need to do are dependant on how you have setup (or intend to set up) your website.
All the files for the gauges are or will be in the top level of the website (option 1)
Find (approx. line 18)
weatherProgram : 0,
Replace with
weatherProgram : 3,
Find (approx. line 19)
imgPathURL : './images/',
Replace with
imgPathURL : '/',
All the files for the gauges are or will be in a subdirectory on the website (option 2)
Instructions will go here.....
Replacing the pop-up graphs
The gauges.js file comes pre configured to use the default graphs when you hover over one of the gauges. Should you wish to change these to use any of the custom graphs, you will need to make further changes to the file.
Find (approx. line 268)
config.tipImgs = [ ['temperature1.jpg', 'tempin1.jpg'], // Temperature: outdoor, indoor // Temperature: dewpoint, apparent, windChill, heatIndex, humidex ['dewpoint1.jpg', 'temperature1.jpg', 'windchill1.jpg', 'heatindex1.jpg', 'temperature1.jpg'], 'precipitationc1.jpg', // Rainfall 'precipitation1.jpg', // Rainfall rate ['rh1.jpg', 'rhin1.jpg'], // Humidity: outdoor, indoor 'pressure1.jpg', // Pressure 'windspeed1.jpg', // Wind speed 'winddirection1.jpg', // Wind direction (config.showUvGauge ? 'uv1.jpg' : null), // UV (config.showSolarGauge ? 'solarrad1.jpg' : null), // Solar rad (config.showRoseGauge ? 'winddirection1.jpg' : null) // Wind direction for Wind Rose
Replace with
Replace the jpg filenames with those you wish to use in their place. (i.e. Replace the default graph filenames with the custom graph filenames.)
NOTE: If you do change the pop-up graphs that are being displayed, you may need to modify the gauges-as.css file to allow for the difference in image size.