D3 Examples - Interactive Visualization

viz-project

Final data visualization project for Data Visualization class (WPI CS573)

URL to view the results of this project: https://cjkraenzle.github.io/viz-project/

This visualization project will be used for my final visualization project. This project will create visualizations based on the world happiness report. Which can be found at http://worldhappiness.report. Direct link to the data can be found at http://worldhappiness.report/wp-content/uploads/sites/2/2017/03/online-data-chapter-2-whr-2017.xlsx.

xxxxxxxxxx
 
<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width">
​
    <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Poiret+One">
    <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Open+Sans">
    <link rel="stylesheet" type="text/css" href="main.css" >
​
    <title>Viz Project</title>
​
    <script src="https://d3js.org/d3.v4.min.js"></script>
    <script src="data.js"></script>
    <script src="d3-plotter.js"></script>
    <script src="index.js"></script>
  </head>
  <body>
    <section id="appHeader">
      Interactive Visualization
    </section>
    <section id="appChart">
        <svg id="chart1" class="chart"></svg>
    </section>
    <section id="appValues">
      <ul>
        <li id="li0" class="selected" value="">Clear</li>
        <li id="li1" class="" value="">High Income</li>
        <li id="li2" class="" value="">Upper Middle</li>
        <li id="li3" class="" value="">Lower Middle</li>
        <li id="li4" class="" value="">Low Income</li>
      </ul>
    </section>
  </body>
</html>
    