Charts

commit 33714c62914023f98f4954929003cd670414382c Author: bbod Date: Mon Sep 16 20:36:30 2019 -0600 hw2 Meh diff --git a/hw1/Hw1.html b/hw1/Hw1.html new file mode 100644 index 0000000..84e756c --- /dev/null +++ b/hw1/Hw1.html @@ -0,0 +1,113 @@ + + + + + + + Charts + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/hw2/.idea/hw2.iml b/hw2/.idea/hw2.iml new file mode 100644 index 0000000..ede27d1 --- /dev/null +++ b/hw2/.idea/hw2.iml @@ -0,0 +1,13 @@ + + + + + + + + + + + + + \ No newline at end of file diff --git a/hw2/.idea/jsLibraryMappings.xml b/hw2/.idea/jsLibraryMappings.xml new file mode 100644 index 0000000..203dc5b --- /dev/null +++ b/hw2/.idea/jsLibraryMappings.xml @@ -0,0 +1,6 @@ + + + + + + \ No newline at end of file diff --git a/hw2/.idea/misc.xml b/hw2/.idea/misc.xml new file mode 100644 index 0000000..28a804d --- /dev/null +++ b/hw2/.idea/misc.xml @@ -0,0 +1,6 @@ + + + + + \ No newline at end of file diff --git a/hw2/.idea/modules.xml b/hw2/.idea/modules.xml new file mode 100644 index 0000000..b3c4100 --- /dev/null +++ b/hw2/.idea/modules.xml @@ -0,0 +1,8 @@ + + + + + + + + \ No newline at end of file diff --git a/hw2/.idea/vcs.xml b/hw2/.idea/vcs.xml new file mode 100644 index 0000000..6c0b863 --- /dev/null +++ b/hw2/.idea/vcs.xml @@ -0,0 +1,6 @@ + + + + + + \ No newline at end of file diff --git a/hw2/.idea/workspace.xml b/hw2/.idea/workspace.xml new file mode 100644 index 0000000..a19e4f5 --- /dev/null +++ b/hw2/.idea/workspace.xml @@ -0,0 +1,325 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + true + DEFINITION_ORDER + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + 1568584050957 + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/hw2/data/Tree.json b/hw2/data/Tree.json new file mode 100644 index 0000000..96f44bd --- /dev/null +++ b/hw2/data/Tree.json @@ -0,0 +1,56 @@ +[{ +"name":"Animal", +"parent":"root" +}, +{ +"name":"Reptile", +"parent":"Animal" +}, +{ +"name":"Mammal", +"parent":"Animal" +}, +{ +"name":"Lizard", +"parent":"Reptile" +}, +{ +"name":"Snake", +"parent":"Reptile" +}, +{ +"name":"Bird", +"parent":"Reptile" +}, +{ +"name":"Canary", +"parent":"Bird" +}, +{ +"name":"Equine", +"parent":"Mammal" +}, +{ +"name":"Bovine", +"parent":"Mammal" +}, +{ +"name":"Canine", +"parent":"Mammal" +}, +{ +"name":"Cow", +"parent":"Bovine" +}, +{ +"name":"Horse", +"parent":"Equine" +}, +{ +"name":"Zebra", +"parent":"Equine" +}, +{ +"name":"Dog", +"parent":"Canine" +}] \ No newline at end of file diff --git a/hw2/hw2.html b/hw2/hw2.html new file mode 100644 index 0000000..ec3dfa0 --- /dev/null +++ b/hw2/hw2.html @@ -0,0 +1,34 @@ + + + + + + Homework 2 + + + + + + + + + + + \ No newline at end of file diff --git a/hw2/js/Node.js b/hw2/js/Node.js new file mode 100644 index 0000000..bb19895 --- /dev/null +++ b/hw2/js/Node.js @@ -0,0 +1,48 @@ +/** Class representing a Node in a tree. */ +class Node { + /** + * Creates a Node and intializes the following fields to null/empty: + * parentNode, children, parentName,level,position + * @param {string} nodeName - The name of the node. + * @param {string} parentName - The name of the parent node. + */ + constructor(nodeName,parentName) { + + //String of Node Name + this.name = nodeName; + + //String of Parent Name + this.parentName = parentName; + + /** + * Reference to parent Node Object. + */ + this.parentNode = null; + + /** + * Array of Children. + */ + this.children=[]; + + /** + * Level of the node. + */ + this.level=null; + + /** + * Position of the node. + * Initialize to -1 + */ + this.position=-1; + } + + /** + * Add child to current Node. + * @param {Node} The child Node. + */ + addChild(childNode) { + this.children.push(childNode); + } + + +} \ No newline at end of file diff --git a/hw2/js/Tree.js b/hw2/js/Tree.js new file mode 100644 index 0000000..0555e71 --- /dev/null +++ b/hw2/js/Tree.js @@ -0,0 +1,108 @@ +/** Class representing a Tree. */ +class Tree { + /** + * Creates a Tree Object + * parentNode, children, parentName,level,position + * @param {json[]} json - array of json object with name and parent fields + */ + constructor(json) { + this.listOfNodes = []; + json.forEach(nodeInfo => { + let node = new Node(nodeInfo.name, nodeInfo.parent); + //console.log(node); + this.listOfNodes.push(node); + }); + } + + /** + * Function that builds a tree from a list of nodes with parent refs + */ + buildTree(){ + let rootNode = this.listOfNodes.find(node => node.parentName === "root"); + this.listOfNodes.forEach(currentNode => { + for(let i = 0; i < this.listOfNodes.length; i ++){ + if(this.listOfNodes[i].parentName === currentNode.name){ + currentNode.addChild(this.listOfNodes[i]); + } + } + }); + //console.log(rootNode); + + this.assignLevel(rootNode, 0); + this.assignPosition(rootNode, 0); + + + + } + + /** + * Recursive function that assign positions to each node + */ + assignPosition(node, position) { + node.position = position; + let currentlevel = node.level; + let q = []; + node.children.forEach(x=>{ + q.push(x) + }); + let count = 0; + while(q.length > 0){ + let current = q.shift(); + if(currentlevel === current.level){ + current.position = count; + count +=1; + current.children.forEach(x=> q.push(x)); + console.log(q); + } + + else{ + currentlevel = current.level; + current.children.forEach(x=> q.push(x)); + count = current.position+1; + + } + } + + } + + /** + * Recursive function that assign levels to each node + */ + assignLevel(node, level) { + node.level = level; + node.children.forEach(childNode => { + this.assignLevel(childNode, level+1); + }) + } + + /** + * Function that renders the tree + */ + renderTree() { + d3.select("body") + .append("svg") + .attr("width", 1200) + .attr("height", 1200); + this.listOfNodes.forEach(node => { + let svgElement = d3.select("svg"); + for (var i = 0; i < node.children.length; i++) { + svgElement.append("line") + .attr("x1", (node.level + 3) * 100) + .attr("y1", (node.position + 3) * 100) + .attr("x2", (node.children[i].level +3) * 100) + .attr("y2", (node.children[i].position+3) * 100) + } + svgElement.append("circle") + .attr("r", 35) + + .attr("cx", (node.level+3) * 100) + .attr("cy", (node.position+3) * 100) + svgElement.append("text") + .attr("class", "label") + .attr("dx", (node.level+3) * 100) + .attr("dy", (node.position+3) * 100) + .text(node.name) + }) + + } +} \ No newline at end of file diff --git a/hw2/js/script.js b/hw2/js/script.js new file mode 100644 index 0000000..e52274b --- /dev/null +++ b/hw2/js/script.js @@ -0,0 +1,26 @@ +/** +* Requests the file and executes a callback with the parsed result once +* it is available +* @param {path} file path +* @param {callback} callback to execute once the result is available +*/ +function fetchJSONFile(path, callback) { + var httpRequest = new XMLHttpRequest(); + httpRequest.onreadystatechange = function() { + if (httpRequest.readyState === 4) { + if (httpRequest.status === 200) { + let data = JSON.parse(httpRequest.responseText); + if (callback) callback(data); + } + } + }; + httpRequest.open('GET', path); + httpRequest.send(); +} + +//call fetchJSONFile then build and render a tree +fetchJSONFile('data/Tree.json', function(data) { + let tree = new Tree(data); + tree.buildTree(); + tree.renderTree(); +}); \ No newline at end of file