Quaka

Quaka is an Earhquakes Data visualization app.

Course Instructor Dr. Peter Bak - IBM Haifa Research Lab *

Publication date: 16/8/2017

License: MIT

Project general description

We used d3 (v3) library to draw the data, leaflet for viewing the map. We also used the following plug-ins/libs to help us building the app:

• Select area: A leaflet plugin for selecting area on the map. *
• d3 slider: A d3 plugin for building sliders easily.*
• IntroJS: A javascript library for displaying quick tour for first site visit.*
• USGS: Used to get the data in GeoJSON format.*

Documentation

When you visit the app, you get the following page:

After that, when the Data download finish successfully, you get the app's main page:

App Elements

Navigation bar:

The navigation bar contain most of the app buttons and tools, it is always available for easy access.

Maps:

The Maps menue contain different map layers, the user can select the layer he prefer with a click. We think the most suitable map is the one we created, it is simple, clear, beatiful, we chose it to be the default map.

Tools:

The Tools menue contain different tools the user can use:

• Toggle Labels: This tool is special for our simple map, it add a labels layer to our simple map.
• Toggle Layer: This tool Show/Hide the hover Layer, this layer is useful to highlight current country borders, zooming when clicking a country.
• Toggle Felt Data: This tool used to add/remove a green stroke for events that have been felt by at least one person.





• Toggle Theme: This tool is special for our simple map, toggle between Light (default) and Dark Theme.

Data:

The Data menue contain different data types:

• Last Day: Default data type, display events during the past 24 hours.
• Past 7 Days: Display events during the past 7 days.
• All Month: Display events during the past 30 days.

Filter By:

The Filter By menue contain different data filters:

• Select Area: A tool that give the user the ability to view only events from spesific area by selecting it.





• Time:A tool that give the user the ability to view only events at spesific time range.
• Magnitude: A tool that give the user the ability to view only events that fall in spesific magnitude range.
• Depth: A tool that give the user the ability to view only events that fall in spesific depth range.
• Felt: A tool that give the user the ability to view only events that have been felt by at lease one person.
Significance

Animate:

This tool allow the user to view the date dynamically, ordered by the time the event occured, it is useful to see if there is a patterent or some relation between event size, location ,etc.

It also give the user the ability to choose the time interval between each event view (in ms):

Please notice that once an animate session started, you can stop it by clicking the red "S" button in the control buttons:

Reset:

The reset button reset the map to it's original state, with the last choosen data type (past day, past 7 days..), it does so without re-downloading the data again.it is useful to restore the map at the end of applaying different filters.

Refresh:

The refresh button is used to enable or disable the "auto refresh" feature, this feature update the data every 5 minutes without user interaction. It is useful for keeping the data up to date with the USGS website.

Download:

The download button allow the user to update the data on-demand, It is useful when the user want to view the last data.

Help:

The help button show a quick tour for the user, the same tour that displayed on the first time the user visit the site.

Full screen:

The full screen button toggle between full/normal screen mode, It is useful to give the user all the available space to view the data clearly.

Country name:

This card show the user current hovered country name. It also tell the user to click a country to zoom to it.

Point Info:

This card show the user infromation about the current hovered point.

Legend:

This card show the user the legend of the viewd attributes: Magnitude, Significance, Felt.

Controls:

• The "+" button: Zoom in button.
• The "-" button: Zoom out button.
• The "R" button: Reset Zoom to view all the world.
• The "L" button: Show/hide the Legend card.
• The "S" button: Stop the animation. only shown during animation

Summary Table:

The summary table show the user useful infromation about the current viewd data, number of events, minimum/maximum attributes range...

Filter Table:

The filter table help the user to keep track with what filters he applied to the data. It only shown when filters applied.