Home > Technologie > Wetter auf dem Web mit Sense Hat

Wetter auf dem Web mit Sense Hat

0
Advertisement

Wetter auf dem Web mit Sense Hat

Für dieses Projekt werden folgende Komponenten verwendet:

Himbeere Pi 3

Sense Hat

Sense Hat Fall

HDMI Kabel

Monitor

Tastatur

Maus

Sie suchen eine gute Einführung in Raspberry Pi? Versuchen Sie, die Zagros Raspberry Pi 3 Starter Kit , das alles , was Sie beginnen müssen muss Raspberry Pi zu entdecken.

Schritt 1: Überarbeiten der Wetteranzeige.

Wetter auf dem Web mit Sense Hat

Dieses Tutorial beginnt mit einer Python-Datei von einem vorherigen instructable: Wetter-Display mit Sense Hat.

Sie können zurück gehen und folgen, dass instructable erste oder herunterzuladen und öffnen Sie diese Datei in einem Python 3 Editor für die nächsten Schritte.

Werbung

Schritt 2: Installieren und Importieren von Flask Framework zum Projekt.

Wetter auf dem Web mit Sense Hat

Flasche einbauen. Im Terminal-Typ:

Sudo apt-get installieren python3-flasche

Import Flask zu Ihrem Projekt. In der weather_log.py Datei diese Zeile unter den anderen importierten Module hinzufügen:

Aus Flaschenimportkolben

Schritt 3: Python-Code zur Anzeige von HTML im Web.

Wetter auf dem Web mit Sense Hat

Fügen Sie diesen Code direkt unter der Variable "message" ein und speichern Sie ihn. Wir werden den Rest der App in zukünftigen Schritten aufbauen.

Python ist Raum empfindlich, der gesamte Code unter der Leitung von "def index (): 'sollte eingerückt werden.

@ App.route ( '/')

Def index ();

Jetzt = str (asctime ())

CurrentWeather = jetzt + "" + "-" + message + "\ n"

WeatherData = {

"Wetter": aktuelleWetter

aufrechtzuerhalten.

Return render_template ('index.html', ** weatherData)


Erklärung am unteren Rand des Codes: Sie können die while True voran gehen und zu löschen. In diesem Schritt haben wir es innerhalb der Indexfunktion verschoben. Das "Wetter" Eigenschaft wird auf die doppelte geschweifte Klammern im HTML übergeben werden.

Schritt 4: Erstellen Sie einen Web-App-Ordner für Ihr Projekt.

Wetter auf dem Web mit Sense Hat

Erstellen Sie einen Ordner Webapp im pi - Verzeichnis.

Erstellen Sie zwei Unterordner Vorlagen und statisch.

Schritt 5: Erstellen Sie eine Index.html-Datei aus dem Texteditor.

Wetter auf dem Web mit Sense Hat

Navigieren Sie zu Menü> Zubehör> Texteditor

Fügen Sie in diesem Abschnitt von HTML und speichern Sie sie unter dem Vorlagenordner mit einem Dateinamen index.html.

  <Html> <head> <link rel = "stylesheet" href = "/static/style.css" /> </ head> <body> <h1> Wetter: </ h1> <h2> {{weather}} < / H2> </ body> </ html>

Schritt 6: Stilieren Sie Ihre App.

Wetter auf dem Web mit Sense Hat

Erstellen Sie eine neue Datei im Text - Editor , speichern Sie es in dem statischen Ordner mit einem Dateinamen von style.css.

Fügen Sie diesen CSS-Code in den Editor ein. Fühlen Sie sich frei, kreativ zu erhalten und ändern Sie die Farben und die Art zu Ihrem Mögen.

Körper {
Hintergrund: marine;

Farbe: gelb;

Schriftfamilie: Arial, sans-serif;

Text-align: center;

aufrechtzuerhalten.

H1 {

Rand-Boden: 1px festes Gold;

Rand-Boden: 40px;

Polsterung: 10px;

aufrechtzuerhalten.

Schritt 7: Starten Sie den Webserver.

Wetter auf dem Web mit Sense Hat

Im Terminal starten Sie den Webserver durch Eingabe von:

Python3 webapp / wetter_log.py

Es sollte folgendes ausgeben:

* Läuft auf http://0.0.0.0:5000/

* Neustart mit Reloader

Schritt 8: Testen Sie Ihre App in einem Browser.

Wetter auf dem Web mit Sense Hat

Mit dem Web-Server läuft Ihr Browser zu:

Http://127.0.0.1:5000/

Dies funktioniert auch auf jedem Computer in Ihrem Netzwerk!

Sie sollten jetzt die aktuelle Temperatur, Luftfeuchtigkeit und Druck.

Solange der Webserver läuft, können Sie zu dieser Seite navigieren, um das aktuelle Wetter zu erhalten.

Related Reading