rmat112/Mapping_Earthquakes

Create interactive maps using Leaflet.js, GeoJSON , Javascript and D3 library to explore earthquakes around the world.

Mapping_Earthquakes

Project Overview

For this project I created an earthquake map with two different base maps and the earthquake overlay. Now, Basil and Sadhana would like to see the earthquake data in relation to the tectonic plates’ location on the earth, and they would like to see all the earthquakes with a magnitude greater than 4.5 on the map, and they would like to see the data on a third map.

Tools

• VS Code
  
• HTML/CSS
  
• JavaScript
  
• Leaflet.js
  
• GeoJSON data

Links

Link to my JS code: challenge_logic.js
Link to my deployed webpage for this challenge: https://rmat112.github.io/Mapping_Earthquakes/

Results

1. Tectonic Plates

The first part of this challenge includes improving the map by adding tectonic plate data using d3.json() as below:

• The tectonic plate data is added as a second layer group
  

• The tectonic plate data is added to the overlay object
  

• The d3.json() callback does the following:
  

  • The tectonic plate data is passed to the geoJSON() layer
  • The geoJSON() layer adds color and width to the tectonic plate lines
  • The tectonic layer group variable is added to the map

• The earthquake data and tectonic plate data displayed on the map when the page loads

2. Major Earthquake Data

The next improvement is to add major earthquake data to the map using d3.json() as below:

• The major earthquake data is added as a third layer group

• The major earthquake data is added to the overlay object

• The d3.json() callback is working and does the following:

  • Sets the color and diameter of each earthquake.
  • The major earthquake data is passed to the geoJSON() layer
  • The geoJSON() layer creates a circle for each major earthquake, and adds a popup for each circle to display the magnitude and location of the earthquake
  • The major earthquake layer group variable is added to the map

• All the earthquake data and tectonic plate data are displayed on the map when the page loads and the datasets can be toggled on or off

3. Third Base Map

Finally, using the options from the Mapbox styles, a third map style is added as a tile layer object to the challenge_logic.js file and the map variable is added to the base layer object.

All the earthquake data and tectonic plate data are displayed on the all maps of the webpage (5 pt)