diff --git a/LICENSE b/LICENSE
new file mode 100644
index 0000000..a86360f
--- /dev/null
+++ b/LICENSE
@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2018 iVis@Bilkent
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.
diff --git a/README.md b/README.md
index 6301038..e30ecbf 100644
--- a/README.md
+++ b/README.md
@@ -3,7 +3,9 @@ cytoscape-grid-guide
 
 ## Description
 
-<img src="guideline-example.png" width="300">
+| Guideline example | Grid example |
+| ------------- | ------------- |
+|<img src="guideline-example.png" width="300"> | <img src="grid-example.png" width="300">|
 
 A sophisticated and highly customizable Cytoscape.js extension for grid and guideline interactions, distributed under [The MIT License](https://opensource.org/licenses/MIT). The following features are provided:
 
diff --git a/cytoscape-grid-guide.js b/cytoscape-grid-guide.js
index c85c679..5d9acc2 100644
--- a/cytoscape-grid-guide.js
+++ b/cytoscape-grid-guide.js
@@ -1,4 +1,4 @@
-(function e(t,n,r){function s(o,u){if(!n[o]){if(!t[o]){var a=typeof require=="function"&&require;if(!u&&a)return a(o,!0);if(i)return i(o,!0);var f=new Error("Cannot find module '"+o+"'");throw f.code="MODULE_NOT_FOUND",f}var l=n[o]={exports:{}};t[o][0].call(l.exports,function(e){var n=t[o][1][e];return s(n?n:e)},l,l.exports,e,t,n,r)}return n[o].exports}var i=typeof require=="function"&&require;for(var o=0;o<r.length;o++)s(r[o]);return s})({1:[function(require,module,exports){
+(function(){function r(e,n,t){function o(i,f){if(!n[i]){if(!e[i]){var c="function"==typeof require&&require;if(!f&&c)return c(i,!0);if(u)return u(i,!0);var a=new Error("Cannot find module '"+i+"'");throw a.code="MODULE_NOT_FOUND",a}var p=n[i]={exports:{}};e[i][0].call(p.exports,function(r){var n=e[i][1][r];return o(n||r)},p,p.exports,r,e,n,t)}return n[i].exports}for(var u="function"==typeof require&&require,i=0;i<t.length;i++)o(t[i]);return o}return r})()({1:[function(require,module,exports){
 "use strict"
 
 module.exports = createRBTree
@@ -1405,6 +1405,20 @@ module.exports = function (opts, cy, $, debounce) {
     var ctx = $canvas[ 0 ].getContext( '2d' );
     $container.append( $canvas );
 
+    var resetCanvas = function () {
+        $canvas
+            .attr('height', 0)
+            .attr('width', 0)
+            .css( {
+                'position': 'absolute',
+                'top': 0,
+                'left': 0,
+                'z-index': options.gridStackOrder
+            });
+    };
+
+    resetCanvas();
+
     var drawGrid = function() {
         var zoom = cy.zoom();
         var canvasWidth = $container.width();
@@ -1481,6 +1495,7 @@ module.exports = function (opts, cy, $, debounce) {
     return {
         initCanvas: resizeCanvas,
         resizeCanvas: resizeCanvas,
+        resetCanvas: resetCanvas,
         clearCanvas: clearDrawing,
         drawGrid: drawGrid,
         changeOptions: changeOptions,
@@ -1587,13 +1602,13 @@ module.exports = function (cy, snap, resize, snapToGridDuringDrag, drawGrid, gui
 	function setDrawGrid(enable) {
 		cy[eventStatus(enable)]('zoom', drawGridOnZoom);
 		cy[eventStatus(enable)]('pan', drawGridOnPan);
-		cy[eventStatus(enable)]('ready', drawGrid.resizeCanvas);
 
 		if (enable) {
 			drawGrid.initCanvas();
 			$(window).on('resize', drawGrid.resizeCanvas);
 		} else {
 			drawGrid.clearCanvas();
+			drawGrid.resetCanvas();
 			$(window).off('resize', drawGrid.resizeCanvas);
 		}
 	}
@@ -1649,6 +1664,7 @@ module.exports = function (cy, snap, resize, snapToGridDuringDrag, drawGrid, gui
 			cy.off("pan", guidelinesPanHandler);
 			cy.off("drag", "node", guidelinesDragHandler);
 			cy.off("free", guidelinesFreeHandler);
+			guidelines.resetCanvas();
 			$(window).off("resize", guidelinesWindowResizeHandler);
 		}
 	}
@@ -1794,7 +1810,20 @@ module.exports = function (opts, cy, $, debounce) {
 	var $container = $(cy.container());
 	var ctx = $canvas[0].getContext('2d');
 	$container.append($canvas);
-	resizeCanvas();
+
+	var resetCanvas = function () {
+		$canvas
+			.attr('height', 0)
+			.attr('width', 0)
+			.css( {
+				'position': 'absolute',
+				'top': 0,
+				'left': 0,
+				'z-index': options.gridStackOrder
+			});
+	};
+
+	resetCanvas();
 
 	/* Global variables */
 	var VTree = null;
@@ -2737,6 +2766,7 @@ module.exports = function (opts, cy, $, debounce) {
 		getMousePos: getMousePos,
 		setMousePos: setMousePos,
 		resizeCanvas: resizeCanvas,
+		resetCanvas: resetCanvas,
 	}
 };
 
diff --git a/grid-example.png b/grid-example.png
new file mode 100644
index 0000000..c438dcf
Binary files /dev/null and b/grid-example.png differ
diff --git a/guideline-example.png b/guideline-example.png
index f6bd675..d0bb989 100644
Binary files a/guideline-example.png and b/guideline-example.png differ
diff --git a/src/draw_grid.js b/src/draw_grid.js
index 238736e..1ffd3f4 100644
--- a/src/draw_grid.js
+++ b/src/draw_grid.js
@@ -12,6 +12,20 @@ module.exports = function (opts, cy, $, debounce) {
     var ctx = $canvas[ 0 ].getContext( '2d' );
     $container.append( $canvas );
 
+    var resetCanvas = function () {
+        $canvas
+            .attr('height', 0)
+            .attr('width', 0)
+            .css( {
+                'position': 'absolute',
+                'top': 0,
+                'left': 0,
+                'z-index': options.gridStackOrder
+            });
+    };
+
+    resetCanvas();
+
     var drawGrid = function() {
         var zoom = cy.zoom();
         var canvasWidth = $container.width();
@@ -88,6 +102,7 @@ module.exports = function (opts, cy, $, debounce) {
     return {
         initCanvas: resizeCanvas,
         resizeCanvas: resizeCanvas,
+        resetCanvas: resetCanvas,
         clearCanvas: clearDrawing,
         drawGrid: drawGrid,
         changeOptions: changeOptions,
diff --git a/src/events_controller.js b/src/events_controller.js
index f1a07af..5280e0c 100644
--- a/src/events_controller.js
+++ b/src/events_controller.js
@@ -96,13 +96,13 @@ module.exports = function (cy, snap, resize, snapToGridDuringDrag, drawGrid, gui
 	function setDrawGrid(enable) {
 		cy[eventStatus(enable)]('zoom', drawGridOnZoom);
 		cy[eventStatus(enable)]('pan', drawGridOnPan);
-		cy[eventStatus(enable)]('ready', drawGrid.resizeCanvas);
 
 		if (enable) {
 			drawGrid.initCanvas();
 			$(window).on('resize', drawGrid.resizeCanvas);
 		} else {
 			drawGrid.clearCanvas();
+			drawGrid.resetCanvas();
 			$(window).off('resize', drawGrid.resizeCanvas);
 		}
 	}
@@ -158,6 +158,7 @@ module.exports = function (cy, snap, resize, snapToGridDuringDrag, drawGrid, gui
 			cy.off("pan", guidelinesPanHandler);
 			cy.off("drag", "node", guidelinesDragHandler);
 			cy.off("free", guidelinesFreeHandler);
+			guidelines.resetCanvas();
 			$(window).off("resize", guidelinesWindowResizeHandler);
 		}
 	}
diff --git a/src/guidelines.js b/src/guidelines.js
index 1d03c67..6aadf85 100644
--- a/src/guidelines.js
+++ b/src/guidelines.js
@@ -60,7 +60,20 @@ module.exports = function (opts, cy, $, debounce) {
 	var $container = $(cy.container());
 	var ctx = $canvas[0].getContext('2d');
 	$container.append($canvas);
-	resizeCanvas();
+
+	var resetCanvas = function () {
+		$canvas
+			.attr('height', 0)
+			.attr('width', 0)
+			.css( {
+				'position': 'absolute',
+				'top': 0,
+				'left': 0,
+				'z-index': options.gridStackOrder
+			});
+	};
+
+	resetCanvas();
 
 	/* Global variables */
 	var VTree = null;
@@ -1003,5 +1016,6 @@ module.exports = function (opts, cy, $, debounce) {
 		getMousePos: getMousePos,
 		setMousePos: setMousePos,
 		resizeCanvas: resizeCanvas,
+		resetCanvas: resetCanvas,
 	}
 };