diff --git a/about.html b/about.html new file mode 100644 index 000000000..919fc924e --- /dev/null +++ b/about.html @@ -0,0 +1,233 @@ + + + + + + + About Us - NYC Air Quality + + + + + + + + + + + +
+

About Us

+
+

+ Hailing from the University of South Florida, we are a team of dedicated graduate students from the Masters in Business Analytics and Information Systems program. The NYC Air Quality Dashboard is a testament to our passion for leveraging technology to drive meaningful change. This platform was born out of our final project for the Distributed Information Systems course, but it represents much more than just an academic endeavor. We recognized the pressing need for accessible, real-time air quality data, especially in a dynamic environment like New York City. +

+ +

+ Our goal is to transform complex data into actionable insights, empowering residents and visitors of New York to make informed decisions about their health and well-being. In a world where data drives decisions, we are proud to provide a platform that bridges the gap between intricate datasets and the people who need them most. +

+ +

+ To delve deeper into our project's source code, feel free to explore our GitHub repository. We believe in the power of open-source collaboration and invite fellow enthusiasts to view, fork, and contribute to our codebase. +

+Visit our GitHub Repository + +

+ Dive in to learn more about the individuals who poured their expertise and enthusiasm into this project: +

+ +
+ + +
+

Bhanu Prakash Konda

+
+ +

+ I'm Bhanu Prakash Reddy Konda, a tech enthusiast with a background in Computer Science. With prior experience as a Java Developer at Tata Consultancy Services, I've combined my skills and passion to create this platform. Here, I'm dedicated to providing accessible and reliable air quality data. My contributions include meticulous dataset selection, web development, and ensuring seamless data integration, all aimed at making air quality information readily available for your benefit. +

+ + + +
+
+ +
+

Sravani Dondapati

+
+ +

+ I'm Sravani, pursiung Master's in Business Analytics and Information Systems at University of South Florida.My expertise lies in web development, and I've been deeply involved in creating various web pages that make up this platform. From designing layouts to ensuring seamless navigation, I've worked to create an engaging and user-friendly online experience for our visitors. + In addition to web development, I've taken on the task of sourcing and selecting the datasets used on this website. +

+ + + +
+
+ +
+

Vandana Sirpa

+
+ +

+ I'm Vandana Sirpa, a graduate student actively pursuing a Master's degree in Business Analytics and Information Systems. I worked as a Full Stack Developer at Capgemini. My contribution to the project in designing the database model to store the data and also helped in designing the webpage. +

+ + + +
+
+ +
+

Lakshmi Preetham Gupta

+
+ +

+ Greetings, I am Preetam, a graduate student actively pursuing a Master's degree in Business Analytics and Information Systems. I worked as a Business Analyst for 1.5 years in India. For this project, I contributed in making the webpage responsive by performing CRUD operations and adding the add/edit buttons to the webpage. +

+ + + +
+
+ +
+

Manoj Kumar Singam

+
+ +

+ I'm Manoj kumar Singam, a graduate student pursuing a Master's degree in Business Analytics and Information Systems. I worked as a Data Engineer at Deloitte. In this project, I have designed user-friendly webpages for an enhanced user experience +

+ + + +
+
+ + +

Contributions

+

+ Our team has worked diligently on various facets of the NYC Air Quality Dashboard. Below are some snapshots of our contributions, showcasing the diversity and depth of our work: +

+
+ +

Bhanu Prakash Konda(kbp753)

+ Bhanu Prakash Contribution + + +

Sravani Dondapati(SravaniDondapati)

+ Sravani Contribution + + +

Vandana Sirpa(VandanaSirpa)

+ Vandana Contribution + + +

Lakshmi Preetham Gupta Dogipartthi(preetham-999)

+ Preetham Contribution + + +

Manoj Kumar Singam(ManojSingam)

+ Manoj Contribution +
+ + +
+ + + + + + diff --git a/add-edit-data.html b/add-edit-data.html new file mode 100644 index 000000000..03616c7b4 --- /dev/null +++ b/add-edit-data.html @@ -0,0 +1,141 @@ + + + + + + + Add/Edit Air Quality Data - NYC + + + + + + + + + + +
+

Add/Edit Air Quality Data

+ +
+
+ + +
+ +
+ + +
+ +
+ + +
+ + + Cancel +
+ + Back to Air Quality Details +
+ + + + + + diff --git a/add-edit-location.html b/add-edit-location.html new file mode 100644 index 000000000..f65662a99 --- /dev/null +++ b/add-edit-location.html @@ -0,0 +1,120 @@ + + + + + + + Add/Edit Location - NYC Air Quality + + + + + + + + + + +
+

Add New Location

+
+ + + + + + + +
+
+ + + + + + \ No newline at end of file diff --git a/airquality-details.html b/airquality-details.html new file mode 100644 index 000000000..e38134f47 --- /dev/null +++ b/airquality-details.html @@ -0,0 +1,174 @@ + + + + + + + Air Quality Details - NYC + + + + + + + + + + +
+

Air Quality Details for Manhattan

+ +
+

Indicator: Ozone (O3)

+ + + + + + + + + + + + + + + + + + + + + + +
Time PeriodData ValueMeasureActions
202345O3 concentration + + +
+
+ + Back to Air Quality Overview +
+ + + + + + diff --git a/airquality-footer.html b/airquality-footer.html new file mode 100644 index 000000000..9a0669e0a --- /dev/null +++ b/airquality-footer.html @@ -0,0 +1,53 @@ + + + + + + + + Footer Component + + + + + + diff --git a/airquality-header.html b/airquality-header.html new file mode 100644 index 000000000..797ec2f12 --- /dev/null +++ b/airquality-header.html @@ -0,0 +1,85 @@ + + + + + + NYC Air Quality Dashboard + + + + +
+

NYC Air Quality

+ +
+ + diff --git a/airquality-overview.html b/airquality-overview.html new file mode 100644 index 000000000..bd9b751c2 --- /dev/null +++ b/airquality-overview.html @@ -0,0 +1,180 @@ + + + + + + + Geographical Overview - NYC Air Quality + + + + + + + + + + +
+

Geographical Overview of NYC Air Quality

+ + + + + + + + + + + + + + + + + + + + + + + + + + + +
Location NameLast Recorded QualityActions
ManhattanPM2.5 - Moderate + + + +
BrooklynOzone (O3) - Good + + + +
+
+ + + + + + diff --git a/assets/DIS Image.png b/assets/DIS Image.png new file mode 100644 index 000000000..414fc448b Binary files /dev/null and b/assets/DIS Image.png differ diff --git a/assets/Preetham.jpg b/assets/Preetham.jpg new file mode 100644 index 000000000..938caa794 Binary files /dev/null and b/assets/Preetham.jpg differ diff --git a/assets/SS_DIS.jpg b/assets/SS_DIS.jpg new file mode 100644 index 000000000..6c79eeaab Binary files /dev/null and b/assets/SS_DIS.jpg differ diff --git a/assets/Vandana.jpg b/assets/Vandana.jpg new file mode 100644 index 000000000..63a9b44f9 Binary files /dev/null and b/assets/Vandana.jpg differ diff --git a/assets/bhanu.jpeg b/assets/bhanu.jpeg new file mode 100644 index 000000000..301604187 Binary files /dev/null and b/assets/bhanu.jpeg differ diff --git a/assets/logo.png b/assets/logo.png new file mode 100644 index 000000000..287c57f5a Binary files /dev/null and b/assets/logo.png differ diff --git a/assets/manoj.JPEG b/assets/manoj.JPEG new file mode 100644 index 000000000..a00e28ca4 Binary files /dev/null and b/assets/manoj.JPEG differ diff --git a/assets/newyork_image.png b/assets/newyork_image.png new file mode 100644 index 000000000..6ee884997 Binary files /dev/null and b/assets/newyork_image.png differ diff --git a/assets/screenshot1.jpg b/assets/screenshot1.jpg new file mode 100644 index 000000000..f940cac68 Binary files /dev/null and b/assets/screenshot1.jpg differ diff --git a/assets/screenshot3.jpg b/assets/screenshot3.jpg new file mode 100644 index 000000000..26bece7a2 Binary files /dev/null and b/assets/screenshot3.jpg differ diff --git a/assets/screenshot4.jpg b/assets/screenshot4.jpg new file mode 100644 index 000000000..8b3103267 Binary files /dev/null and b/assets/screenshot4.jpg differ diff --git a/assets/screenshot5.jpg b/assets/screenshot5.jpg new file mode 100644 index 000000000..24218426f Binary files /dev/null and b/assets/screenshot5.jpg differ diff --git a/assets/sravs.jpg b/assets/sravs.jpg new file mode 100644 index 000000000..a364af892 Binary files /dev/null and b/assets/sravs.jpg differ diff --git a/css/main.css b/css/main.css deleted file mode 100644 index bcc90344f..000000000 --- a/css/main.css +++ /dev/null @@ -1,47 +0,0 @@ -/** -Sample css code -*/ -/* Set height to 100% for body and html to enable the background image to cover the whole page: */ -body, -html { - height: 100%; -} - -/*Set background image*/ -.container { - background-image: url('https://doc-10-ao-docs.googleusercontent.com/docs/securesc/ha0ro937gcuc7l7deffksulhg5h7mbp1/r085o9ungppbiokopob2sfbekae4uqbb/1537920000000/14802840322886517493/*/110cT8sl-pOiHGgj9yToPkAqAzrr-RNfb'); - height: 100%; - background-position: center; - background-size: cover; -} - -/* Position text in the middle */ -.middle { - position: absolute; - color: beige; - top: 70%; - left: 39%; - text-align: center; - font-size: 25px; -} - -/*Set circle in unordered list*/ -.middle ul { - list-style-type: circle; -} - -/*Set text inside li tag to left*/ -.middle ul li { - text-align: left !important; -} - -/*Set text color for a tag inside middle class and ul>li element*/ -.middle ul li a { - color: beige; -} - -/*Change text color and decoration for a tags inside middle class and ul>li element*/ -.middle ul li a:hover { - color: red; - text-decoration: none; -} diff --git a/datamodel.html b/datamodel.html new file mode 100644 index 000000000..b7327d814 --- /dev/null +++ b/datamodel.html @@ -0,0 +1,240 @@ + + + + + + + Data Model - NYC Air Quality Dashboard + + + + + + + + + + + + +
+

Data Model for NYC Air Quality Dashboard

+ +

+ The data model behind the NYC Air Quality Dashboard is structured to provide a comprehensive and granular view of + air quality metrics. This page provides an overview of the data model and its components. +

+ +

Key Data Fields:

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
Field NameDescription
Unique IDAn identifier for each data entry.
Indicator IDA reference ID for the air quality indicator.
NameName of the air quality indicator (e.g., PM2.5, Ozone).
MeasureThe type of measure (e.g., concentration).
Geo Type NameThe type of geographical region (e.g., city, county).
Geo Join IDAn ID to join with geographical data.
Geo Place NameThe name of the geographical location (e.g., New York City).
Time PeriodThe time period for the data (e.g., 2023).
Start DateThe starting date for the data entry.
Data ValueThe value of the air quality metric.
MessageAny additional message or note related to the data.
+ +

Visual Representation

+

Locations and AirQualityData have a one-to-many relationship. One location can have multiple air quality data entries, but each data entry is associated with only one location. AirQualityIndicators and AirQualityData also have a one-to-many relationship. One indicator can be associated with multiple data entries, but each data entry corresponds to only one indicator.

+ Data Model ERD + + +

Data Source

+

+ Our air quality data is sourced directly from the official New York City Data Portal. We pride ourselves on using authoritative and reliable data to provide accurate insights to our users. +

+
+ + + + + diff --git a/health.html b/health.html new file mode 100644 index 000000000..a227556fe --- /dev/null +++ b/health.html @@ -0,0 +1,214 @@ + + + + + + + Health Impact - NYC Air Quality Dashboard + + + + + + + + + + +
+

Health Impact of Air Quality

+
+

+ Air quality is an essential determinant of health, impacting millions globally. While we often associate air with life, giving us oxygen to breathe, the very same air can become a silent threat when polluted. The contaminants present in polluted air can infiltrate our systems, leading to a multitude of health concerns, both short-term and long-term. +

+

+ As urbanization and industrial activities grow, so does the concern about the quality of the air we breathe. The pollutants can range from tiny particulate matter, barely visible to the naked eye, to harmful gases. Each of these pollutants has its own health effects, with some causing immediate harm, while others affect us over extended periods of exposure. +

+

+ Understanding the health implications of various air quality indicators is crucial. It not only helps individuals take preventive measures but also drives policy decisions on a larger scale. This section delves into the health impacts of prominent air quality indicators, shedding light on why it's imperative to monitor and act upon deteriorating air quality. +

+
+

Key Air Quality Indicators & Their Impact

+
+ +
+

PM2.5 (Fine Particulate Matter)

+

These particles can be inhaled deeply, possibly causing heart attacks, worsening asthma, and decreasing lung function.

+
+ + +
+

Ozone (O3)

+

Ground-level ozone can trigger health issues, especially for vulnerable groups like children and the elderly.

+
+ + +
+

Nitrogen Dioxide (NO2)

+

High NO2 levels can irritate the lungs and lower resistance to respiratory infections.

+
+ + +
+

Sulfur Dioxide (SO2)

+

Exposure to SO2 can harm the human respiratory system and make breathing difficult.

+
+
+ +

Preventive Measures

+
+ +
+

Indoor Air Quality

+

Ensure good ventilation indoors. Consider using air purifiers to remove pollutants.

+
+ + +
+

Limiting Outdoor Activities

+

On days with poor air quality, minimize outdoor physical activities, especially during peak pollution hours.

+
+ + +
+

Using Masks

+

Wearing masks can reduce the inhalation of harmful pollutants, especially in high traffic areas.

+
+
+ +

Vulnerable Groups

+
+ +
+

Children

+

Children's lungs are still developing, making them more susceptible to air pollutants.

+
+ + +
+

Elderly

+

Older adults may have pre-existing health conditions that can be aggravated by poor air quality.

+
+ + +
+

People with Health Conditions

+

Individuals with respiratory or cardiovascular conditions are at higher risk during poor air quality days.

+
+
+ +

Frequently Asked Questions

+

Q: How can I check the air quality in my area?

+

A: Several online platforms and mobile apps provide real-time air quality indices. You can also refer to the NYC Air Quality Dashboard for detailed metrics.

+ +

Q: Are masks effective in preventing the inhalation of pollutants?

+

A: Certain masks, like N95 respirators, can filter out small particulate matter and are recommended in areas with high pollution levels.

+ +

Q: How does poor air quality affect children?

+

A: Children are more vulnerable to the effects of air pollution as their lungs are still developing. It can exacerbate asthma symptoms and reduce lung growth.

+ +
+ + + + + + diff --git a/img/usf-logo-png-2.png b/img/usf-logo-png-2.png deleted file mode 100644 index 3d3d8548e..000000000 Binary files a/img/usf-logo-png-2.png and /dev/null differ diff --git a/index.html b/index.html index fbae197cd..380ac239a 100644 --- a/index.html +++ b/index.html @@ -1 +1,288 @@ - \ No newline at end of file + + + + + + + NYC Air Quality Dashboard + + + + + + + + + + + + +
+
+
+ NYC skyline with clear sky +
+
Welcome to NYC Air Quality
+

Monitoring and analyzing air quality in New York City.

+ Start Exploring Data +
+
+ + + + + + +
+

Our Mission & Vision

+

At NYC Air Quality Dashboard, we are dedicated to providing comprehensive air quality data for New York City. Our vision is to create a healthier environment for all residents and visitors by raising awareness and promoting actions towards better air quality.

+ +
+

Features of the Dashboard

+
+
+

Historical Data

+

Delve deep into the past and see how air quality has changed over the years in NYC.

+
+
+

Health Insights

+

Understand the impact of different air quality indicators on human health.

+
+
+

Recent Data

+

Stay updated with the latest air quality data from across New York City.

+
+
+
+ +
+

Did You Know?

+
+
+

Air Pollution's Global Impact

+

Air pollution causes about 1 in 8 deaths worldwide, making it the world's most significant environmental health risk.

+
+
+

The Indoor Air Quality Paradox

+

Indoor air can be 2-5 times more polluted than outdoor air, yet we spend nearly 90% of our time indoors.

+
+
+

Nature's Air Purifiers

+

Plants can act as natural air purifiers, with some species known to remove up to 87% of air toxins in 24 hours.

+
+
+
+
+

Frequently Asked Questions

+
+

Q: How often is the data updated?

+

A: We strive for real-time updates, but we depend on our data providers. The last update was one year ago.

+
+
+

Q: Can I access historical data?

+

A: Yes, our platform provides access to historical air quality data for up to 10 years.

+
+
+
+ + + + + diff --git a/js/main.js b/js/main.js deleted file mode 100644 index 848a3f230..000000000 --- a/js/main.js +++ /dev/null @@ -1,14 +0,0 @@ -/** - * Your JS code here - */ - -/** - * Sample code - */ -document.addEventListener('DOMContentLoaded', function() { - var ulElement = document.getElementById('links'); - var liElement = document.createElement('li'); - liElement.appendChild(document.createTextNode('created by main.js')); - - ulElement.appendChild(liElement); -}); diff --git a/scripts.js b/scripts.js new file mode 100644 index 000000000..85be6d99f --- /dev/null +++ b/scripts.js @@ -0,0 +1,14 @@ +// Function to load a component into a placeholder +function loadComponent(componentId, componentUrl) { + fetch(componentUrl) + .then(response => response.text()) + .then(data => { + document.getElementById(componentId).innerHTML = data; + }); +} + +// Load header and footer on page load +window.onload = function() { + loadComponent('header-placeholder', 'airquality-header.html'); + loadComponent('footer-placeholder', 'airquality-footer.html'); +}; diff --git a/styles.css b/styles.css new file mode 100644 index 000000000..6378cc7e5 --- /dev/null +++ b/styles.css @@ -0,0 +1,84 @@ +/* CSS Reset */ +* { + margin: 0; + padding: 0; + box-sizing: border-box; +} + +body { + font-family: 'Arial', sans-serif; + line-height: 1.6; + background-color: #f4f4f4; +} + +/* CSS Variables for Theme */ +:root { + --primary-color: #333; + --secondary-color: #555; + --highlight-color: #007bff; + --background-color: #f4f4f4; + --text-color: var(--primary-color); + --link-color: var(--highlight-color); +} + +/* Global Styles */ +a { + text-decoration: none; + color: var(--link-color); + transition: color 0.3s ease; +} + +a:hover { + color: var(--primary-color); +} + +h1, h2, h3, h4, h5, h6 { + margin-bottom: 1rem; +} + +/* Header Styles */ +header { + display: flex; + justify-content: space-between; + align-items: center; + padding: 1rem 5%; + background-color: #fff; + box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); +} + +header img { + width: 50px; + height: 50px; +} + +nav a { + margin-left: 1rem; +} + +/* Main Content Styles */ +main { + max-width: 1200px; + margin: 2rem auto; + padding: 0 5%; +} + +/* Footer Styles */ +footer { + padding: 1rem 5%; + background-color: #fff; + box-shadow: 0 -2px 4px rgba(0, 0, 0, 0.1); + text-align: center; +} + +/* Media Queries for Responsiveness */ +@media screen and (max-width: 768px) { + header { + flex-direction: column; + text-align: center; + } + + nav a { + margin: 0.5rem 0; + } +} +