Last active
October 5, 2015 13:10
-
-
Save asizer/a9644f0183442214a78a to your computer and use it in GitHub Desktop.
Knight course Module 2: logging data
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| make | model | style | year | length | width | height | |
|---|---|---|---|---|---|---|---|
| Honda | Civic | Sedan | 1995 | 173 | 66.9 | 51.7 | |
| Honda | Civic | Sedan | 1996 | 175.1 | 67.1 | 54.7 | |
| Honda | Civic | Sedan | 1997 | 175.1 | 67.1 | 54.7 | |
| Honda | Civic | Sedan | 1998 | 175.1 | 67.1 | 54.7 | |
| Honda | Civic | Sedan | 1999 | 175.1 | 67.1 | 54.7 | |
| Honda | Civic | Sedan | 2000 | 175.1 | 67.1 | 54.7 | |
| Honda | Civic | Sedan | 2001 | 174.6 | 67.5 | 56.7 | |
| Honda | Civic | Sedan | 2002 | 174.6 | 67.5 | 56.7 | |
| Honda | Civic | Sedan | 2003 | 174.6 | 67.5 | 56.7 | |
| Honda | Civic | Sedan | 2004 | 175.4 | 67.5 | 56.7 | |
| Honda | Civic | Sedan | 2005 | 175.4 | 67.5 | 56.7 | |
| Honda | Civic | Sedan | 2006 | 176.7 | 69 | 56.5 | |
| Honda | Civic | Sedan | 2007 | 176.7 | 69 | 56.5 | |
| Honda | Civic | Sedan | 2008 | 176.7 | 69 | 56.5 | |
| Honda | Civic | Sedan | 2009 | 177.3 | 69 | 56.5 | |
| Honda | Civic | Sedan | 2010 | 177.3 | 69 | 56.5 | |
| Honda | Civic | Sedan | 2011 | 177.3 | 69 | 56.5 | |
| Honda | Civic | Sedan | 2012 | 177.3 | 69 | 56.5 | |
| Honda | Civic | Sedan | 2013 | 179.4 | 69 | 56.5 | |
| Honda | Civic | Sedan | 2014 | 179.4 | 69 | 56.5 | |
| Honda | Civic | Sedan | 2015 | 179.4 | 69 | 56.5 | |
| Honda | Fit | Hatch | 2015 | 160 | 67 | 60 | |
| Honda | Fit | Hatch | 2013 | 161.6 | 66.7 | 60 | |
| Honda | Fit | Hatch | 2012 | 161.6 | 66.7 | 60 | |
| Honda | Fit | Hatch | 2011 | 161.6 | 66.7 | 60 | |
| Honda | Fit | Hatch | 2010 | 161.6 | 66.7 | 60 | |
| Honda | Fit | Hatch | 2009 | 161.6 | 66.7 | 60 | |
| Honda | Fit | Hatch | 2008 | 157.4 | 66.2 | 60 | |
| Honda | Fit | Hatch | 2007 | 157.4 | 66.2 | 60 | |
| Honda | Accord | Sedan | 1995 | 186.8 | 70.1 | 55.3 | |
| Honda | Accord | Sedan | 1996 | 185.6 | 70.1 | 55.3 | |
| Honda | Accord | Sedan | 1997 | 185.6 | 70.1 | 55.1 | |
| Honda | Accord | Sedan | 1998 | 188.8 | 70.3 | 56.9 | |
| Honda | Accord | Sedan | 1999 | 188.8 | 70.3 | 56.9 | |
| Honda | Accord | Sedan | 2000 | 188.8 | 70.3 | 56.9 | |
| Honda | Accord | Sedan | 2001 | 189.4 | 70.3 | 56.9 | |
| Honda | Accord | Sedan | 2002 | 189.4 | 70.3 | 56.9 | |
| Honda | Accord | Sedan | 2003 | 189.5 | 71.5 | 57.1 | |
| Honda | Accord | Sedan | 2004 | 189.5 | 71.5 | 57.1 | |
| Honda | Accord | Sedan | 2005 | 189.5 | 71.5 | 57.1 | |
| Honda | Accord | Sedan | 2006 | 191.1 | 71.6 | 57.2 | |
| Honda | Accord | Sedan | 2007 | 191.1 | 71.6 | 57.2 | |
| Honda | Accord | Sedan | 2008 | 194.1 | 72.7 | 58.1 | |
| Honda | Accord | Sedan | 2009 | 194.1 | 72.7 | 58.1 | |
| Honda | Accord | Sedan | 2010 | 194.1 | 72.7 | 58.1 | |
| Honda | Accord | Sedan | 2011 | 194.1 | 72.7 | 58.1 | |
| Honda | Accord | Sedan | 2012 | 194.9 | 72.7 | 58.1 | |
| Honda | Accord | Sedan | 2013 | 191.4 | 72.8 | 57.7 | |
| Honda | Accord | Sedan | 2014 | 191.4 | 72.8 | 57.7 | |
| Honda | Accord | Sedan | 2015 | 191.4 | 72.8 | 57.7 | |
| Honda | Accord | Sedan | 2016 | 192.5 | 72.8 | 57.7 | |
| Toyota | Corolla | Sedan | 1995 | 171.9 | 66.3 | 53.5 | |
| Toyota | Corolla | Sedan | 1996 | 172 | 66.3 | 53.5 | |
| Toyota | Corolla | Sedan | 1997 | 172 | 66.3 | 53.5 | |
| Toyota | Corolla | Sedan | 1998 | 174 | 66.7 | 54.5 | |
| Toyota | Corolla | Sedan | 1999 | 174 | 66.7 | 54.5 | |
| Toyota | Corolla | Sedan | 2000 | 174 | 66.7 | 54.5 | |
| Toyota | Corolla | Sedan | 2001 | 174 | 66.7 | 54.5 | |
| Toyota | Corolla | Sedan | 2002 | 174 | 66.7 | 54.5 | |
| Toyota | Corolla | Sedan | 2003 | 178.3 | 66.9 | 57.7 | |
| Toyota | Corolla | Sedan | 2004 | 178.3 | 66.9 | 58.5 | |
| Toyota | Corolla | Sedan | 2005 | 178.3 | 66.9 | 58.5 | |
| Toyota | Corolla | Sedan | 2006 | 178.3 | 66.9 | 58.5 | |
| Toyota | Corolla | Sedan | 2007 | 178.3 | 66.9 | 58.5 | |
| Toyota | Corolla | Sedan | 2008 | 178.3 | 66.9 | 58.5 | |
| Toyota | Corolla | Sedan | 2009 | 178.7 | 69.3 | 57.7 | |
| Toyota | Corolla | Sedan | 2010 | 178.7 | 69.3 | 57.7 | |
| Toyota | Corolla | Sedan | 2011 | 180 | 69.4 | 57.7 | |
| Toyota | Corolla | Sedan | 2012 | 180 | 69.4 | 57.7 | |
| Toyota | Corolla | Sedan | 2013 | 180 | 69.4 | 57.7 | |
| Toyota | Corolla | Sedan | 2014 | 182.6 | 69.9 | 57.3 | |
| Toyota | Corolla | Sedan | 2015 | 182.6 | 69.9 | 57.3 | |
| Toyota | Corolla | Sedan | 2016 | 182.6 | 69.9 | 57.3 | |
| Toyota | Camry | Sedan | 2016 | 190.9 | 71.7 | 57.9 | |
| Toyota | Camry | Sedan | 2015 | 190.9 | 71.7 | 57.9 | |
| Toyota | Camry | Sedan | 2014 | 189.2 | 71.7 | 57.9 | |
| Toyota | Camry | Sedan | 2013 | 189.2 | 71.7 | 57.9 | |
| Toyota | Camry | Sedan | 2012 | 189.2 | 71.7 | 57.9 | |
| Toyota | Camry | Sedan | 2011 | 189.2 | 71.7 | 57.9 | |
| Toyota | Camry | Sedan | 2010 | 189.2 | 71.7 | 57.9 | |
| Toyota | Camry | Sedan | 2009 | 189.2 | 71.7 | 57.9 | |
| Toyota | Camry | Sedan | 2008 | 189.2 | 71.7 | 57.9 | |
| Toyota | Camry | Sedan | 2007 | 189.2 | 71.7 | 57.9 | |
| Toyota | Camry | Sedan | 2006 | 189.2 | 70.7 | 58.7 | |
| Toyota | Camry | Sedan | 2005 | 189.2 | 70.7 | 58.7 | |
| Toyota | Camry | Sedan | 2004 | 189.2 | 70.7 | 57.9 | |
| Toyota | Camry | Sedan | 2003 | 189.2 | 70.7 | 57.9 | |
| Toyota | Camry | Sedan | 2002 | 189.2 | 70.7 | 57.9 | |
| Toyota | Camry | Sedan | 2001 | 188.5 | 70.1 | 55.4 | |
| Toyota | Camry | Sedan | 2000 | 188.5 | 70.1 | 55.4 | |
| Toyota | Camry | Sedan | 1999 | 188.5 | 70.1 | 55.4 | |
| Toyota | Camry | Sedan | 1998 | 188.5 | 70.1 | 55.4 | |
| Toyota | Camry | Sedan | 1997 | 188.5 | 70.1 | 55.4 | |
| Toyota | Camry | Sedan | 1996 | 187.8 | 69.7 | 55.9 | |
| Toyota | Camry | Sedan | 1995 | 187.8 | 69.7 | 54.9 | |
| Toyota | Avalon | Sedan | 1995 | 190.2 | 70.3 | 56.1 | |
| Toyota | Avalon | Sedan | 1996 | 190.2 | 70.3 | 55.9 | |
| Toyota | Avalon | Sedan | 1997 | 190.2 | 70.3 | 55.9 | |
| Toyota | Avalon | Sedan | 1998 | 191.9 | 70.5 | 56.7 | |
| Toyota | Avalon | Sedan | 1999 | 191.9 | 70.5 | 56.7 | |
| Toyota | Avalon | Sedan | 2000 | 191.9 | 71.7 | 57.7 | |
| Toyota | Avalon | Sedan | 2001 | 191.9 | 71.7 | 57.7 | |
| Toyota | Avalon | Sedan | 2002 | 191.9 | 71.7 | 57.7 | |
| Toyota | Avalon | Sedan | 2003 | 191.9 | 71.7 | 57.1 | |
| Toyota | Avalon | Sedan | 2004 | 191.9 | 71.7 | 57.1 | |
| Toyota | Avalon | Sedan | 2005 | 197.2 | 72.8 | 58.5 | |
| Toyota | Avalon | Sedan | 2006 | 197.2 | 72.8 | 58.5 | |
| Toyota | Avalon | Sedan | 2007 | 197.2 | 72.8 | 58.5 | |
| Toyota | Avalon | Sedan | 2008 | 197.6 | 72.8 | 58.5 | |
| Toyota | Avalon | Sedan | 2009 | 197.6 | 72.8 | 58.5 | |
| Toyota | Avalon | Sedan | 2010 | 197.6 | 72.8 | 58.5 | |
| Toyota | Avalon | Sedan | 2011 | 197.6 | 72.8 | 58.5 | |
| Toyota | Avalon | Sedan | 2012 | 197.6 | 72.8 | 58.5 | |
| Toyota | Avalon | Sedan | 2013 | 195.3 | 72.2 | 57.5 | |
| Toyota | Avalon | Sedan | 2014 | 195.3 | 72.2 | 57.5 | |
| Toyota | Avalon | Sedan | 2015 | 195.3 | 72.2 | 57.5 | |
| Mazda | Three | Sedan | 2015 | 180.3 | 70.7 | 57.3 | |
| Mazda | Three | Hatch | 2015 | 175.6 | 70.7 | 57.3 | |
| Mazda | Three | Sedan | 2014 | 180.3 | 70.7 | 57.3 | |
| Mazda | Three | Hatch | 2014 | 175.6 | 70.7 | 57.3 | |
| Mazda | Three | Sedan | 2013 | 180.7 | 69.1 | 57.9 | |
| Mazda | Three | Hatch | 2013 | 177.4 | 69.1 | 57.9 | |
| Mazda | Three | Sedan | 2012 | 180.7 | 69.1 | 57.9 | |
| Mazda | Three | Hatch | 2012 | 177.4 | 69.1 | 57.9 | |
| Mazda | Three | Sedan | 2011 | 180.7 | 69.1 | 57.9 | |
| Mazda | Three | Hatch | 2011 | 177.4 | 69.1 | 57.9 | |
| Mazda | Three | Sedan | 2010 | 180.7 | 69.1 | 57.9 | |
| Mazda | Three | Hatch | 2010 | 177.4 | 69.1 | 57.9 | |
| Mazda | Three | Sedan | 2009 | 177.4 | 69.1 | 57.7 | |
| Mazda | Three | Hatch | 2009 | 176.8 | 69.1 | 57.7 | |
| Mazda | Three | Sedan | 2008 | 177.4 | 69.1 | 57.7 | |
| Mazda | Three | Hatch | 2008 | 176.8 | 69.1 | 57.7 | |
| Mazda | Three | Sedan | 2007 | 177.4 | 69.1 | 57.7 | |
| Mazda | Three | Hatch | 2007 | 176.8 | 69.1 | 57.7 | |
| Mazda | Three | Sedan | 2006 | 178.3 | 69.1 | 57.7 | |
| Mazda | Three | Hatch | 2006 | 176.6 | 69.1 | 57.7 | |
| Mazda | Three | Sedan | 2005 | 178.3 | 69.1 | 57.7 | |
| Mazda | Three | Hatch | 2005 | 176.6 | 69.1 | 57.7 | |
| Mazda | Three | Sedan | 2004 | 178.3 | 69.1 | 57.7 | |
| Mazda | Three | Hatch | 2004 | 176.6 | 69.1 | 57.7 |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!DOCTYPE html> | |
| <html lang="en"> | |
| <head> | |
| <meta charset="utf-8"> | |
| <title>Module 2: loading data into the page</title> | |
| <script src="//cdnjs.cloudflare.com/ajax/libs/d3/3.5.6/d3.min.js"></script> | |
| <style type="text/css"> | |
| body, html { | |
| box-sizing: border-box; | |
| width: 100%; | |
| height: 100%; | |
| margin: 0; | |
| padding: 20px; | |
| font-family: sans-serif; | |
| } | |
| </style> | |
| </head> | |
| <body> | |
| <script> | |
| // text binding | |
| var startingData = [7, 2, 5]; | |
| d3.select('body') | |
| .selectAll('p') | |
| .data(startingData) | |
| .enter() | |
| .append('p') | |
| .text(function(d) { return 'hello ' + d;}); | |
| // bullseye! | |
| var circleData = [ | |
| { | |
| radius: 60, | |
| color: 'red' | |
| }, { | |
| radius: 40, | |
| color: 'yellow' | |
| }, { | |
| radius: 20, | |
| color: 'purple' | |
| }]; | |
| var svgContainer = d3.select('body') | |
| .append('svg') | |
| .attr('width', 200) | |
| .attr('height', 200); | |
| var svgBackground = svgContainer.append('rect') | |
| .attr('width', 200) | |
| .attr('height', 200) | |
| .attr('fill', 'none') | |
| .attr('stroke', 'fuchsia') | |
| .attr('stroke-width', '4px'); | |
| var circles = svgContainer.selectAll('circle') | |
| .data(circleData) | |
| .enter() | |
| .append('circle'); | |
| circles.attr('cx', 50) | |
| .attr('cy', 50) | |
| .attr('r', function(d) { return d.radius; }) | |
| .style('fill', function(d) { return d.color; }); | |
| // offset circles | |
| var svg2 = d3.select('body') | |
| .append('svg') | |
| .attr('width', 200) | |
| .attr('height', 200); | |
| var svgBackground2 = svg2.append('rect') | |
| .attr('width', 200) | |
| .attr('height', 200) | |
| .attr('fill', 'none') | |
| .attr('stroke', 'lime') | |
| .attr('stroke-width', '4px'); | |
| var circleData2 = [ | |
| { | |
| offset: 30, | |
| color: 'green' | |
| }, { | |
| offset: 80, | |
| color: 'blue' | |
| }, { | |
| offset: 120, | |
| color: 'gray' | |
| }]; | |
| var circles2 = svg2.selectAll('circle') | |
| .data(circleData2) | |
| .enter() | |
| .append('circle'); | |
| circles2.attr('cx', function(d) { return d.offset; }) | |
| .attr('cy', function(d) { return d.offset; }) | |
| .attr('r', 30) | |
| .style('fill', function(d) { return d.color; }); | |
| d3.csv('carspecs.csv', function(data) { | |
| console.debug(data); | |
| }); | |
| </script> | |
| </body> | |
| </html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment