Last active
September 28, 2018 13:55
-
-
Save smwhr/d3bcc5bfc5aa194d8b53a4953962eaee to your computer and use it in GitHub Desktop.
Algo 3 Family Treee
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>Arbre</title> | |
| </head> | |
| <script src="https://cdnjs.cloudflare.com/ajax/libs/d3/5.7.0/d3.min.js"></script> | |
| <body> | |
| <div id="graph"> | |
| </div> | |
| <script> | |
| var svgContainer = d3.select("#graph") | |
| .append("svg") | |
| .attr("width", 450) | |
| .attr("height", 490); | |
| function Point(x,y){ | |
| this.x = x; | |
| this.y = y; | |
| } | |
| function Circle(p, label){ | |
| var self = this; | |
| self.p = p; | |
| self.label = label; | |
| self.draw = function(){ | |
| svgContainer.append("circle") | |
| .attr("cx", self.p.x) | |
| .attr("cy", self.p.y) | |
| .attr("r", 25) | |
| .style("fill", "white") | |
| .style("stroke", "#ff9900") | |
| .style("stroke-width", 3); | |
| svgContainer.append("text") | |
| .attr("x", self.p.x) | |
| .attr("y", self.p.y+5) | |
| .attr("text-anchor", "middle") | |
| .attr("font-family", "Comic Sans MS") | |
| .text(self.label); | |
| } | |
| self.lineToCircle = function(target){ | |
| console.log(target) | |
| svgContainer.append("line") | |
| .attr("x1", self.p.x) | |
| .attr("y1", self.p.y+25) | |
| .attr("x2", target.p.x) | |
| .attr("y2", target.p.y-25) | |
| .style("stroke", "#993366") | |
| .style("stroke-width", 3) | |
| } | |
| } | |
| var zamor = { | |
| "Am" : {"circle" : new Circle(new Point(200, 30), "Am"), "children" : ["R", "Ja"] }, | |
| "R" : {"circle" : new Circle(new Point(140, 135), "R"), "children" : [] }, | |
| "Ja" : {"circle" : new Circle(new Point(260, 135), "Ja"), "children" : ["O", "P"] }, | |
| "O" : {"circle" : new Circle(new Point(170, 255), "O"), "children" : ["An", "Ch", "Lu"] }, | |
| "P" : {"circle" : new Circle(new Point(320, 255), "P"), "children" : ["Ju", "Ca"] }, | |
| "An" : {"circle" : new Circle(new Point(110, 355), "An"), "children" : [] }, | |
| "Ch" : {"circle" : new Circle(new Point(170, 355), "Ch"), "children" : [] }, | |
| "Lu" : {"circle" : new Circle(new Point(230, 355), "Lu"), "children" : [] }, | |
| "Ju" : {"circle" : new Circle(new Point(290, 355), "Ju"), "children" : ["Ba"] }, | |
| "Ca" : {"circle" : new Circle(new Point(350, 355), "Ca"), "children" : ["CH", "Au"] }, | |
| "Ba" : {"circle" : new Circle(new Point(290, 455), "Ba"), "children" : [] }, | |
| "CH" : {"circle" : new Circle(new Point(350, 455), "CH"), "children" : [] }, | |
| "Au" : {"circle" : new Circle(new Point(410, 455), "Au"), "children" : [] }, | |
| } | |
| for(var m in zamor){ | |
| var person = zamor[m]; | |
| person.circle.draw() | |
| for(ch in person.children){ | |
| var child = person.children[ch]; | |
| person.circle.lineToCircle(zamor[child].circle); | |
| } | |
| } | |
| </script> | |
| </body> | |
| </html> |
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
| var matriarch = {"name":"Amélie", "age": 104, "sex": "f", "parent":null} | |
| var tree = [ | |
| {"name":"Jack", "age": 86, "sex": "m", "parent":"Amélie"}, | |
| {"name":"Roseline", "age": 79, "sex": "f", "parent":"Amélie"}, | |
| {"name":"Olivier", "age": 59, "sex": "m", "parent":"Jack"}, | |
| {"name":"Pascal", "age": 59, "sex": "m", "parent":"Jack"}, | |
| {"name":"Angélique", "age": 18, "sex": "f", "parent":"Olivier"}, | |
| {"name":"Charlotte", "age": 22, "sex": "f", "parent":"Olivier"}, | |
| {"name":"Lucien", "age": 5, "sex": "m", "parent":"Olivier"}, | |
| {"name":"Julien", "age": 33, "sex": "f", "parent":"Pascal"}, | |
| {"name":"Caroline", "age": 30, "sex": "f", "parent":"Pascal"}, | |
| ]; | |
| function Person(data){ | |
| this.name = data.name; | |
| this.age = data.age; | |
| this.sex = data.sex; | |
| this.parent = null; | |
| this.children = []; | |
| } | |
| function Tree(rootData){ | |
| this._root = new Person(rootData); | |
| Tree.prototype.traverse = function(callback){ | |
| (function recursive(currentNode){ | |
| for(var i = 0; i < currentNode.children.length; i++){ | |
| recursive(currentNode.children[i]); | |
| } | |
| callback(currentNode); | |
| })(this._root) | |
| } | |
| Tree.prototype.add = function(data){ | |
| var child = new Person(data), | |
| parentName = data.parent, | |
| parent = null; | |
| this.traverse(function(person){ | |
| if(person.name === parentName){ | |
| parent = person; | |
| } | |
| }) | |
| parent.children.push(child); | |
| child.parent = parent; | |
| } | |
| } | |
| var zamor = new Tree(matriarch); | |
| for(p in tree){ | |
| var person = tree[p]; | |
| zamor.add(person); | |
| } | |
| zamor.traverse(function(person){ | |
| console.log(person.name, person.age) | |
| }) | |
| function find_younger(family){ | |
| var younger = zamor._root; | |
| zamor.traverse(function(person){ | |
| if(person.age < younger.age){ | |
| younger = person; | |
| } | |
| }); | |
| return younger; | |
| } | |
| var younger = find_younger(zamor) | |
| console.log("Younger :", younger.name, younger.age); | |
| function count(family, predicate){ | |
| var counter = 0; | |
| family.traverse(function(person){ | |
| counter += predicate(person); | |
| }); | |
| return counter; | |
| } | |
| function count_women(family){ | |
| return count(family, function(personne){ | |
| return personne.sex == "f" ? 1 : 0; | |
| }) | |
| } | |
| console.log("Nb femmes :", count_women(zamor)); | |
| function count_most_child(family){ | |
| var mostChild = {} | |
| var mostChildNumber = 0 | |
| family.traverse(function(person){ | |
| if(person.children.length > mostChildNumber){ | |
| mostChildNumber = person.children.length; | |
| mostChild = person; | |
| } | |
| }) | |
| return mostChild | |
| } | |
| var mostChild = count_most_child(zamor) | |
| console.log("Le plus d'enfants :", mostChild.name); | |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment