From 37d667cb27b34cf6fe95b85443e091f86b7f768e Mon Sep 17 00:00:00 2001
From: Merle Stahl <merle.stahl@studium.uni-hamburg.de>
Date: Fri, 10 Dec 2021 12:32:55 +0100
Subject: [PATCH] fix_nodes
---
Output/Graph/cn.js | 9 +++----
Output/Graph/index.html | 54 +++++++++++++++++++++--------------------
2 files changed, 32 insertions(+), 31 deletions(-)
diff --git a/Output/Graph/cn.js b/Output/Graph/cn.js
index 9a985e0..0601cc3 100644
--- a/Output/Graph/cn.js
+++ b/Output/Graph/cn.js
@@ -13,6 +13,7 @@ width = svg.attr("width"),
height = svg.attr("height");
var textinfo='';
var textabstract='';
+
/**
* creates node object and associated attributes
*/
@@ -112,7 +113,6 @@ var simulation = d3.forceSimulation()
.force("yscale", d3.forceY().strength(1).y(function(d) {return yscale(d.group)}))
.alpha(0.1);
-
/**
* creates group element
*/
@@ -317,6 +317,7 @@ function clickNode(node) {
* removes the markings of the circles and their links
*/
function clickRect() {
+ fix_nodes(node);
d3.selectAll(".circle").style("stroke", "none")
d3.selectAll(".link")
.style("stroke", "#999")
@@ -360,8 +361,6 @@ function isLinkForNode(node, link){
return link.source.index == node.index || link.target.index == node.index;
}
-
-
/**
* outputs node info to textbox
* @param {object} node - data of current node
@@ -375,7 +374,6 @@ function textfunc(node){
document.getElementById('textbox').innerHTML = textinfo;
}
-
function highlightbutton(btn){
resetbuttonhighlight();
document.getElementById(btn).style.background="#DCDCDC";
@@ -419,6 +417,7 @@ function dragstarted(node) {
simulation.alphaTarget(0.3).restart()
node.fx = node.x;
node.fy = node.y;
+ fix_nodes(node);
}
/**
@@ -438,7 +437,7 @@ function fix_nodes(this_node) {
d.fy = d.y;
}
});
- }
+}
/**
* resets the positions of the nodes
diff --git a/Output/Graph/index.html b/Output/Graph/index.html
index 846551f..9daa68d 100644
--- a/Output/Graph/index.html
+++ b/Output/Graph/index.html
@@ -27,27 +27,10 @@
button.save{
margin-left: 330px;
}
- button.abstract{
- width:146px;
- position:absolute;
- top: 181px;
- left: 1114px;
- border-radius:0;
- border:1px solid #909090;
- }
- button.overview{
- width:147px;
- position:absolute;
- display:inline-block;
- top: 181px;
- left: 968px;
- 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;
@@ -57,10 +40,29 @@
margin: 0;
}
- div.textbox{
- width:270px;
- min-height:200px;
- max-height:370px;
+ button.abstract {
+ width:146px;
+ position: absolute;
+ top: 181px;
+ left: 1114px;
+ border-radius: 0;
+ border: 1px solid #909090;
+ }
+
+ button.overview {
+ width:147px;
+ position: absolute;
+ display: inline-block;
+ top: 181px;
+ left: 968px;
+ border-radius: 0;
+ border: 1px solid #909090;
+ }
+
+ div.textbox {
+ width: 270px;
+ min-height: 200px;
+ max-height: 370px;
padding: 10px;
border: 1px solid #999;
position: absolute;
@@ -84,7 +86,7 @@
<div class="legendbox"> <svg class="legendsvg"></svg></div>
<!-- textbox -->
- <div class="textbox" id = "textbox">Click node</div>
+ <div class="textbox" id="textbox">Click node</div>
<!-- reset buttons -->
<!-- <button onclick="javascript:location.reload();">Reload</button>-->
@@ -92,8 +94,8 @@
<button class="resetZoom" onclick="resetZoom()">Reset zoom</button>
<button class="center" onclick="center()">Center</button>
<button class="save" onclick="savesvg()">Save</button>
- <button id="overview" class="overview" onclick='displayabstract(false),highlightbutton("overview")'>Overview</button>
- <button id="abstract" class="abstract" onclick='displayabstract(true),highlightbutton("abstract")'>Abstract</button>
+ <button id="overview" class="overview" onclick='displayabstract(false), highlightbutton("overview")'>Overview</button>
+ <button id="abstract" class="abstract" onclick='displayabstract(true), highlightbutton("abstract")'>Abstract</button>
<!-- link D3 (version 5) -->
--
GitLab