<div id="field1" style="font-family: Arial;font-size: 18px;">Carregant field1...</div>

<div id="field2" style="font-family: Arial;font-size: 18px;">Carregant field2...</div>

<div id="field3" style="font-family: Arial;font-size: 18px;">Carregant field3...</div>

<div id="field4" style="font-family: Arial;font-size: 18px;">Carregant field4...</div>

<div id="field5" style="font-family: Arial;font-size: 18px;">Carregant field5...</div>

<div id="x" style="font-family: Arial;font-size: 5px;font-color: #FFFFFF">... </div>

<div id="fecha" style="font-family: Arial;font-size: 15px; color: #777;">Carregant data...</div>

<div id="link" style="font-family: Arial;font-size: 15px;"><a href="https://thingspeak.mathworks.com/channels/2933623/feed.csv" style="text-decoration: none; color: #1155CC;">Exportar historial de dades en format CSV</a></div>

<script>

fetch('https://api.thingspeak.com/channels/2933623/feeds/last.json')

  .then(response => response.json())

  .then(data => {

    document.getElementById('field1').innerText = 'Temperatura: ' + data.field1 + ' °C';

    document.getElementById('field2').innerText = 'Pressió: ' + data.field2 + ' hPa';

    document.getElementById('field3').innerText = 'Humitat relativa: ' + data.field3 + ' %';

    document.getElementById('field4').innerText = 'Il·luminació: ' + Math.round(data.field4) + ' lux';

    document.getElementById('field5').innerText = 'Índex UV: ' + Math.round(data.field5);

    document.getElementById('fecha').innerText = 'Darrera actualització: ' + new Date(data.created_at).toLocaleString();

  })

  .catch(error => {

    console.error('Error en carregar les dades:', error);

    document.getElementById('field1').innerText = 'Error en carregar field1';

    document.getElementById('field2').innerText = 'Error en carregar field2';

    document.getElementById('field3').innerText = 'Error en carregar field3';

    document.getElementById('field4').innerText = 'Error en carregar field4';

    document.getElementById('field5').innerText = 'Error en carregar field5';

    document.getElementById('fecha').innerText = 'Error en carregar data';

  });

</script>