Making Earthquake PH: Working with Tweets and Maps

The recent disaster in Batangas becuase of the Taal Volcano caused a spew of scientific terms and overflow of science communication to the public. It got me thinking on how we inform the general public regarding these terms and especially during these times where many volcanic earthquakes occur.

Looks like @phivolcs_dost needs a social media / digital comms manager to translate all of this info into human speak. #informationdissemination https://t.co/9H2vqyleE7

— Gretchen Ho (@gretchenho) January 13, 2020

As per Gretchen Ho’s tweet above how do we make PHIVOLCS’ tweets into human speak. That’s when I thought of making Earthquake PH.

What is Earthquake PH?

Earthquake PH is a website that gives details about earthquakes in the Philippines in an understandable manner through,descriptions and map visualizations of where earthquakes are. This site was created to make the general public informed about details about earthquakes making information understandable to the normal citizen.

How does Earthquake PH work?

The site uses the Twitter API to scrape the most recent tweets from the PHIVOLCS account every ten minutes. From the recent tweets, we filter them to get tweets specifically regarding earthquake information. Next, we parsed the information from the full text of the Tweet to get the following information using Regular Expressions:

• Date and Time
• Location
• Latitude
• Longitude
• Strength or Magnitude
• Depth of Focus

After this, we run the coordinates to a reverse Geocoder to give us an address of where the epicenter of the earthquake is and then save it to our MongoDB database.

Features of Earthquake PH

Earthquake Details

The first feature is a general overview of the details regarding the earthquake. I included the general details from the tweet, a Google Map of the epicenter based on the longitude and latitude given and descriptions about how strong the earthquake was from this website.

Quake Map

I decided to add another feature which is called the Quake Map the Quake Map visualizes on the screen where the 10 latest earthquakes are, how strong they were and when and where exactly they took place.

Technology Used

Now for the technical details, the website is a monolith Express.js application, a MongoDB database from MongoDB Atlas, Several Map and Geocoding APIs and of course Twitter’s Developer API.

In the detail pages of the earthquakes, I used Google’s Map Embed API to visualize the location of the earthquake. On the other hand, I used Leaflet and OpenStreetMaps for the Quake Map since it’s open-source and free unlike Google’s API for multiple markers. Leaflet can also be used for more features down the line.

On updating the data on the site, I just do this by having a Node.js script that runs every 10 minutes and on this file, using the Twitter API, I get the 100 most recent tweets of PHIVOLCS not including RTs then get the information through RegEx, then I check the database if the Tweet ID is already included in the database if it’s not I used LocationIQ’s Reverse Geocoding API to get an address of where the earthquake occurred. Then insert it to the database.

Using the site.

You can visit the site by going to https://earthquakeph.francisoliver.dev/ or by clicking here. The site currently has more than 120 recorded earthquakes and counting.Feel free to suggest new features to the website and how I can improve it.

Share this article:

Related Articles: