The web-visualization-dashboard from sheetalbongale

sheetalbongale / web-visualization-dashboard Goto Github PK

View Code? Open in Web Editor NEW

Design a Web Dashboard using HTML, CSS & Bootstrap to visualize the relation between latitude and weather parameters for 500+ cities across the world of varying distance from the equator. https://sheetalbongale.github.io/Web-Visualization-Dashboard/ | UT Data Analysis and Visualization Nov 2019 - May 2020.

HTML 61.29% CSS 38.71%

web-visualization-dashboard's Introduction

Web Visualization Dashboard (Latitude)

Submitted by : Sheetal Bongale | UT Data Analysis and Visualization | Feb 22, 2020

Click here to check the Web Dashboard.

Objective

Creating a visualization dashboard website using visualizations rendered from the data analysis done using simple Python library](https://pypi.python.org/pypi/citipy) and the OpenWeatherMap API.

Data Analysis Notebook :

Click here to find the script to perform API call, data analysis done using Pandas and visualization using Matplotlib.

Website Requirements

The website must consist of 7 pages total, including:

A landing page containing:
- An explanation of the project.
- Links to each visualizations page.
Four visualization pages, each with:
- A descriptive title and heading tag.
- The plot/visualization itself for the selected comparison.
- A paragraph describing the plot and its significance.
A "Comparisons" page that:
- Contains all of the visualizations on the same page so we can easily visually compare them.
- Uses a bootstrap grid for the visualizations.
  - The grid must be two visualizations across on screens medium and larger, and 1 across on extra-small and small screens.
A "Data" page that:
- Displays a responsive table containing the data used in the visualizations.
  - The table must be a bootstrap table component.
  - The data must come from exporting the .csv file as HTML, or converting it to HTML. You may use a csv-to-html table conversion tool, e.g. ConvertCSV.

The website must, at the top of every page, have a navigation menu that:

Has the name of the site on the left of the nav which allows users to return to the landing page from any page.
Contains a dropdown on the right of the navbar named "Plots" which provides links to each individual visualization page.
Provides two more links on the right: "Comparisons" which links to the comparisons page, and "Data" which links to the data page.
Is responsive (using media queries). The nav must have similar behavior as the screenshots "Navigation Menu" section.

Finally, the website must be deployed to GitHub pages.

https://sheetalbongale.github.io/Web-Visualization-Dashboard/

Recommend Projects