From c4fd80d6cf5edc22f9e1deae0f4b3b3a17b5e5ef Mon Sep 17 00:00:00 2001 From: Umesh Nair Date: Thu, 17 Jan 2019 21:22:16 -0500 Subject: [PATCH 01/12] final commit --- index.html | 119 +++++++++++++++++++++++++++++++++++++++++++++++++---- 1 file changed, 111 insertions(+), 8 deletions(-) diff --git a/index.html b/index.html index 29f315c..082f565 100755 --- a/index.html +++ b/index.html @@ -1,10 +1,113 @@ - + + + + + + CS 573 Assignment 1 - X and O + + + + + From 6a4c9da186ba07dfb75efed65231825ef22f6689 Mon Sep 17 00:00:00 2001 From: Umesh Nair Date: Thu, 17 Jan 2019 22:18:25 -0500 Subject: [PATCH 02/12] Readme updated --- README.md | 85 +++++++------------------------------------------ XandO_snap.png | Bin 0 -> 14373 bytes 2 files changed, 12 insertions(+), 73 deletions(-) create mode 100644 XandO_snap.png diff --git a/README.md b/README.md index 228c569..4e4f6d3 100755 --- a/README.md +++ b/README.md @@ -1,78 +1,17 @@ -Assignment 1 - Hello World: GitHub and d3 -=== +Description:- +X and O is a simple, fun and popular game, and my original intention was to simulate an instance of this game. But unfortunately, since I am new to d3, my understanding of using transitions and other dynamic components was inaccurate, and hence I was not able to use them as I had intended to. In the end, I had to content myself with just showing the final result and snapshot of the game, which is shown below: - -This is a starting project to make sure you can write and host a webpage that generates graphics using d3. -The primary goal is to be able to generate graphics primitives (circles, rectangles, lines, polygons) at different locations on the screen with different colors. -The secondary goal is to introduce you to coding on GitHub, including creating a gh-pages branch to host your visualizations. +gh-pages site link: - +![alt text](https://raw.githubusercontent.com/UmeshNair/01-ghd3/XandO_snap.png) -You may write everything from scratch, or start with demo programs from books or the web. -If you do start with code that you found, you **must identify** the source of the code in your README and, most importantly, make non-trivial changes to the code to make it your own so you really learn what you're doing. - -For example, you could download one of the d3.js examples, read it through so you understand what it's doing, and then change the appearance of the graphical output to use different color schemes, different primitive shapes, different layouts of the primitives, and so on. - -Resources ---- - -If you need a JavaScript/HTML/CSS refresher, see [Technology Fundamentals by Scott Murray](http://chimera.labs.oreilly.com/books/1230000000345/ch03.html#_html) and/or [JavaScript Codeacademy](https://www.codecademy.com/en/tracks/javascript). - -If you need a Git/GitHub refreseher, see [GitHub Bootcamp](https://help.github.com/categories/bootcamp/), the [GitHub Guides](https://guides.github.com/) (especially the ones on Hello World, and Understanding the GitHub Flow, and Forking Projects), and [CodeSchool's Try Git Course](https://www.codeschool.com/courses/try-git). - -Requirements ---- - -1. Your project should contain at least four kinds of graphics primitives (circles, rectangles, lines, polygons) in different colors. -2. Your document should identify the source of the code if you start with code that you found. -3. Your code should be forked from the GitHub repo and linked using GitHub pages. See the "GitHub Details" section below for detailed instructions on how to do this. - -GitHub Details ---- - -- Fork the GitHub Repository for Assignment 1. You now have a copy associated with your username. -- Make changes to index.html to fulfill the project requirements. -- Make sure your "master" branch matches your "gh-pages" branch. See the GitHub Guides referenced above if you need help. -- Edit the README.md with a link to your gh-pages site "http://YourUsernameGoesHere.github.io/01-ghd3/index.html". -- To submit, make a [Pull Request](https://help.github.com/articles/using-pull-requests/) on the original repository. - -Vis Details ---- - -For this project you should use d3.js. -You can learn from examples on the [d3.js](http://d3js.org) site or start from scratch. - -See the [Using d3js](https://github.com/mbostock/d3/wiki#using) documentation for how to run your own local server. - -Creative solutions are welcome! In the past I've seen recreations of paintings, interactives, and more. - -Go beyond the minimum requirements of this project. -Experiment with other aspects of the [d3 API](https://github.com/mbostock/d3/wiki/API-Reference) and [d3 Tutorials](https://github.com/mbostock/d3/wiki/Tutorials). -Try making the elements interactive, for example, or animate them. - -Grading ---- - -Grades are on a 120 point scale. -96 points will be graded for functionality: the program does what the assignment requests with an informative README. - -We will use Google Chrome to view submissions. -Be sure to test your code there. - -Below are some, but not necessarily all, of the key points we will consider during grading: - -- Circles and Rectangles -- Lines -- Polygons -- Different colors -- README Quality - - A description of what you have created. 1-2 screenshots are recommended for the README. - - A working link to the hosted files (usually the gh-pages 'live' url) - - Section for Technical and Design Achievements - -Technical Achievement Desription -- 12 -Design Achievement Description -- 12 - -Remember, it is up to *you* to define what constitutes a technical and design achievements. -Be ambitious as these are designed to allow you to shape your learning. -These are the only way to move from B to A territory. +Technical Achievements: - +1. Gained a good understanding of what are svg's and how to work with them. +2. Successfully drew different shapes like circles, rectangles with distinct dimensions and color fills. +3. Improved upon my initial understanding of using transitions and making visualizations dynamic. +Design Achievements: - +1. Layout and placement of shapes and objects on the screen to generate an effective visualization. +2. Gained an understanding of colors and its combinations. +3. Gained an understanding of the use of different shapes and their size variations to clearly differentiate the objects. diff --git a/XandO_snap.png b/XandO_snap.png new file mode 100644 index 0000000000000000000000000000000000000000..cb167a6454e4131fc56725370b0b45b33db10b53 GIT binary patch literal 14373 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 j{}m(6ip?eJPByFXrpp|=2f Date: Thu, 17 Jan 2019 22:20:49 -0500 Subject: [PATCH 03/12] Update README.md --- README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/README.md b/README.md index 4e4f6d3..c070d6a 100755 --- a/README.md +++ b/README.md @@ -4,7 +4,7 @@ X and O is a simple, fun and popular game, and my original intention was to simu gh-pages site link: - -![alt text](https://raw.githubusercontent.com/UmeshNair/01-ghd3/XandO_snap.png) +![alt text](1-ghd3/XandO_snap.png) Technical Achievements: - 1. Gained a good understanding of what are svg's and how to work with them. From b3377034ada76536e5df0811fe4ac8354aba42b7 Mon Sep 17 00:00:00 2001 From: Umesh Nair Date: Thu, 17 Jan 2019 22:22:03 -0500 Subject: [PATCH 04/12] Update README.md --- README.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/README.md b/README.md index c070d6a..0754e56 100755 --- a/README.md +++ b/README.md @@ -1,10 +1,10 @@ Description:- X and O is a simple, fun and popular game, and my original intention was to simulate an instance of this game. But unfortunately, since I am new to d3, my understanding of using transitions and other dynamic components was inaccurate, and hence I was not able to use them as I had intended to. In the end, I had to content myself with just showing the final result and snapshot of the game, which is shown below: - - +![alt text](1-ghd3/XandO_snap.png) gh-pages site link: - -![alt text](1-ghd3/XandO_snap.png) +https://umeshnair.github.io/01-ghd3/index.html Technical Achievements: - 1. Gained a good understanding of what are svg's and how to work with them. From 3150fa5c42376937c7d269cd8eceaafee3f9bcb3 Mon Sep 17 00:00:00 2001 From: Umesh Nair Date: Thu, 17 Jan 2019 22:22:51 -0500 Subject: [PATCH 05/12] Update README.md --- README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/README.md b/README.md index 0754e56..e5b66d4 100755 --- a/README.md +++ b/README.md @@ -1,7 +1,7 @@ Description:- X and O is a simple, fun and popular game, and my original intention was to simulate an instance of this game. But unfortunately, since I am new to d3, my understanding of using transitions and other dynamic components was inaccurate, and hence I was not able to use them as I had intended to. In the end, I had to content myself with just showing the final result and snapshot of the game, which is shown below: - -![alt text](1-ghd3/XandO_snap.png) +https://github.com/UmeshNair/01-ghd3/blob/master/XandO_snap.png gh-pages site link: - https://umeshnair.github.io/01-ghd3/index.html From 8644855c240ee664b4b974ecece941e8dcf43672 Mon Sep 17 00:00:00 2001 From: Umesh Nair Date: Thu, 17 Jan 2019 22:23:42 -0500 Subject: [PATCH 06/12] Update README.md --- README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/README.md b/README.md index e5b66d4..be018d0 100755 --- a/README.md +++ b/README.md @@ -1,7 +1,7 @@ Description:- X and O is a simple, fun and popular game, and my original intention was to simulate an instance of this game. But unfortunately, since I am new to d3, my understanding of using transitions and other dynamic components was inaccurate, and hence I was not able to use them as I had intended to. In the end, I had to content myself with just showing the final result and snapshot of the game, which is shown below: - -https://github.com/UmeshNair/01-ghd3/blob/master/XandO_snap.png +![Alt text](https://raw.githubusercontent.com/UmeshNair/01-ghd3/XandO_snap.png) gh-pages site link: - https://umeshnair.github.io/01-ghd3/index.html From 28d22cbbe09d6ee4e44c8702131ec96bed25abd0 Mon Sep 17 00:00:00 2001 From: Umesh Nair Date: Thu, 17 Jan 2019 22:28:34 -0500 Subject: [PATCH 07/12] Update README.md --- README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/README.md b/README.md index be018d0..a47f987 100755 --- a/README.md +++ b/README.md @@ -1,7 +1,7 @@ Description:- X and O is a simple, fun and popular game, and my original intention was to simulate an instance of this game. But unfortunately, since I am new to d3, my understanding of using transitions and other dynamic components was inaccurate, and hence I was not able to use them as I had intended to. In the end, I had to content myself with just showing the final result and snapshot of the game, which is shown below: - -![Alt text](https://raw.githubusercontent.com/UmeshNair/01-ghd3/XandO_snap.png) +[[https://raw.githubusercontent.com/UmeshNair/01-ghd3/master/XandO_snap.png|alt=XandO_snap]] gh-pages site link: - https://umeshnair.github.io/01-ghd3/index.html From 6e6ae06c29fb4edb4df85adee879aace79d8f674 Mon Sep 17 00:00:00 2001 From: Umesh Nair Date: Thu, 17 Jan 2019 22:29:26 -0500 Subject: [PATCH 08/12] Update README.md --- README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/README.md b/README.md index a47f987..6e55aee 100755 --- a/README.md +++ b/README.md @@ -1,7 +1,7 @@ Description:- X and O is a simple, fun and popular game, and my original intention was to simulate an instance of this game. But unfortunately, since I am new to d3, my understanding of using transitions and other dynamic components was inaccurate, and hence I was not able to use them as I had intended to. In the end, I had to content myself with just showing the final result and snapshot of the game, which is shown below: - -[[https://raw.githubusercontent.com/UmeshNair/01-ghd3/master/XandO_snap.png|alt=XandO_snap]] +[https://raw.githubusercontent.com/UmeshNair/01-ghd3/master/XandO_snap.png] gh-pages site link: - https://umeshnair.github.io/01-ghd3/index.html From 4411031e009c5a56ffed96d24dcdcfa95f5bceef Mon Sep 17 00:00:00 2001 From: Umesh Nair Date: Thu, 17 Jan 2019 22:32:56 -0500 Subject: [PATCH 09/12] Update README.md --- README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/README.md b/README.md index 6e55aee..28f68fb 100755 --- a/README.md +++ b/README.md @@ -1,7 +1,7 @@ Description:- X and O is a simple, fun and popular game, and my original intention was to simulate an instance of this game. But unfortunately, since I am new to d3, my understanding of using transitions and other dynamic components was inaccurate, and hence I was not able to use them as I had intended to. In the end, I had to content myself with just showing the final result and snapshot of the game, which is shown below: - -[https://raw.githubusercontent.com/UmeshNair/01-ghd3/master/XandO_snap.png] +![X and O_snapshot](XandO_snap.png) gh-pages site link: - https://umeshnair.github.io/01-ghd3/index.html From 3b9f5f4db383db892e378266ec97304300693a79 Mon Sep 17 00:00:00 2001 From: Umesh Nair Date: Thu, 17 Jan 2019 22:33:45 -0500 Subject: [PATCH 10/12] Update README.md --- README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/README.md b/README.md index 28f68fb..690493d 100755 --- a/README.md +++ b/README.md @@ -1,4 +1,4 @@ -Description:- +Description:- X and O is a simple, fun and popular game, and my original intention was to simulate an instance of this game. But unfortunately, since I am new to d3, my understanding of using transitions and other dynamic components was inaccurate, and hence I was not able to use them as I had intended to. In the end, I had to content myself with just showing the final result and snapshot of the game, which is shown below: - ![X and O_snapshot](XandO_snap.png) From 45c4278212c3a27fce0dfd514649bda3c7946ee8 Mon Sep 17 00:00:00 2001 From: Umesh Nair Date: Thu, 17 Jan 2019 22:36:30 -0500 Subject: [PATCH 11/12] Update README.md --- README.md | 7 +++++++ 1 file changed, 7 insertions(+) diff --git a/README.md b/README.md index 690493d..5386e9c 100755 --- a/README.md +++ b/README.md @@ -1,17 +1,24 @@ +Assignment 1 - Hello World: GitHub and d3 +=== + Description:- +--- X and O is a simple, fun and popular game, and my original intention was to simulate an instance of this game. But unfortunately, since I am new to d3, my understanding of using transitions and other dynamic components was inaccurate, and hence I was not able to use them as I had intended to. In the end, I had to content myself with just showing the final result and snapshot of the game, which is shown below: - ![X and O_snapshot](XandO_snap.png) gh-pages site link: - +--- https://umeshnair.github.io/01-ghd3/index.html Technical Achievements: - +--- 1. Gained a good understanding of what are svg's and how to work with them. 2. Successfully drew different shapes like circles, rectangles with distinct dimensions and color fills. 3. Improved upon my initial understanding of using transitions and making visualizations dynamic. Design Achievements: - +--- 1. Layout and placement of shapes and objects on the screen to generate an effective visualization. 2. Gained an understanding of colors and its combinations. 3. Gained an understanding of the use of different shapes and their size variations to clearly differentiate the objects. From c4ac2fb49500279996c80f4b319e688bafe3a381 Mon Sep 17 00:00:00 2001 From: Umesh Nair Date: Thu, 17 Jan 2019 22:39:40 -0500 Subject: [PATCH 12/12] Update README.md --- README.md | 3 +++ 1 file changed, 3 insertions(+) diff --git a/README.md b/README.md index 5386e9c..7dc41b5 100755 --- a/README.md +++ b/README.md @@ -22,3 +22,6 @@ Design Achievements: - 1. Layout and placement of shapes and objects on the screen to generate an effective visualization. 2. Gained an understanding of colors and its combinations. 3. Gained an understanding of the use of different shapes and their size variations to clearly differentiate the objects. + +References: +https://stackoverflow.com/questions/13204562/proper-format-for-drawing-polygon-data-in-d3