zeitachse

assets/cn.js

 /**
+ * Zeilen kürzen
 * creates a new zoom behavior
 */
 var zoom = d3.zoom().on("zoom", handle_zoom);
@@ -15,6 +16,7 @@ perc;
 
 /**
 * scale functions that return y coordinate/color of node depending on group
+* genauer Erläutern!
 */
 var color = d3.scaleOrdinal()
     .domain(["height", "input", "depth"])
@@ -48,6 +50,8 @@ var rect = svg.append("rect")
 
 /**
 * creates svg object (legend) and associated attributes
+* transform
+* mehr kommentare
 */
 var svg_legend = d3.select("svg.legendsvg"),
 legend_position = [65,95,125],
@@ -108,23 +112,24 @@ legend_arrow.append("text")
 * creates a new simulation
 * updates the positions of the links and nodes when the 
   state of the layout has changed (simulation has advanced by a tick)
+  tertärer Operator
 */
 var simulation = d3.forceSimulation()
     .force("link", d3.forceLink().id(function(d) {return d.doi;}).distance(50).strength(function(d) {
-            if (d.group == "input") {return 0;}
+            if (d.group == "Input") {return 0;}
             else {return 5;}
         }))
         .force("collide", d3.forceCollide(function(d) {
-            if (d.group == "input") {return 100;}
-            else {return 65;}
+            if (d.group == "Input") {return 70;}
+            else {return 70;}
         }).strength(0.5))
     .force("charge", d3.forceManyBody().strength(0.001))
     .force("center", d3.forceCenter(width/2, height/2+20))
     .force("yscale", d3.forceY().strength(function(d) {
-        if (d.group == "input") {return 1000;}
-        else {return 50;}
+        if (d.group == "Input") {return 300;}
+        else {return 200;}
     }).y(function(d) {return y_scale(d.group)}))
-    .alpha(0.005)
+    .alpha(0.004)
     .on("end",  zoom_to);
 
 /**
@@ -135,11 +140,24 @@ var g = svg.append("g")
 
 /**
 * loads JSON data and calls the update function
+Variable
 */
 d3.json("json_text.json").then(function(graph) {
     update(graph.links, graph.nodes);
 })
 
+var intervalId=window.setInterval(function(){
+    d3.json("json_text.json").then(function(graph) {
+        newjson_string=JSON.stringify(graph) 
+        var newjson = CryptoJS.MD5(newjson_string).toString();
+        oldjson=localStorage.getItem("oldjson")
+        if(newjson !== oldjson){
+            localStorage.setItem("oldjson", newjson);
+            window.location.reload()
+        }
+    })
+},5000);
+
 /**
 * calls update functions for links and nodes
 * adds the nodes, links and tick functionality to the simulation
@@ -161,7 +179,7 @@ function update(links, nodes) {
 }
 
 /**
-* initializes and shows links
+* initializes and shows links (edges)
 * @param {object} links - links
 */
 function update_links(links) {
@@ -250,6 +268,7 @@ function click_node(node) {
 
 /**
 * removes the highlights of the circles and their links
+to_remove auch hier benutzen
 */
 function click_rect() {
     fix_nodes(node);
@@ -280,9 +299,9 @@ function self_citation(source,target) {
 function mark_link(node) {
     d3.selectAll(".link")
         .style("stroke", function(o) {
-            return is_link_for_node(node, o) ? "black" : "#999";})
+            return is_link_for_node(node, o) ? "black" : "#DEDEDE";})
         .attr('marker-end', function(o) {
-            return is_link_for_node(node, o) ? update_marker('#000000', o.target) : update_marker('#999', o.target);})
+            return is_link_for_node(node, o) ? update_marker('#000000', o.target) : update_marker('#DEDEDE', o.target);})
 }
 
 /**
@@ -400,6 +419,7 @@ function handle_zoom() {
 
 /**
 * transforms svg so that the zoom is adapted to the size of the graph
+zoom_start initial 
 */
 function zoom_to() {
     node_bounds = d3.selectAll("svg.graph").node().getBBox();