Skip to content

Commit

Permalink
second commit
Browse files Browse the repository at this point in the history
  • Loading branch information
@turquo1se
turquo1se committed Nov 11, 2020
1 parent c91a45f commit df85b36
Show file tree
Hide file tree
Showing 2 changed files with 90 additions and 86 deletions.
5 changes: 1 addition & 4 deletions .idea/workspace.xml
View file

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

171 changes: 89 additions & 82 deletions index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,115 +3,122 @@

<!-- Metadata -->
<head>
<meta charset='utf-8'>

<!-- Title -->
<title>Project Team 12: Data Within Education, DS 4200 F20</title>
<!-- CSS Styling -->
<link rel='stylesheet' href='style.css'>

<!-- Favicons -->
<link rel='apple-touch-icon' sizes='180x180' href='favicons/apple-touch-icon.png'>
<link rel='icon' type='image/png' sizes='32x32' href='favicons/favicon-32x32.png'>
<link rel='icon' type='image/png' sizes='16x16' href='favicons/favicon-16x16.png'>
<link rel='manifest' href='favicons/site.webmanifest'>
<link rel='shortcut icon' href='favicons/favicon.ico'>
<meta name='msapplication-TileColor' content='#da532c'>
<meta name='msapplication-config' content='favicons/browserconfig.xml'>
<meta name='theme-color' content='#ffffff'>
<meta charset='utf-8'>

<!-- Title -->
<title>Project Team 12: Data Within Education, DS 4200 F20</title>

<!-- CSS Styling -->
<link rel='stylesheet' href='style.css'>

<!-- Favicons -->
<link rel='apple-touch-icon' sizes='180x180' href='favicons/apple-touch-icon.png'>
<link rel='icon' type='image/png' sizes='32x32' href='favicons/favicon-32x32.png'>
<link rel='icon' type='image/png' sizes='16x16' href='favicons/favicon-16x16.png'>
<link rel='manifest' href='favicons/site.webmanifest'>
<link rel='shortcut icon' href='favicons/favicon.ico'>
<meta name='msapplication-TileColor' content='#da532c'>
<meta name='msapplication-config' content='favicons/browserconfig.xml'>
<meta name='theme-color' content='#ffffff'>
</head>

<!-- Main page content -->
<body>

<!-- Update this with your GitHub repo URL -->
<span id='forkongithub'><a href='https://github.com/NEU-DS-4200-F20/project-group-12-data-within-education'>Fork me on GitHub</a></span>
<!-- Update this with your GitHub repo URL -->
<span id='forkongithub'><a href='https://github.com/NEU-DS-4200-F20/project-group-12-data-within-education'>Fork me on GitHub</a></span>

<!-- Writeup -->
<div class='content-column'>
<h1>Project Team 12: Data Within Education, DS 4200 F20</h1>

<!-- Writeup -->
<div class='content-column'>
<h1>Project Team 12: Data Within Education, DS 4200 F20</h1>

<p><strong>Taeyoon Jin</strong>, <strong>Paul Vicks</strong>, <strong>Haicheng Liu</strong></p>

<p>Service-Learning Course Project as part of
<a href='https://canvas.instructure.com/courses/1781732'>DS 4200 F20: Information Visualization</a>,
taught by <a href='https://cody.khoury.northeastern.edu/'>Prof. Cody Dunne</a>,
<a href='https://visualization.khoury.northeastern.edu/'>Data Visualization @ Khoury</a>,
<a href='https://www.khoury.northeastern.edu/'>Northeastern University</a>.</p>
<a href='https://canvas.instructure.com/courses/1781732'>DS 4200 F20: Information Visualization</a>,
taught by <a href='https://cody.khoury.northeastern.edu/'>Prof. Cody Dunne</a>,
<a href='https://visualization.khoury.northeastern.edu/'>Data Visualization @ Khoury</a>,
<a href='https://www.khoury.northeastern.edu/'>Northeastern University</a>.</p>


<h1>Abstract</h1>

<p>Replace with your paper abstract.</p>


<h1>Visualization</h1>

<p>Include the interactive visualization as part of this page. Static example follows.</p>


</div>

<!-- Visualization goes here -->
<div class='vis-holder'>
<!-- Change viewbox to whatever you want, e.g., '0 0 1000 6000' This determines your aspect ratio and coordinate system -->
<!-- Delete all the sample SVG code below after the viewbox to before the closing tag. Populate this part of the SVG with D3. -->
<div class='table-holder' id='table'
preserveAspectRatio='xMidYMid meet' class='vis-svg' viewBox='0 0 1000 1000' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'>
</div>

