meteo.toimii.fi json data

meteo.toimii.fi sääaseman data päivittyy minuutin välein. Tuoreimman mittauksen json data on urlissa https://meteo.toimii.fi/json/latest.php.

Upotus webbisivuun

Ensin html koodiin lisätään tagit sinne missä dataa halutaan käyttää

Mittausaika: <span id="meteoTime">-</span>
Ilman lämpötila: <span id="meteoTemperature">-</span>°C
Ilman suhteellinen kosteus: <span id="meteoHumidity">-</span>%
Tuulen nopeus: <span id="meteoWindSpeed">-</span>°
Tuulen suunta: <span id="meteoWindDirection">-</span>m/s
1h sademäärä: <span id="meteoRainfall1h">-</span>mm
24h sademäärä: <span id="meteoRainfall24h">-</span>mm
Imanpaine: <span id="meteoPressure">-</span>hPa
Ilmanpaineen kehitys: <span id="meteoPressureTrend">-</span>
Seuraavaksi webbisivun html:n loppuun lisätään javascript pätkä joka noutaa datat ja lisää ne span tageihin. Scripti hakee datat heti sivun latauksen jälkeen ja päivittää dataa 30 sek välein.
<script>
function getMeteo() {
    var xmlhttp = new XMLHttpRequest();
    xmlhttp.onreadystatechange = function () {
        if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
            var jsr = JSON.parse(xmlhttp.responseText);
            document.getElementById("meteoTime").innerHTML = jsr.time;
            document.getElementById("meteoTemperature").innerHTML = jsr.temp;
            document.getElementById("meteoHumidity").innerHTML = jsr.humidity;
            document.getElementById("meteoWindSpeed").innerHTML = jsr.windspeed;
            document.getElementById("meteoWindDirection").innerHTML = jsr.winddirection;
            document.getElementById("meteoRainfall1h").innerHTML = jsr.rainfall1h;
            document.getElementById("meteoRainfall24h").innerHTML = jsr.rainfall24h;
            document.getElementById("meteoPressure").innerHTML = jsr.pressure;
            document.getElementById("meteoPressureTrend").innerHTML = jsr.pressuretrend;
        }
    }
    xmlhttp.open("GET", "//meteo.toimii.fi/json/latest.php");
    xmlhttp.send();
}
getMeteo(); // haetaan tulokset heti
setInterval(getMeteo, 30000); // ja päivitetään 30sek välein
</script>

Toiminnan testaus

Tässä pitäisi näky live data.

Mittausaika: -
Ilman lämpötila: -°C
Ilman suhteellinen kosteus: -%
Tuulen nopeus: -m/s
Tuulen suunta: -°
1h sademäärä: -mm
24h sademäärä: -mm
Imanpaine: -hPa
Ilmanpaineen kehitys: -

Lisenssi

Creative Commons -lisenssi
Tämä teos on lisensoitu Creative Commons Nimeä 4.0 Kansainvälinen -lisenssillä
Säädatoja käytettäessä on mainittava lähde meteo.toimii.fi.