Stap 6: Het lezen van gegevens uit de Arduino Yun
Na het uploaden van de codes in de vorige steop, de Arduino Yun zullen al het lezen van gegevens van de sensoren. Nu als u de seriële poort in Arduino opent, ziet u sets met waarden van gegevens.
Wat de Bridge.ino betekent van de laatste stap is om deze gegevens ontvangen en stuur ze naar een IP-adres dat onze web-app kan lezen uit.
Nu beginnen we met de bouw van het web app.
Open een teksteditor. Maak een HTML-bestand. Kopieer de volgende codes in het bestand. Aangezien ik niet de codes hier kopiëren omdat dit formulier automatisch in werkelijke webpagina maakt, ben ik het HTML-bestand koppelen.
Na het HTML-bestand dat de basisstructuur van de webpagina, moeten we het regelen van de elementen van het HTML-bestand. Zo creëren we een css-bestand "aangepast custom.css". Zie bijlage voor het css-bestand. Sla het op in dezelfde map als het HTML-bestand.
Nu dat we onze aangepaste css-bestand hebt ingetoetst. Aangezien we zijn met behulp van JQueryMobile, moeten we om te downloaden van JQueryMobile en zet het in dezelfde map. Ik aangesloten de JQueryMobile zip-bestand ook. Unzip het alvorens de map in dezelfde map als het HTML-bestand.
Door nu hebben we al het uiterlijk van de webpagina en de regeling van het element. Nu moeten we nog een of andere manier krijgen de feitelijke gegevens en zet ze in de elementen van de webpagina.
Zo maken we een javascript-bestand. Ik heb ook het javascript-bestand bijgevoegd. Zet het in dezelfde map als het HTML-bestand.
Vergeet niet dat u zult moeten wijzigen, het IP-adres in het javascript-bestand omdat elke Arduino Yun een ander IP-adres heeft.
Nu moet u een webpage die ziet er enigszins zoals in afbeelding 1.