diff --git a/assets/cn.js b/assets/cn.js index 99a5f66da58daec0118c56dbb73fde8e1ec44358..5b2ba326b31036e40ac240a44c89c5314e80efb1 100644 --- a/assets/cn.js +++ b/assets/cn.js @@ -18,7 +18,7 @@ perc; */ var color = d3.scaleOrdinal() .domain(["Citedby", "Input", "Reference"]) - .range([' #01d7c0', ' #8b90fe ', ' #a15eb2 ']), + .range(['#01d7c0', '#8b90fe', '#a15eb2']), y_scale = d3.scaleOrdinal() .domain(["Citedby", "Input", "Reference"]) .range([0, 200, 400]), @@ -144,7 +144,6 @@ function success(graph){ } function failure(graph){ localStorage.setItem("oldjson","irgendwaswasimmergespeichertwirdwennkeinejsondaist") - } var intervalId=window.setInterval(function(){ diff --git a/assets/cn2.js b/assets/cn2.js index c31823abcb405db0637a7e9d0edbed42cef534b3..de4ab781b1ed1db46709b5fb6da7c9998c696328 100644 --- a/assets/cn2.js +++ b/assets/cn2.js @@ -18,7 +18,7 @@ perc; */ var color = d3.scaleOrdinal() .domain(["Citedby", "Input", "Reference"]) - .range([' #01d7c0', ' #8b90fe ', ' #a15eb2 ']), + .range(['#01d7c0', '#8b90fe', '#a15eb2']), y_scale = d3.scaleOrdinal() .domain(["Citedby", "Input", "Reference"]) .range([0, 200, 400]), @@ -49,7 +49,6 @@ 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], @@ -159,11 +158,9 @@ var gX = svg.append("g") d3.json("json_text.json").then(success,failure) function success(graph){ update(graph.links, graph.nodes); - } function failure(graph){ localStorage.setItem("oldjson","irgendwaswasimmergespeichertwirdwennkeinejsondaist") - } var intervalId=window.setInterval(function(){ @@ -211,7 +208,7 @@ function updateXAxis(nodes) { xscale = d3.scaleLinear() .domain([d3.min(years)-1, d3.max(years)+1]) - .range([50, width-50]) + .range([1, width-1]) xAxis.scale(xscale); gX.call(xAxis); diff --git a/assets/index.html b/assets/index.html index 6be905718d537a01052b42052d4df9c58288eb68..981e9f8c7b4fcbcee35dd1bf88bc22ab1a625987 100644 --- a/assets/index.html +++ b/assets/index.html @@ -7,18 +7,18 @@ <style type="text/css"> button { width: 100px; - height:20px; + height: 20px; display: flex; justify-content: center; position: absolute; - left: 455px; - top: 575px; + left: 75px; + top: 580px; transition-duration: 0.4s; - border-radius:3px; - border:1px solid #909090; + border-radius: 3px; + border: 1px solid #909090; } - button.display{ + button.display { width: 120px; top: 0px; margin-left: 100px; @@ -37,49 +37,53 @@ } button.abstract { - width:146px; - position:absolute; + width: 146px; + position: absolute; top: 181px; - left: 1114px; - border-radius:0; - border:1px solid #909090; + left: 624px; + border-radius: 0; + border: 1px solid #909090; } button.overview { - width:147px; - position:absolute; - display:inline-block; + width: 147px; + position: absolute; + display: inline-block; top: 181px; - left: 968px; - border-radius:0; - border:1px solid #909090; + left: 478px; + border-radius: 0; + border: 1px solid #909090; } div.legendbox { - width:270px; - height:170px; + width: 270px; + height: 170px; padding: 10px; - /*border: 1px solid #999;*/ position: absolute; top: 10px; - left: 968px; + left: 478px; display: inline-block; margin: 0; } div.textbox { - width:270px; - min-height:200px; - max-height:370px; + width: 270px; + min-height: 200px; + max-height: 375px; padding: 10px; border: 1px solid #999; position: absolute; top: 200px; - left: 968px; + left: 478px; display: inline-block; overflow-y: scroll; margin: 0; } + + svg.graph { + position: absolute; + top: 20px + } </style> </head> @@ -87,7 +91,7 @@ <button id="change_graph" class="display" onclick="display()">Display Timeline</button> <!-- graph 576--> - <svg class="graph" width="960" height="560"></svg> + <svg class="graph" width="470" height="560"></svg> <p id="oldjson"></p> <!-- legend --> @@ -114,59 +118,56 @@ <script src="https://cdnjs.cloudflare.com/ajax/libs/crypto-js/3.1.9-1/md5.js"></script> <script type="text/javascript" > - if(window.location.hash=='#default'){ + if (window.location.hash=='#default') { + document.getElementById("change_graph").innerHTML = 'Display Timeline'; + load_default(); + } + else if (window.location.hash=='#time') { + document.getElementById("change_graph").innerHTML = 'Display Default'; + load_time(); + } + else if (window.location.hash=='') { + window.location.hash = 'default'; document.getElementById("change_graph").innerHTML = 'Display Timeline'; load_default(); + } + function display(){ + if (window.location.hash=='#time') { + display_default(); + } + else if (window.location.hash=='#default'){ + display_time(); + } } - else if(window.location.hash=='#time'){ - document.getElementById("change_graph").innerHTML = 'Display Default'; - load_time(); + function display_default() { + window.location.hash = 'default'; + window.location.reload(); } - else if(window.location.hash==''){ - window.location.hash = 'default'; - document.getElementById("change_graph").innerHTML = 'Display Timeline'; - load_default(); + + function display_time() { + window.location.hash = 'time'; + window.location.reload(); } - function display(){ - if(window.location.hash=='#time'){ - display_default(); - } - else if(window.location.hash=='#default'){ - display_time(); - } + + function load_default() { + var htmlHeader = document.getElementsByTagName("head")[0]; + var myScript = document.createElement('script'); + myScript.type = 'text/javascript'; + myScript.src = 'cn.js'; + myScript.id='abc'; + htmlHeader.appendChild(myScript); } - function display_default(){ - window.location.hash = 'default'; - window.location.reload(); - } - function display_time(){ - window.location.hash = 'time'; - window.location.reload(); - - } - function load_default(){ - var htmlHeader = document.getElementsByTagName("head")[0]; - var myScript = document.createElement('script'); - myScript.type = 'text/javascript'; - myScript.src = 'cn.js'; - myScript.id='abc'; - htmlHeader.appendChild(myScript); - } - function load_time(){ - var htmlHeader = document.getElementsByTagName("head")[0]; - var myScript = document.createElement('script'); - myScript.type = 'text/javascript'; - myScript.src = 'cn2.js'; - myScript.id='abc'; - htmlHeader.appendChild(myScript); - - } - </script> - - <!-- javascript for force-directed graph - <script type="text/javascript" id="cn" src="cn.js"></script> --> + function load_time() { + var htmlHeader = document.getElementsByTagName("head")[0]; + var myScript = document.createElement('script'); + myScript.type = 'text/javascript'; + myScript.src = 'cn2.js'; + myScript.id='abc'; + htmlHeader.appendChild(myScript); + } + </script> </body> </html> \ No newline at end of file diff --git a/assets/json_text.json b/assets/json_text.json index 85db8c706c7ff086b76a298bbbcdf6d2ae6e5801..c023ef5d5336e592b992489e70d4f7fdb79ef761 100644 --- a/assets/json_text.json +++ b/assets/json_text.json @@ -1,4 +1,3 @@ -<<<<<<< HEAD { "nodes": [ { @@ -113,6 +112,3 @@ } ] } -======= -{"nodes": [], "links": []} ->>>>>>> upstream/main