Skip to content

Displaying Forecast Info on OLED with Raspberry Pi

In this tutorial, you'll learn how to acquire data from a webpage and how to present that data on an OLED Wireling on your Raspberry Pi. This tutorial makes a simple daily weather summary display, but this concept can be applied to any kind of data from any webpage for whatever your particular application is.


Materials

Hardware

Software


Hardware Assembly

If you haven't already, attach the Wireling Adapter Raspberry Pi Hat to your Raspberry Pi. Then, use a Wireling cable to plug the 0.96" OLED Wireling into Port 0. Finally, plug in your Micro USB cable to power the Pi.


Software Setup

Assuming that you have gone through the Pi Hat Setup Tutorial and OLED Wireling Python Tutorial, all necessary packages for this project should already be installed on your pi.

ThingSpeak

ThingSpeak is an IoT analytics platform service that allows you to request information displayed on a website. To configure ThingSpeak for this project, you will need to create a ThingSpeak account.

Once you are signed in, go to Apps > ThingHTTP.

Then, click the "New ThingHTTP" button to create a new ThingHTTP request. From here, you will need to fill out three fields: Name, URL, and Parse String.

The Name is simply a label for the request - be specific enough so that you do not get lost trying to track down the correct request later!

Example.) Weather-Akron-Condition

The URL field is the full URL of the webpage you are requesting data from. For this project, we are using a weather site:

Example.) https://darksky.net/forecast/41.0814,-81.519/us12/en

Finally, the Parse String is a reference to the particular piece of data you want this request to handle. You obtain this field by going to the webpage you would like to request data from, right clicking on the piece of data you would like, then selecting "inspect element."

Once in the DOM and style inspector, the element you selected should already be selected. Right click the HTML tag containing the data you would like to get, select "Copy," and then "XPath." You will then paste the XPath into the Parse String field.

ex.) /html/body/div[3]/div[1]/span[1]/span[2]/span[1]

You may need to append /text() to the XPath, as some HTML remnants may persist otherwise.

ex.) /html/body/div[3]/div[1]/span[1]/span[2]/span[1]/text()

After this, click the "Save ThingHTTP" button to save your changes. This should allow you to view your ThingHTTP request details. On the right side of your screen should be the ThingSpeak ThingHTTP request URL. You can paste this URL directly into your browser's address bar to view the output of the request. It is a good idea to check this before pasting the URL into the code!

Repeat this process for any other pieces of data you would like to use for your project.


Upload Program

Create a new python file in whichever directory you choose by typing the following into the terminal:

liveweather.py

This will open up the text editor nano where you can simply paste the following code:

Code
import board
import busio
import tinycircuits_wireling
from digitalio import DigitalInOut
from PIL import Image, ImageDraw, ImageFont
import adafruit_ssd1306
from time import sleep
import requests
import datetime

# Create the I2C interface.
i2c = busio.I2C(board.SCL, board.SDA)
# A reset line may be required if there is no auto-reset circuitry
reset_pin = DigitalInOut(board.D10) # reset pin for Port0

# Initialize and enable power to Wireling Pi Hat
wireling = tinycircuits_wireling.Wireling()
OLED96_port = 0
wireling.selectPort(OLED96_port)

# Create OLED Display Class
display = adafruit_ssd1306.SSD1306_I2C(128, 64, i2c, addr=0x3c, reset=reset_pin) # 0.96" Screen

# Initialize display.
display.fill(0)
display.show()

#font = ImageFont.load_default()
font = ImageFont.truetype('/home/pi/.fonts/Minecraftia.ttf', 8)
bigfont = ImageFont.truetype('/home/pi/.fonts/Minecraftia.ttf', 10)

while True:
  print("Updating...")
  # request forecast data via ThingSpeak -- be sure to use your own URLs here!
  weather = requests.get('https://api.thingspeak.com/apps/thinghttp/send_request?api_key=BBO9M818XFR8E7XC')
  # print("got weather")
  tempHi = requests.get('https://api.thingspeak.com/apps/thinghttp/send_request?api_key=XF2TASIILNX6Q0FR')
  tempHiTime = requests.get('https://api.thingspeak.com/apps/thinghttp/send_request?api_key=6I4B4MKJ1Y8TKS4K')
  # print("got tempHi")
  tempLo = requests.get('https://api.thingspeak.com/apps/thinghttp/send_request?api_key=G3AV1R6XCHOSA0UL')
  tempLoTime = requests.get('https://api.thingspeak.com/apps/thinghttp/send_request?api_key=VGYR2JM4SY317PNN')
  # print("got tempLo")
  precip = requests.get('https://api.thingspeak.com/apps/thinghttp/send_request?api_key=DBT6HQUSKR4SRNW7')
  # print("got precip")
  hum = requests.get('https://api.thingspeak.com/apps/thinghttp/send_request?api_key=98UW9FEAVW8PC99W')
  # print("got hum")
  wind = requests.get('https://api.thingspeak.com/apps/thinghttp/send_request?api_key=Q08VJ2Y9VEEYXRG2')
  # print("got wind")
  time = datetime.datetime.now()

  # Create blank image for writing to screen
  display.fill(0)
  image = Image.new('1', (display.width, display.height))
  draw = ImageDraw.Draw(image)

  # CONDITION
  print ("Weather: " + weather.text)
  draw.text((0, 0), weather.text, font=font, fill=255)

  # TEMPERATURE
  print ("Temperature (Lo/Hi): " + tempLo.text + " @" + tempLoTime.text + " / " + tempHi.text + " @" + tempHiTime.text)
  draw.text((0, 20), tempLo.text + " @" + tempLoTime.text + " / " + tempHi.text + " @" + tempHiTime.text, font=font, fill=255)

  # PRECIPITATION
  print ("Precipitation: " + precip.text + "in")
  draw.text((0, 30), "Precip: " + precip.text + "in", font=font, fill=255)

  # HUMIDITY
  print ("Humidity: " + hum.text + "%")
  draw.text((0, 40), "Hum: " + hum.text + "%", font=font, fill=255)

  # WIND
  print ("Wind: " + wind.text + "mph")
  draw.text((64, 40), "Wind: " + wind.text + "mph", font=font, fill=255)

  # TIME STAMP
  print ("Last Updated " + time.strftime("%b %d %H:%M:%S"))
  draw.text((0, 54), "Updated " + time.strftime("%b %d %H:%M:%S"), font=font, fill=255)

  # update OLED display
  display.image(image)
  display.show()

  sleep(60) # update every 60s

You’ll need to change the ThingSpeak request URLs to your own based on the information you want to include in your display. It may be easier to edit this code in a text editor or IDE before pasting into the nano text editor on the Pi.

After changing the URLs and pasting the code, press Ctrl+O to write out the buffer, press Enter to save the buffer to liveweather.py, and then press Ctrl+X to exit.

Before running this program, be sure that the pigpio service is running on your Pi. This service can be started by typing:

sudo pigpiod

After this, you will be able to run the program by running the following command in the terminal:

sudo python3 liveweather.py

The program should now run and the values acquired via ThingSpeak will be printed to the OLED display. Terminate execution at any time by pressing Ctrl+C. It may take a moment to see the first pieces of data since several separate ThingSpeak requests have to be processed each time the loop runs.

Forecast data being displayed on a 0.96" OLED Wireling.


Contact Us

If you have any questions or feedback, feel free to email us or make a post on our forum. Show us what you make by tagging @TinyCircuits on Instagram, Twitter, or Facebook so we can feature it.

Thanks for making with us!