Web-Design-Challenge

Web Visualization Dashboard

Weather Dashboard webpage: https://peiday.github.io/Web-Design-Challenge/index.html

Latitude - Latitude Analysis Dashboard with Attitude

We'll be creating a visualization dashboard website using visualizations we've created in Python-API-Challenge/WeatherPy. Specifically, we'll be plotting weather data.

In building this dashboard, we'll create individual pages for each plot and a means by which we can navigate between them. These pages will contain the visualizations and their corresponding explanations. We'll also have a landing page (index.html), a page where we can see a comparison of all of the plots, and another data.html page where we can view the data used to build them.

Weather Dashboard

The website must consist of 7 pages total, including:

• A landing page containing:

  • An explanation of the project.
  • Links to each visualizations page with a sidebar containing preview images of each plot, and clicking an image would take you to that visualization.

• Four visualization pages, each with:

  • A descriptive title and heading tag.
  • The plot/visualization itself for the selected comparison with 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.

• A "Data" page that:

  • Displays a responsive table containing the data used in the visualizations.
    • The table is a bootstrap table component.
    • The data came from exporting the weatherpy_cities.csv file as HTML, or converting it to HTML with Pandas to_html that allows us to generate a HTML table from a pandas dataframe.

Weather Dashboard works at all window widths/sizes

Tools used: HTML, CSS, Pandas, JupyterNotbook