diff --git a/Lab.md b/Lab.md new file mode 100644 index 0000000..0e18271 --- /dev/null +++ b/Lab.md @@ -0,0 +1,146 @@ +Create a bar graph using the following data: + +```javascript +[ + { + "name": "HTML", + "count": 21 + }, + { + "name": "CSS", + "count": 17 + }, + { + "name": "Responsive Web Design", + "count": 17 + }, + { + "name": "JavaScript", + "count": 17 + }, + { + "name": "Git", + "count": 16 + }, + { + "name": "Angular.js", + "count": 9 + }, + { + "name": "Node.js", + "count": 9 + }, + { + "name": "PostgreSQL", + "count": 8 + }, + { + "name": "Agile Project Management", + "count": 8 + }, + { + "name": "MongoDB", + "count": 7 + }, + { + "name": "Trello", + "count": 7 + }, + { + "name": "Testing / TDD", + "count": 7 + }, + { + "name": "jQuery", + "count": 7 + }, + { + "name": "User Testing", + "count": 6 + }, + { + "name": "MySQL", + "count": 6 + }, + { + "name": "PHP", + "count": 6 + }, + { + "name": "React.js", + "count": 6 + }, + { + "name": "AJAX", + "count": 6 + }, + { + "name": "Express.js", + "count": 5 + }, + { + "name": "Heroku", + "count": 5 + }, + { + "name": "Wireframing", + "count": 5 + }, + { + "name": "Sass/SCSS", + "count": 5 + }, + { + "name": "Mobile Web", + "count": 4 + }, + { + "name": "Rails", + "count": 4 + }, + { + "name": "WordPress", + "count": 4 + }, + { + "name": "Drupal", + "count": 3 + }, + { + "name": "Ruby", + "count": 3 + }, + { + "name": "Ember.js", + "count": 3 + }, + { + "name": "Python", + "count": 3 + }, + { + "name": "Amazon EC2", + "count": 2 + }, + { + "name": "Computer Science degree", + "count": 1 + }, + { + "name": "Backbone.js", + "count": 1 + }, + { + "name": "Less", + "count": 1 + }, + { + "name": "Prototyping", + "count": 1 + }, + { + "name": "Redis", + "count": 1 + } +] +```` diff --git a/README.md b/README.md index c26f1e1..8833aca 100644 --- a/README.md +++ b/README.md @@ -5,3 +5,4 @@ 1. [SVG](/SVG.md) 1. [D3](/D3.md) 1. [BUILD](/BUILD.md) +1. [Lab](/Lab.md) diff --git a/SUMMARY.md b/SUMMARY.md index 792df12..faf78c5 100644 --- a/SUMMARY.md +++ b/SUMMARY.md @@ -3,3 +3,4 @@ * [SVG](/SVG.md) * [D3](/D3.md) * [BUILD](/BUILD.md) +* [Lab](/Lab.md) diff --git a/SVG.md b/SVG.md index b021000..481f8de 100644 --- a/SVG.md +++ b/SVG.md @@ -114,7 +114,8 @@ A series of connected lines. Can have a fill like a polygon, but won't automati ## Path -https://developer.mozilla.org/en-US/docs/Web/SVG/Tutorial/Paths +- [Docs](https://developer.mozilla.org/en-US/docs/Web/SVG/Tutorial/Paths) +- [Bezier curves](http://blogs.sitepointstatic.com/examples/tech/svg-curves/cubic-curve.html) - attributes - `d` a set of drawing commands @@ -128,13 +129,14 @@ https://developer.mozilla.org/en-US/docs/Web/SVG/Tutorial/Paths - S = smooth curveto - S x2 y2, x y - follows another S or C command - - uses x2 y2 of previous S or C command + - uses reflection of x2 y2 of previous S or C command for x1 y1 - Q = quadratic Bézier curve - Q x1 y1, x y - uses one control point for start and end controls (x1, y1) - T = smooth quadratic Bézier curveto - T x y - strings together multiple quadratic lines + - uses reflection of previous quadratic curve's control point as its control point - Z = closepath - **Note:** All of the commands above can also be expressed with lower letters. Capital letters means absolutely positioned, lower cases means relatively positioned.