<div class='scatterplot-holder' id='scatterplot'
preserveAspectRatio='xMidYMid meet' class='vis-svg' viewBox='0 0 1000 1000' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'>

</div>

</div>

<!-- Further writeup -->
<div class = 'content-column'>

</div>

<!-- Visualization goes here -->
<div class='vis-holder'

<!-- Change viewbox to whatever you want, e.g., '0 0 1000 6000' This determines your aspect ratio and coordinate system -->
<!-- Delete all the sample SVG code below after the viewbox to before the closing tag. Populate this part of the SVG with D3. -->
<div class='table-holder' id='table'
preserveAspectRatio='xMidYMid meet' class='vis-svg' viewBox='0 0 1000 1000' version='1.1'
xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'>

</div>


<div class='scatterplot-holder' id='scatterplot'
preserveAspectRatio='xMidYMid meet' class='vis-svg' viewBox='0 0 1000 1000' version='1.1'
xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'>

</div>

</div>

<!-- Further writeup -->
<div class='content-column'>

<h1>Demo Video</h1>

<p>Embed an MP4 demo video using the HTML5 &lt;video&gt; tag. For example, this screen recording Prof. Cody Dunne made of Mike Bostock's flexible transitions in D3 slide:</p>


<p>Embed an MP4 demo video using the HTML5 &lt;video&gt; tag. For example, this screen recording Prof. Cody Dunne
made of Mike Bostock's flexible transitions in D3 slide:</p>

<video controls width='100%'>
<source src='http://www.ccs.neu.edu/home/cody/courses/shared/d3-flexible-transitions.mp4' type='video/mp4'>
<p>Your browser doesn't support HTML5 video. Here is
a <a href='http://www.ccs.neu.edu/home/cody/courses/shared/d3-flexible-transitions.mp4'>link to the video</a> instead.</p>
<source src='http://www.ccs.neu.edu/home/cody/courses/shared/d3-flexible-transitions.mp4' type='video/mp4'>
<p>Your browser doesn't support HTML5 video. Here is
a <a href='http://www.ccs.neu.edu/home/cody/courses/shared/d3-flexible-transitions.mp4'>link to the
video</a> instead.</p>
</video>

<h1>Visualization explanation</h1>

<p>Replace with a brief explanation (can be copied from the paper) and linked presentation slides.</p>

<h1>Acknowledgments</h1>

<p>
List here where any code, packages/libraries, text, images, designs, etc. that you leverage come from.
List here where any code, packages/libraries, text, images, designs, etc. that you leverage come from.
</p>

<ul>
<li><a href='https://d3js.org/'>
D3: Data-Driven Documents</a>
by Mike Bostock is used for manipulating the DOM to create visualizations.
</li>
<li><a href='https://codepo8.github.io/css-fork-on-github-ribbon/#'>
Pure CSS responsive 'Fork me on GitHub' ribbon</a>
by Chris Heilmann is used to create the banner that links back to the source code repository.
</li>
<li><a href = 'https://observablehq.com/@d3/d3v6-migration-guide'>
D3 Migration Guide
</a>
Used to implement D3 Map function for V6
</li>
<li><a href='https://d3js.org/'>
D3: Data-Driven Documents</a>
by Mike Bostock is used for manipulating the DOM to create visualizations.
</li>
<li><a href='https://codepo8.github.io/css-fork-on-github-ribbon/#'>
Pure CSS responsive 'Fork me on GitHub' ribbon</a>
by Chris Heilmann is used to create the banner that links back to the source code repository.
</li>
<li><a href='https://observablehq.com/@d3/d3v6-migration-guide'>
D3 Migration Guide
</a>
Used to implement D3 Map function for V6
</li>
</ul>
</div>
<!-- Scripts at the end avoid need for dealing with async, defer, or onload event handlers -->
<script src='lib/d3.v6.1.1/d3.min.js'></script>
<script src='js/visualization.js'></script>
<script src='js/visualization_one.js'></script>
<script src='js/visualization_two.js'></script>
</div>

<!-- Scripts at the end avoid need for dealing with async, defer, or onload event handlers -->
<script src='lib/d3.v6.1.1/d3.min.js'></script>
<script src='js/visualization.js'></script>
<script src='js/visualization_one.js'></script>
<script src='js/visualization_two.js'></script>
</body>
</html>

0 comments on commit df85b36

Please sign in to comment.