3e:null 3f:["$","title",null,{"children":"Nested treemap with bundled connections | rolyhudson | Observable"}] 45:T9d4,chart = { // Specify the chart’s dimensions. const width = 1000; const height = 1000; const color = d3.scaleSequential([-3, 10], d3.interpolateGnBu); // Create the treemap layout. const treemap = data => d3.treemap() .size([width, height]) .paddingOuter(3) .paddingTop(19) .paddingInner(1) .round(true) (d3.hierarchy(data) .sum(d => d.size) .sort((a, b) => b.size - a.size)); const root = treemap(data); // Create the SVG container. const svg = d3.create("svg") .attr("width", width) .attr("height", height) .attr("viewBox", [0, 0, width, height]) .attr("style", "max-width: 100%; height: auto; overflow: visible; font: 10px sans-serif;"); const shadow = DOM.uid("shadow"); svg.append("filter") .attr("id", shadow.id) .append("feDropShadow") .attr("flood-opacity", 0.3) .attr("dx", 0) .attr("stdDeviation", 3); const node = svg.selectAll("g") .data(d3.group(root, d => d.height)) .join("g") .attr("filter", shadow) .selectAll("g") .data(d => d[1]) .join("g") .attr("transform", d => `translate(${d.x0},${d.y0})`); const format = d3.format(",d"); node.append("title") .text(d => `${d.ancestors().reverse().map(d => d.data.name).join("/")}\n${format(d.value)}`); node.append("rect") .attr("id", d => (d.nodeUid = DOM.uid("node")).id) .attr("fill", d => color(d.height)) .attr("width", d => d.x1 - d.x0) .attr("height", d => d.y1 - d.y0); node.append("clipPath") .attr("id", d => (d.clipUid = DOM.uid("clip")).id) .append("use") .attr("xlink:href", d => d.nodeUid.href); node.append("text") .attr("clip-path", d => d.clipUid) .selectAll("tspan") .data(d => d.data.name.split(/(?=[A-Z][^A-Z])/g).concat(format(d.value))) .join("tspan") .attr("fill-opacity", (d, i, nodes) => i === nodes.length - 1 ? 0.7 : null) .text(d => d); node.filter(d => d.children).selectAll("tspan") .attr("dx", 3) .attr("y", 13); node.filter(d => !d.children).selectAll("tspan") .attr("x", 3) .attr("y", (d, i, nodes) => `${(i === nodes.length - 1) * 0.3 + 1.1 + i * 0.9}em`); // Draw the force edged results svg.selectAll('path.bundled') .data(results).enter() .append('path') .attr('d', line) .attr('stroke', '#f00c93') .attr('fill', 'transparent') .attr('stroke-width', 2) .attr('stroke-opacity',0.5) return svg.node(); }46:T3afe,ForceEdgeBundling = function(){ var data_nodes = {}, // {'nodeid':{'x':,'y':},..} data_edges = [], // [{'source':'nodeid1', 'target':'nodeid2'},..] compatibility_list_for_edge = [], subdivision_points_for_edge = [], K = 0.05, // global bundling constant controling edge stiffness S_initial = 1e-6, // init. distance to move points P_initial = 1, // init. subdivision number P_rate = 4, // subdivision rate increase C = 6, // number of cycles to perform I_initial = 70, // init. number of iterations for cycle I_rate = 0.6667, // rate at which iteration number decreases i.e. 2/3 compatibility_threshold = 0.6, invers_quadratic_mode = false, eps = 1e-6; /*** Geometry Helper Methods ***/ function vector_dot_product(p, q){ return p.x * q.x + p.y * q.y; } function edge_as_vector(P){ return {'x': data_nodes.get(P.target).x - data_nodes.get(P.source).x, 'y': data_nodes.get(P.target).y - data_nodes.get(P.source).y} } function edge_length(e){ return Math.sqrt( Math.pow(data_nodes.get(e.source).x-data_nodes.get(e.target).x, 2) + Math.pow(data_nodes.get(e.source).y-data_nodes.get(e.target).y, 2) ); } function custom_edge_length(e){ return Math.sqrt( Math.pow(e.source.x - e.target.x, 2) + Math.pow(e.source.y - e.target.y, 2)); } function edge_midpoint(e){ var middle_x = (data_nodes.get(e.source).x + data_nodes.get(e.target).x) / 2.0; var middle_y = (data_nodes.get(e.source).y + data_nodes.get(e.target).y) / 2.0; return {'x': middle_x, 'y': middle_y}; } function compute_divided_edge_length(e_idx){ var length = 0; for(var i = 1; i < subdivision_points_for_edge[e_idx].length; i++){ var segment_length = euclidean_distance( subdivision_points_for_edge[e_idx][i], subdivision_points_for_edge[e_idx][i-1] ); length += segment_length; } return length; } function euclidean_distance(p, q){ return Math.sqrt( Math.pow(p.x-q.x, 2) + Math.pow(p.y-q.y, 2) ); } function project_point_on_line(p, Q){ var L = Math.sqrt( (Q.target.x - Q.source.x) * (Q.target.x - Q.source.x) + (Q.target.y - Q.source.y) * (Q.target.y - Q.source.y)); var r = ((Q.source.y - p.y) * (Q.source.y - Q.target.y) - (Q.source.x - p.x) * (Q.target.x - Q.source.x)) / (L * L); return {'x':(Q.source.x + r * (Q.target.x - Q.source.x)), 'y':(Q.source.y + r * (Q.target.y - Q.source.y))}; } function initialize_edge_subdivisions(){ for(var i = 0; i < data_edges.length; i++) // for each edge if(P_initial == 1) subdivision_points_for_edge[i] = []; // no subdivision points else{ subdivision_points_for_edge[i] = []; // for edge i, add x, y of edge i's source and target to array?? subdivision_points_for_edge[i].push(data_nodes[data_edges[i].source]); subdivision_points_for_edge[i].push(data_nodes[data_edges[i].target]); } } function initialize_compatibility_lists(){ for(var i = 0; i < data_edges.length; i++) compatibility_list_for_edge[i] = []; //0 compatible edges. } function filter_self_loops(edgelist){ var filtered_edge_list = []; for(var e=0; e < edgelist.length; e++){ if(data_nodes.get(edgelist[e].source) && data_nodes.get(edgelist[e].source).x != data_nodes.get(edgelist[e].target).x && data_nodes.get(edgelist[e].source).y != data_nodes.get(edgelist[e].target).y ){ //or smaller than eps filtered_edge_list.push(edgelist[e]); } } return filtered_edge_list; } /*** Force Calculation Methods ***/ function apply_spring_force(e_idx, i, kP){ // e_idx, edge index // i, id for segment, starting 1 // kp, local spring contant var prev = subdivision_points_for_edge[e_idx][i-1]; var next = subdivision_points_for_edge[e_idx][i+1]; var crnt = subdivision_points_for_edge[e_idx][i]; var x = prev.x - crnt.x + next.x - crnt.x; var y = prev.y - crnt.y + next.y - crnt.y; x *= kP; y *= kP; return {'x' : x, 'y' : y}; } function apply_electrostatic_force(e_idx, i , S){ // S is how much to move a point // i is index for segment, starting 1 var sum_of_forces = { 'x' : 0, 'y' : 0}; // find compatible edges for the given edge, [1,6,8] var compatible_edges_list = compatibility_list_for_edge[e_idx]; // what is window.sbd? window.sbd = subdivision_points_for_edge; for(var oe = 0; oe < compatible_edges_list.length; oe++){ // for each compatiple edge of the given edge // compatible_edges_list[oe] is the id for that compatible edge // and then get the list of subdivision points for that edge var force = { 'x': subdivision_points_for_edge[compatible_edges_list[oe]][i].x - subdivision_points_for_edge[e_idx][i].x, 'y': subdivision_points_for_edge[compatible_edges_list[oe]][i].y - subdivision_points_for_edge[e_idx][i].y}; if((Math.abs(force.x) > eps)||(Math.abs(force.y) > eps)){ // essentially inverse of distance between two points var diff = ( 1 / Math.pow(custom_edge_length({'source':subdivision_points_for_edge[compatible_edges_list[oe]][i], 'target':subdivision_points_for_edge[e_idx][i]}),1)); // accumulating forces exerted by points on // all compatible edges to the point of the given edge sum_of_forces.x += force.x*diff; sum_of_forces.y += force.y*diff; } } return sum_of_forces; } function apply_resulting_forces_on_subdivision_points(e_idx, P, S){ var kP = K/(edge_length(data_edges[e_idx])*(P+1)); // kP=K/(|P| * (number of segments)), where |P| is the initial length of edge P. // kp is identical for each segment of P, it is a local spring constant // (length * (num of sub division pts - 1)) var resulting_forces_for_subdivision_points = [{'x':0, 'y':0}]; for(var i = 1; i < P+1; i++){ // for each subdivision points, excluding initial and end points var resulting_force = {'x' : 0, 'y' : 0}; // spring_force in {'x' : x, 'y' : y} var spring_force = apply_spring_force(e_idx, i, kP); // similar format {'x' : x, 'y' : y} var electrostatic_force = apply_electrostatic_force(e_idx, i, S); // combine all forces resulting_force.x = S*(spring_force.x + electrostatic_force.x); resulting_force.y = S*(spring_force.y + electrostatic_force.y); resulting_forces_for_subdivision_points.push(resulting_force); } resulting_forces_for_subdivision_points.push({'x':0, 'y':0}); // [{'x':0, 'y':0}, {'x':0, 'y':0}, {'x':0, 'y':0},...] // each dict is return resulting_forces_for_subdivision_points; } /*** ********************** ***/ /*** Edge Division Calculation Methods ***/ function update_edge_divisions(P){ for(var e_idx=0; e_idx < data_edges.length; e_idx++){ if( P == 1 ){ subdivision_points_for_edge[e_idx].push(data_nodes.get(data_edges[e_idx].source)); // source subdivision_points_for_edge[e_idx].push(edge_midpoint(data_edges[e_idx])); // mid point subdivision_points_for_edge[e_idx].push(data_nodes.get(data_edges[e_idx].target)); // target }else{ var divided_edge_length = compute_divided_edge_length(e_idx); // add up segment lengths var segment_length = divided_edge_length / (P+1); // get average segment length var current_segment_length = segment_length; var new_subdivision_points = []; // initiate a new array for subdivision points new_subdivision_points.push(data_nodes.get(data_edges[e_idx].source)); //source for(var i = 1; i < subdivision_points_for_edge[e_idx].length; i++){ var old_segment_length = euclidean_distance(subdivision_points_for_edge[e_idx][i], subdivision_points_for_edge[e_idx][i-1]); while(old_segment_length > current_segment_length){ var percent_position = current_segment_length / old_segment_length; var new_subdivision_point_x = subdivision_points_for_edge[e_idx][i-1].x; var new_subdivision_point_y = subdivision_points_for_edge[e_idx][i-1].y; new_subdivision_point_x += percent_position*(subdivision_points_for_edge[e_idx][i].x - subdivision_points_for_edge[e_idx][i-1].x); new_subdivision_point_y += percent_position*(subdivision_points_for_edge[e_idx][i].y - subdivision_points_for_edge[e_idx][i-1].y); new_subdivision_points.push({'x':new_subdivision_point_x, 'y':new_subdivision_point_y }); old_segment_length -= current_segment_length; current_segment_length = segment_length; } current_segment_length -= old_segment_length; } new_subdivision_points.push(data_nodes.get(data_edges[e_idx].target)); //target subdivision_points_for_edge[e_idx] = new_subdivision_points; } } } /*** ********************** ***/ /*** Edge compatibility measures ***/ function angle_compatibility(P, Q){ var result = Math.abs(vector_dot_product(edge_as_vector(P),edge_as_vector(Q))/(edge_length(P)*edge_length(Q))); return result; } function scale_compatibility(P, Q){ var lavg = (edge_length(P) + edge_length(Q))/2.0; var result = 2.0/(lavg/Math.min(edge_length(P),edge_length(Q)) + Math.max(edge_length(P), edge_length(Q))/lavg); return result; } function position_compatibility(P, Q){ var lavg = (edge_length(P) + edge_length(Q))/2.0; var midP = {'x':(data_nodes.get(P.source).x + data_nodes.get(P.target).x)/2.0, 'y':(data_nodes.get(P.source).y + data_nodes.get(P.target).y)/2.0}; var midQ = {'x':(data_nodes.get(Q.source).x + data_nodes.get(Q.target).x)/2.0, 'y':(data_nodes.get(Q.source).y + data_nodes.get(Q.target).y)/2.0}; var result = lavg/(lavg + euclidean_distance(midP, midQ)); return result; } function edge_visibility(P, Q){ var I0 = project_point_on_line(data_nodes.get(Q.source), {'source':data_nodes.get(P.source), 'target':data_nodes.get(P.target)}); var I1 = project_point_on_line(data_nodes.get(Q.target), {'source':data_nodes.get(P.source), 'target':data_nodes.get(P.target)}); //send acutal edge points positions var midI = {'x':(I0.x + I1.x)/2.0, 'y':(I0.y + I1.y)/2.0}; var midP = {'x':(data_nodes.get(P.source).x + data_nodes.get(P.target).x)/2.0, 'y':(data_nodes.get(P.source).y + data_nodes.get(P.target).y)/2.0}; var result = Math.max(0, 1 - 2 * euclidean_distance(midP,midI)/euclidean_distance(I0,I1)); return result; } function visibility_compatibility(P, Q){ return Math.min(edge_visibility(P,Q), edge_visibility(Q,P)); } function compatibility_score(P, Q){ var result = (angle_compatibility(P,Q) * scale_compatibility(P,Q) * position_compatibility(P,Q) * visibility_compatibility(P,Q)); return result; } function are_compatible(P, Q){ //console.log('compatibility ' + P.source +' - '+ P.target + ' and ' + Q.source +' '+ Q.target); return (compatibility_score(P,Q) >= compatibility_threshold); } function compute_compatibility_lists() { for(var e = 0; e < data_edges.length - 1; e++){ for(var oe = e + 1 ; oe < data_edges.length; oe++){ // don't want any duplicates if(e == oe) continue; else{ if(are_compatible(data_edges[e],data_edges[oe])){ compatibility_list_for_edge[e].push(oe); compatibility_list_for_edge[oe].push(e); } } } } } /*** ************************ ***/ /*** Main Bundling Loop Methods ***/ var forcebundle = function(){ var S = S_initial; // how much to move a point var I = I_initial; // num of iterations per cycle/ what is a cycle? var P = P_initial; // number of sub-points on an edge initialize_edge_subdivisions(); /// [[source.id, target.id], [], [],...] initialize_compatibility_lists(); // [[],[],...] update_edge_divisions(P); // if P is one, we just add a mid-point to each list // [[source.id, midpoint, target.id],[],...] compute_compatibility_lists(); for(var cycle=0; cycle < C; cycle++){ for (var iteration = 0; iteration < I; iteration++){ // in each iteration var forces = []; for(var edge = 0; edge < data_edges.length; edge++){ // for edge 'edge', number of subpoints P, and movement S // get [{'x':0, 'y':0}, {'x':0, 'y':0}, {'x':0, 'y':0},...] forces[edge] = apply_resulting_forces_on_subdivision_points(edge, P, S); } for(var e = 0; e < data_edges.length; e++){ // for each edge for(var i=0; i < P + 1;i++){ subdivision_points_for_edge[e][i].x += forces[e][i].x; subdivision_points_for_edge[e][i].y += forces[e][i].y; } } } //prepare for next cycle S = S / 2; P = P * 2; I = I_rate * I; update_edge_divisions(P); console.log('C' + cycle); console.log('P' + P); console.log('S' + S); } return subdivision_points_for_edge; } /*** ************************ ***/ /*** Getters/Setters Methods ***/ forcebundle.nodes = function(nl){ if(arguments.length == 0){ return data_nodes; } else{ data_nodes = nl; } return forcebundle; } forcebundle.edges = function(ll){ if(arguments.length == 0){ return data_edges; } else{ data_edges = filter_self_loops(ll); //remove edges to from to the same point } return forcebundle; } forcebundle.bundling_stiffness = function(k){ if(arguments.length == 0){ return K; } else{ K = k; } return forcebundle; } forcebundle.step_size = function(step){ if(arguments.length == 0){ return S_initial; } else{ S_initial = step; } return forcebundle; } forcebundle.cycles = function(c){ if(arguments.length == 0){ return C; } else{ C = c; } return forcebundle; } forcebundle.iterations = function(i){ if(arguments.length == 0){ return I_initial; } else{ I_initial = i; } return forcebundle; } forcebundle.iterations_rate = function(i){ if(arguments.length == 0){ return I_rate; } else{ I_rate = i; } return forcebundle; } forcebundle.subdivision_points_seed = function(p){ if(arguments.length == 0){ return P; } else{ var P = p; } return forcebundle; } forcebundle.subdivision_rate = function(r){ if(arguments.length == 0){ return P_rate; } else{ P_rate = r; } return forcebundle; } forcebundle.compatbility_threshold = function(t){ if(arguments.length == 0){ return compatibility_threshold; } else{ compatibility_threshold = t; } return forcebundle; } /*** ************************ ***/ return forcebundle; }47:[{"id":"887598bbd42a3f917eabbea64c62e3bb41a47ea595a22955867dacb9a3689784400f91740b3355f1293d6d0faa1e8ac6ef0aeb4f798ec0eec82feda5e898183b","href":"https://static.observableusercontent.com/files/887598bbd42a3f917eabbea64c62e3bb41a47ea595a22955867dacb9a3689784400f91740b3355f1293d6d0faa1e8ac6ef0aeb4f798ec0eec82feda5e898183b","name":"graphfromlinks.json","type":"application/json","lastModified":1706011486312.997,"size":61295},{"id":"ccf4e9e2a716ecb0705b246a22437d90e3283ec4b8a91359f2c00e3065bda165dd3b98a53a045b7d41be87be557b51cef103f491d01cb53b0798c4939de2c6ff","href":"https://static.observableusercontent.com/files/ccf4e9e2a716ecb0705b246a22437d90e3283ec4b8a91359f2c00e3065bda165dd3b98a53a045b7d41be87be557b51cef103f491d01cb53b0798c4939de2c6ff","name":"nestdata.json","type":"application/json","lastModified":1706011486312.997,"size":148377},{"id":"a1ca0f8019fe7bdcda856fcb755bcbf24ada1f1d31fa9c9641bb9bc9044a746b709557cd8d6bd1b3aa9ea8b2897701d07771ab9a9513c53e7a326155e8ed50e2","href":"https://static.observableusercontent.com/files/a1ca0f8019fe7bdcda856fcb755bcbf24ada1f1d31fa9c9641bb9bc9044a746b709557cd8d6bd1b3aa9ea8b2897701d07771ab9a9513c53e7a326155e8ed50e2","name":"nestdata@1.json","type":"application/json","lastModified":1706011520418.487,"size":86048},{"id":"0c4f9b1fa27f8bd11f204edae8cb469ffa1533fece23ac8de15aa0a861b46f07441eca3c06a1af4253cace266ec96eb2515612368b19821b8c988733c255aed2","href":"https://static.observableusercontent.com/files/0c4f9b1fa27f8bd11f204edae8cb469ffa1533fece23ac8de15aa0a861b46f07441eca3c06a1af4253cace266ec96eb2515612368b19821b8c988733c255aed2","name":"nestdata@2.json","type":"application/json","lastModified":1706011801918.07,"size":86055},{"id":"4e7618c73faadb64e426debad24c89328c99f1b64c0c9a80307adbadcf1e1489c98e6448bc74669ff7e8a97a52b49cb64c24724c80b18f13e95536c379b0c4af","href":"https://static.observableusercontent.com/files/4e7618c73faadb64e426debad24c89328c99f1b64c0c9a80307adbadcf1e1489c98e6448bc74669ff7e8a97a52b49cb64c24724c80b18f13e95536c379b0c4af","name":"graphfromlinks@1.json","type":"application/json","lastModified":1706012987645.234,"size":26806},{"id":"cca6b8905b0b207e7ccaf55b20f76476423861e2d76255c091ef13297214f0cccf1163874c6cdc295c4227cb3af09548d64c94328cff4bac9c3b25c3e4a4afa2","href":"https://static.observableusercontent.com/files/cca6b8905b0b207e7ccaf55b20f76476423861e2d76255c091ef13297214f0cccf1163874c6cdc295c4227cb3af09548d64c94328cff4bac9c3b25c3e4a4afa2","name":"nestdata@3.json","type":"application/json","lastModified":1706013070151.007,"size":56795}] 43:{"id":"c9104441f8ec3305","slug":null,"title":"Nested treemap with bundled connections","thumbnail":"69d476bdcbb3f3a2d79836c5e70cfe2f2bfb49cc0a49779b55911b7061797077","access_level":"public","create_time":"$D2024-01-23T12:04:46.312Z","update_time":"$D2024-01-23T12:31:09.293Z","view_time":null,"first_public_time":"$D2024-01-23T12:04:46.312Z","has_unpublished_edits":null,"fork":{"id":"99274576c5b6b990","slug":null,"title":"Nested treemap with bundled connections","owner":{"id":"39eb8dd4c906cd6c","login":"rolyhudson","name":""}},"stars":1,"starred":false,"owner":{"type":"team","id":"39eb8dd4c906cd6c","login":"rolyhudson","name":"","avatar_url":"https://avatars-next.observableusercontent.com/11a061b4eb5bd17787fef60475aac7edb528a33327c9914e5ddcd149493e8cb7","tier":"starter_2024","bio":"","following":false},"version":329,"publish_version":null,"role":null,"authored":false,"authors":[{"type":"individual","id":"cd83edde98ad3724","login":"rolyhudson","name":"","avatar_url":"https://avatars-next.observableusercontent.com/11a061b4eb5bd17787fef60475aac7edb528a33327c9914e5ddcd149493e8cb7","tier":null,"bio":"","following":false}],"members":[{"type":"individual","id":"cd83edde98ad3724","login":"rolyhudson","name":"","avatar_url":"https://avatars-next.observableusercontent.com/11a061b4eb5bd17787fef60475aac7edb528a33327c9914e5ddcd149493e8cb7","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":0,"collection":null,"type":"notebook","body":{"titling":"auto","title":"Nested treemap with bundled connections","cells":[{"id":0,"value":"# Nested treemap with bundled connections\n\nBuilds on great work by [Stuart Thompson](https://observablehq.com/@stuartathompson/force-edge-bundling). ","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":228,"value":"viewof stepSize = Inputs.range([0.01, 100], {step: 0.01,value: 2, label: \"Step size\"})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":225,"value":"viewof stiffness = Inputs.range([0, 30], {step: 0.005,value: 4, label: \"Edge stiffness\"})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":10,"value":"$45","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":188,"value":"treemap = data => d3.treemap()\n .size([1000,1000])\n .paddingOuter(3)\n .paddingTop(19)\n .paddingInner(1)\n .round(true)\n (d3.hierarchy(data)\n .sum(d => d.size)\n .sort((a, b) => b.size - a.size));\n ","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":292,"value":"Get hierarchical root","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":192,"value":"root = treemap(data);","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":297,"value":"Create mapping for node name and x y centre point on the treemap","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":194,"value":"positionMap = {\n //debugger;\n const xy = root.leaves().map(({data, x0,y0,x1,y1}) =>{\n var name = data.name; \n var x = (x1-x0) / 2 +x0;\n var y = (y1-y0) / 2 +y0;\n return {name,x,y};\n \n});\n \n return xy;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":299,"value":"List of all names to create the link matrix","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":211,"value":"names = positionMap.map(d => d.name )","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":326,"value":"names.forEach(d => console.log(d));","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":301,"value":"Graph defined by link matrix","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":216,"value":"graph = FileAttachment(\"graphfromlinks@1.json\").json()","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":303,"value":"Clone graph and map on position x and y to nodes","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":218,"value":"clone = \n{\n let clone = _.clone(graph);\n positionMap.forEach(function(d){\n var node = clone.nodes.find(n => n.name === d.name);\n if(node != undefined){\n node.x = d.x;\n node.y = d.y;\n }\n });\n return clone; \n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":305,"value":"Create hash map of nodes","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":252,"value":"nodemap= {\n const fruits = new Map();\n clone.nodes.forEach(function(d){\n fruits.set(d.id,d)\n });\n return fruits\n}\n","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":307,"value":"Check hashmap","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":256,"value":"nodemap.get('Analytics')","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":274,"value":"line = d3.line()\n .x(d => d.x)\n .y(d => d.y)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":310,"value":"Generate line coordinates from bundling functions","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":243,"value":"results = {\n // Triggering updates on input change\n stiffness\n stepSize\n \n // Calculate force edge bundling.\n // NOTE! You have to shim hashes onto data.nodes using d3.map()\n return fbundling(nodemap, clone.links) \n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":312,"value":"Nested data for treemap ","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":5,"value":"data = FileAttachment(\"nestdata@3.json\").json()","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":234,"value":"$46","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":237,"value":"fbundling = (nodes, edges) => {\n var results = ForceEdgeBundling()\n\t\t\t\t.nodes(nodes)\n\t\t\t\t.edges(edges)\n\t\t\t\t.step_size(stepSize)\n\t\t\t\t.bundling_stiffness(stiffness)\n return results()\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W47","stdlib":"1"}} 44:"$43:body"