diff --git a/graph.js b/graph.js
index b33c1b01822a25fa1742c46572ac9cc9acb562b2..d4a0e06f1a1783e7d9fd015d3bef58f1c59950aa 100644
--- a/graph.js
+++ b/graph.js
@@ -7,6 +7,7 @@ let firstTick = true;
 const colorPallette = ['rgb(104, 169, 77)', 'rgb(102, 75, 154)', 'rgb(41, 171, 226)', 'rgb(224, 133, 35)',
     'rgb(214, 207, 126)', 'rgb(239, 65, 35)', 'rgb(255, 255, 255)'];
 const edgeColors = {};
+var graph_element = document.getElementById('3d-graph');
 
 loadGraph();
 
@@ -29,7 +30,7 @@ async function loadGraph() {
         .nodeThreeObject(drawNode)
         .onEngineTick(loadComponents)
         .width(getWidth())
-        .height(969);
+        .height(getHeight());
     //Graph.renderer().sortObjects = true;
 }
 
@@ -43,14 +44,24 @@ function loadComponents() {
         createInfoOverlay();
         add_fullscreen_mode_button();
         add_fullscreen_Listener();
+        window.onresize = resize_graph();
         firstTick = false;
     }
 }
 
+function resize_graph() {
+    Graph.width(getWidth());
+    Graph.height(getHeight());
+}
+
 function getWidth() {
     return document.getElementById('3d-graph').offsetWidth;
 }
 
+function getHeight() {
+    return window.innerHeight - 200
+}
+
 function mapEdgeColors() {
     const linkClasses = getLinkClasses()
     for (let i = 0; i < linkClasses.length; i++) {
@@ -203,10 +214,10 @@ function fullscreen_mode(){
 
 function resize_canvas() {
     if(document.fullscreenElement == getCanvasDivNode()) {
-        Graph.height(getCanvasDivNode().height);
-        Graph.width(getCanvasDivNode().width);
+        Graph.height(screen.height);
+        Graph.width(screen.width);
     } else {
-        Graph.height(969);
+        Graph.height(window.innerHeight - 200);
         Graph.width(getWidth());
     }
 }