Lumikartta on palannut lumikarttasivulle :) Pohjoisnavan jääkarttasivulta löytyy nyt myös tuoreet hyiset yr.no-sääennusteet sekä Pohjois- että Etelänavalle :)

JQuery Weathergauges

Click for bigger image. Ajax-updated script for generating gauges with just javascript, based on JQuery.
Its crossbrowser, works on all major browsers, tested with FF 3.5, IE8 (both modes), Safari, Crome and Opera. You can see them live on this sites frontpage, here.

Features

- Ajaxupdated, settings for how many updates before stop and time between updates. Every invidual gauge is updated only if value(s) are changed.
- There are 11 gauges predefined, temperature, windchill/humidex, dewpoint, average wind, gust wind, pressure, humidity, uv, solar, daily rain and snow. They point to needed "numbers" in the clientrawfile. To change a value, just find it in the lower part of the jquery.flot.gauge.settings.js and change it to what you want.
- Every gauge has its own settings, ex. max/min values & unit can be set, so its works also for F-users Wink
- The colors of the halfcircle can be set (it use gradient, max 3 colors)
- Every gauge can have different units in use, supports C, F, kmh, mph etc.
- You don't need to show all the gauges, just set those you don't want to false in the first part of jquery.wxgauges.settings.js
- As default is a Google-hosted JQuery file used (its free to use). If problems occur can use the included jquery.js instead. This because in many cases visitors browsers have it allready in cache and then it don't need to be downloaded.
- The jquery.flot.js-file is a unpacked version of the one what is used on gauge.html, if problems occur, test with switching to that.


Download:
You can download needed files here:
Weathergauges.zip
( Size: 62.68 KB Updated: 13.08.2010)

To test:

This is easy...
1. set the url to clientraw.txt in file jquery.flot.gauge.settings.js correct
2. upload the stuff to folder of choise
3. go to yoursite.com/folderofchoise/gauge.html

Violá and the gauges should appear.

To install on a page:

1. Copy the loadings of the 5 js-files from gauge.html head-section to your page's head-section and add the css-stuff to your css-file. Don't forget the excanvas.js for IE
2. Set what gauges you want to show to true in the first part of jquery.flot.gauge.settings.js
3. On the page where you want it to show, copy the div of the gauge you want to show from gauge.html

Gratuity

If you find this site or the free PHP scripts useful to you, please consider making a small donation to help offset my time and the routine expenses of operation of this website. Thanks for your kind support! - Henkka

Donate