javascript - Code not working. Stuck in D3 circle pack -
i beginner @ d3. trying implement circle pack following json:
{ "terms": [ { "term": { "term": "activism", "frequency": "14", "parent": "" } }, { "term": { "term": "education", "frequency": "14", "parent": "" } }, { "term": { "term": "media", "frequency": "2", "parent": "" } }, { "term": { "term": "medicine", "frequency": "15", "parent": "" } }, { "term": { "term": "military", "frequency": "4", "parent": "" } }, { "term": { "term": "politics", "frequency": "26", "parent": "" } }, { "term": { "term": "religion", "frequency": "2", "parent": "" } }, { "term": { "term": "science", "frequency": "8", "parent": "" } }, { "term": { "term": "anti-nuclear", "frequency": "45", "parent": "activism" } }, { "term": { "term": "civil defense", "frequency": "1", "parent": "activism" } }, { "term": { "term": "bomb shelters", "frequency": "3", "parent": "activism" } }, { "term": { "term": "fallout", "frequency": "0", "parent": "activism" } }, { "term": { "term": "american civil liberties union (aclu)", "frequency": "1", "parent": "activism" } }, { "term": { "term": "house un-american activities committee", "frequency": "3", "parent": "activism" } }, { "term": { "term": "demonstrations", "frequency": "1", "parent": "activism" } }, { "term": { "term": "fallout", "frequency": "5", "parent": "activism" } }, { "term": { "term": "nuclear reactors", "frequency": "2", "parent": "activism" } }, { "term": { "term": "peace", "frequency": "10", "parent": "activism" } }, { "term": { "term": "petitions", "frequency": "9", "parent": "activism" } }, { "term": { "term": "radiation", "frequency": "8", "parent": "activism" } }, { "term": { "term": "war", "frequency": "3", "parent": "activism" } }, { "term": { "term": "hoax", "frequency": "1", "parent": "activism" } }, { "term": { "term": "strontium-90", "frequency": "1", "parent": "activism" } }, { "term": { "term": "hiroshima", "frequency": "1", "parent": "activism" } }, { "term": { "term": "bomb testing", "frequency": "1", "parent": "activism" } }, { "term": { "term": "thermonuclear war", "frequency": "1", "parent": "activism" } }, { "term": { "term": "bertrand russell", "frequency": "1", "parent": "activism" } }, { "term": { "term": "children", "frequency": "3", "parent": "activism" } }, { "term": { "term": "civil defense", "frequency": "3", "parent": "activism" } }, { "term": { "term": "unesco", "frequency": "1", "parent": "activism" } }, { "term": { "term": "nobel prize", "frequency": "1", "parent": "activism" } }, { "term": { "term": "peace activities", "frequency": "2", "parent": "activism" } }, { "term": { "term": "nuclear disarmament", "frequency": "14", "parent": "activism" } }, { "term": { "term": "world youth forum", "frequency": "1", "parent": "activism" } }, { "term": { "term": "edward teller", "frequency": "2", "parent": "activism" } }, { "term": { "term": "nuclear war", "frequency": "0", "parent": "activism" } }, { "term": { "term": "exposure", "frequency": "0", "parent": "activism" } }, { "term": { "term": "farming", "frequency": "1", "parent": "activism" } }, { "term": { "term": "radiation", "frequency": "2", "parent": "activism" } }, { "term": { "term": "protest", "frequency": "2", "parent": "activism" } }, { "term": { "term": "sane", "frequency": "2", "parent": "activism" } }, { "term": { "term": "college admissions", "frequency": "2", "parent": "education" } }, { "term": { "term": "dental school", "frequency": "1", "parent": "education" } }, { "term": { "term": "curriculum", "frequency": "1", "parent": "education" } }, { "term": { "term": "high school", "frequency": "0", "parent": "education" } }, { "term": { "term": "committee on staffing higher education", "frequency": "1", "parent": "education" } }, { "term": { "term": "public education", "frequency": "0", "parent": "education" } }, { "term": { "term": "annual educational conference", "frequency": "0", "parent": "education" } }, { "term": { "term": "teachers union of city of new york", "frequency": "0", "parent": "education" } }, { "term": { "term": "teaching", "frequency": "1", "parent": "education" } }, { "term": { "term": "textbooks", "frequency": "1", "parent": "education" } }, { "term": { "term": "cal tech", "frequency": "1", "parent": "education" } }, { "term": { "term": "university", "frequency": "0", "parent": "education" } }, { "term": { "term": "reed college", "frequency": "1", "parent": "education" } }, { "term": { "term": "documentary", "frequency": "1", "parent": "media" } }, { "term": { "term": "films", "frequency": "4", "parent": "media" } }, { "term": { "term": "poetry", "frequency": "3", "parent": "media" } }, { "term": { "term": "debate", "frequency": "1", "parent": "media" } }, { "term": { "term": "harpers", "frequency": "1", "parent": "media" } }, { "term": { "term": "music", "frequency": "2", "parent": "media" } }, { "term": { "term": "fantasy , science fiction", "frequency": "0", "parent": "media" } }, { "term": { "term": "television", "frequency": "1", "parent": "media" } }, { "term": { "term": "publication", "frequency": "3", "parent": "media" } }, { "term": { "term": "publicity", "frequency": "3", "parent": "media" } }, { "term": { "term": "scientific american", "frequency": "1", "parent": "media" } }, { "term": { "term": "african-americans", "frequency": "1", "parent": "medicine" } }, { "term": { "term": "anesthetic action", "frequency": "1", "parent": "medicine" } }, { "term": { "term": "cancer", "frequency": "1", "parent": "medicine" } }, { "term": { "term": "anesthesia", "frequency": "10", "parent": "medicine" } }, { "term": { "term": "nitrogen narcosis", "frequency": "2", "parent": "medicine" } }, { "term": { "term": "sickle cell anemia", "frequency": "2", "parent": "medicine" } }, { "term": { "term": "diabetes", "frequency": "2", "parent": "medicine" } }, { "term": { "term": "aging", "frequency": "0", "parent": "medicine" } }, { "term": { "term": "diet", "frequency": "1", "parent": "medicine" } }, { "term": { "term": "glaucoma", "frequency": "2", "parent": "medicine" } }, { "term": { "term": "hemoglobin", "frequency": "1", "parent": "medicine" } }, { "term": { "term": "medical advice", "frequency": "1", "parent": "medicine" } }, { "term": { "term": "medical texts", "frequency": "0", "parent": "medicine" } }, { "term": { "term": "nostril breathing", "frequency": "0", "parent": "medicine" } }, { "term": { "term": "sickle-cell anemia", "frequency": "1", "parent": "medicine" } }, { "term": { "term": "smoking", "frequency": "1", "parent": "medicine" } }, { "term": { "term": "x-rays", "frequency": "5", "parent": "medicine" } }, { "term": { "term": "metabolism", "frequency": "1", "parent": "medicine" } }, { "term": { "term": "molecular disease", "frequency": "2", "parent": "medicine" } }, { "term": { "term": "neurology", "frequency": "1", "parent": "medicine" } }, { "term": { "term": "multiple sclerosis", "frequency": "1", "parent": "medicine" } }, { "term": { "term": "citrus", "frequency": "1", "parent": "medicine" } }, { "term": { "term": "pharmacology", "frequency": "1", "parent": "medicine" } }, { "term": { "term": "cellular decay", "frequency": "0", "parent": "medicine" } }, { "term": { "term": "calcium", "frequency": "2", "parent": "medicine" } }, { "term": { "term": "psychiatry", "frequency": "1", "parent": "medicine" } }, { "term": { "term": "psychology", "frequency": "1", "parent": "medicine" } }, { "term": { "term": "veterans", "frequency": "1", "parent": "military" } }, { "term": { "term": "discrimination", "frequency": "1", "parent": "politics" } }, { "term": { "term": "communism", "frequency": "14", "parent": "politics" } }, { "term": { "term": "congressional committees", "frequency": "1", "parent": "politics" } }, { "term": { "term": "east germany", "frequency": "1", "parent": "politics" } }, { "term": { "term": "ddr", "frequency": "0", "parent": "politics" } }, { "term": { "term": "cold war", "frequency": "5", "parent": "politics" } }, { "term": { "term": "communist party", "frequency": "1", "parent": "politics" } }, { "term": { "term": "corporation", "frequency": "0", "parent": "politics" } }, { "term": { "term": "germany", "frequency": "2", "parent": "politics" } }, { "term": { "term": "german crisis", "frequency": "2", "parent": "politics" } }, { "term": { "term": "geneva convention", "frequency": "1", "parent": "politics" } }, { "term": { "term": "berlin crisis", "frequency": "1", "parent": "politics" } }, { "term": { "term": "international control", "frequency": "1", "parent": "politics" } }, { "term": { "term": "land", "frequency": "1", "parent": "politics" } }, { "term": { "term": "immigration", "frequency": "1", "parent": "politics" } }, { "term": { "term": "japan", "frequency": "1", "parent": "politics" } }, { "term": { "term": "john f. kennedy", "frequency": "1", "parent": "politics" } }, { "term": { "term": "nazi party", "frequency": "1", "parent": "politics" } }, { "term": { "term": "neutrality", "frequency": "1", "parent": "politics" } }, { "term": { "term": "huac", "frequency": "0", "parent": "politics" } }, { "term": { "term": "krushchev", "frequency": "3", "parent": "politics" } }, { "term": { "term": "law", "frequency": "1", "parent": "politics" } }, { "term": { "term": "soviet union", "frequency": "2", "parent": "politics" } }, { "term": { "term": "house un-american activities committee", "frequency": "0", "parent": "politics" } }, { "term": { "term": "united states government", "frequency": "1", "parent": "politics" } }, { "term": { "term": "voting", "frequency": "2", "parent": "politics" } }, { "term": { "term": "propoganda", "frequency": "1", "parent": "politics" } }, { "term": { "term": "presidency", "frequency": "1", "parent": "politics" } }, { "term": { "term": "rhetoric", "frequency": "2", "parent": "politics" } }, { "term": { "term": "public office", "frequency": "2", "parent": "politics" } }, { "term": { "term": "prison", "frequency": "1", "parent": "politics" } }, { "term": { "term": "world war 2", "frequency": "2", "parent": "politics" } }, { "term": { "term": "universalist church", "frequency": "2", "parent": "religion" } }, { "term": { "term": "faith", "frequency": "1", "parent": "religion" } }, { "term": { "term": "church", "frequency": "0", "parent": "religion" } }, { "term": { "term": "buddhism", "frequency": "1", "parent": "religion" } }, { "term": { "term": "philosophy", "frequency": "7", "parent": "religion" } }, { "term": { "term": "morality", "frequency": "1", "parent": "religion" } }, { "term": { "term": "zen", "frequency": "1", "parent": "religion" } }, { "term": { "term": "quantum mechanics", "frequency": "1", "parent": "science" } }, { "term": { "term": "rhodium", "frequency": "1", "parent": "science" } }, { "term": { "term": "chemical bonds", "frequency": "13", "parent": "science" } }, { "term": { "term": "deuterium", "frequency": "1", "parent": "science" } }, { "term": { "term": "organic chemistry", "frequency": "2", "parent": "science" } }, { "term": { "term": "crystallization", "frequency": "1", "parent": "science" } }, { "term": { "term": "college chemistry", "frequency": "0", "parent": "science" } }, { "term": { "term": "energy", "frequency": "1", "parent": "science" } }, { "term": { "term": "helium", "frequency": "2", "parent": "science" } }, { "term": { "term": "hair straightener", "frequency": "1", "parent": "science" } }, { "term": { "term": "evolution", "frequency": "1", "parent": "science" } }, { "term": { "term": "general chemistry", "frequency": "1", "parent": "science" } }, { "term": { "term": "artificial intelligence", "frequency": "3", "parent": "science" } }, { "term": { "term": "biology", "frequency": "1", "parent": "science" } }, { "term": { "term": "alpha helix", "frequency": "2", "parent": "science" } }, { "term": { "term": "bioanalysis", "frequency": "1", "parent": "science" } }, { "term": { "term": "chemical structure", "frequency": "1", "parent": "science" } }, { "term": { "term": "chemical engineering", "frequency": "1", "parent": "science" } }, { "term": { "term": "amino acid bonds", "frequency": "1", "parent": "science" } }, { "term": { "term": "chemistry", "frequency": "7", "parent": "science" } }, { "term": { "term": "citizen science", "frequency": "3", "parent": "science" } }, { "term": { "term": "hurricanes", "frequency": "1", "parent": "science" } }, { "term": { "term": "hydrates", "frequency": "1", "parent": "science" } }, { "term": { "term": "ions", "frequency": "1", "parent": "science" } }, { "term": { "term": "iodine", "frequency": "0", "parent": "science" } }, { "term": { "term": "molecular structure", "frequency": "1", "parent": "science" } }, { "term": { "term": "carbon-14", "frequency": "1", "parent": "science" } }, { "term": { "term": "nuclear structure", "frequency": "1", "parent": "science" } }, { "term": { "term": "linear sequence", "frequency": "1", "parent": "science" } }, { "term": { "term": "orbitals", "frequency": "3", "parent": "science" } }, { "term": { "term": "pavlov", "frequency": "3", "parent": "science" } }, { "term": { "term": "nature of chemical bond", "frequency": "1", "parent": "science" } }, { "term": { "term": "physics", "frequency": "3", "parent": "science" } }, { "term": { "term": "lab work", "frequency": "1", "parent": "science" } }, { "term": { "term": "plastic long chains", "frequency": "1", "parent": "science" } }, { "term": { "term": "mass energy equivalence", "frequency": "1", "parent": "science" } }, { "term": { "term": "iodide", "frequency": "0", "parent": "science" } }, { "term": { "term": "tree growth", "frequency": "1", "parent": "science" } }, { "term": { "term": "twinning", "frequency": "1", "parent": "science" } }, { "term": { "term": "universal law", "frequency": "0", "parent": "science" } }, { "term": { "term": "van der waals", "frequency": "1", "parent": "science" } }, { "term": { "term": "water", "frequency": "2", "parent": "science" } }, { "term": { "term": "zero-point vibration", "frequency": "1", "parent": "science" } }]} and code goes below:
<!doctype html> <meta charset="utf-8"> <style> circle { fill: rgb(31, 119, 180); fill-opacity: .25; stroke: rgb(31, 119, 180); stroke-width: 1px; } .leaf circle { fill: #ff7f0e; fill-opacity: 1; } text { font: 10px sans-serif; text-anchor: middle; } </style> <svg width="960" height="960"></svg> <script src="https://d3js.org/d3.v4.min.js"></script> <script> var svg = d3.select("svg"), diameter = +svg.attr("width"), g = svg.append("g").attr("transform", "translate(2,2)"), format = d3.format(",d"); var pack = d3.pack() .size([diameter - 4, diameter - 4]); d3.json("flare.json", function(error, root) { if (error) throw error; root = d3.hierarchy(root) .sum(function(d) { return d.size; }) .sort(function(a, b) { return b.value - a.value; }); var termsnode = d3.nest() .key(function(d) { console.log("term---"+d.term); return d.term; }) .key(function(d) { return d.parent; }) .rollup(function(leaves) { return leaves.length; }) .entries(root); var termroot = { key: root.descendants(), values: termsnode }; var node = svg.datum(termroot).selectall(".node") .data(pack(root).descendants()) .enter().append("g") .attr("class", function(d) { return d.children ? "node" : "leaf node"; }) .attr("transform", function(d) { return "translate(" + d.x + "," + d.y + ")"; }); node.append("title") .text(function(d) { console.log(d.data.termroot + "\n" + format(d.value)); return d.data.termroot + "\n" + format(d.value); }); node.append("circle") .attr("r", function(d) { return d.r; }); node.filter(function(d) { return !d.children; }).append("text") .attr("dy", "0.3em") .text(function(d) { return d.data.termroot.substring(0, d.r / 3); }); }); </script> </html> i have been trying long seems unable return diameter of circle. please help.
Comments
Post a Comment