--- a/src_js/iconolab-bundle/src/components/editor/Canvas.vue	Mon Feb 20 17:14:08 2017 +0100
+++ b/src_js/iconolab-bundle/src/components/editor/Canvas.vue	Mon Feb 20 17:29:55 2017 +0100
@@ -39,9 +39,15 @@
     import ShapeFree from './ShapeFree.vue'
 
     export default {
-        props: [
-            'image',
-        ],
+        props: {
+            image: String,
+            tooltip: {
+                type: Boolean,
+                default: function () {
+                    return false;
+                }
+            },
+        },
         components: {
             shapeRect: ShapeRect,
             shapeFree: ShapeFree
@@ -75,25 +81,8 @@
                 if (!loaded) { return; }
 
                 if (this.annotation) {
-
-                    var pieces = this.annotation.fragment.split(';');
-                    var path = pieces[0];
-                    var mode = pieces[1].toLowerCase();
-
-                    this.mode = mode;
-
-                    this.$nextTick(() => {
-                        path = this.denormalizePath(path);
-                        if (mode === 'free') {
-                            this.$refs.free.fromSVGPath(path);
-                        }
-                        if (mode === 'rect') {
-                            this.$refs.rect.fromSVGPath(path);
-                        }
-                    });
-
+                    this.loadAnnotation();
                 } else {
-
                     if (this.mode === 'free') {
                         this.handleDrawFree();
                     }
@@ -101,6 +90,11 @@
                         this.handleDrawRect();
                     }
                 }
+            },
+            annotation: function(annotation) {
+                this.reset();
+                if (!this.annotation) { return; }
+                this.loadAnnotation();
             }
         },
         mounted() {
@@ -154,7 +148,17 @@
                 this.$refs.rect.clear();
                 this.$refs.free.clear();
 
-                // Remove event handlers
+                this.removeEventHandlers();
+
+                if (this.mode === 'free') {
+                    this.handleDrawFree();
+                }
+                if (this.mode === 'rect') {
+                    this.handleDrawRect();
+                }
+            },
+
+            removeEventHandlers: function() {
                 this.paper.unmousedown();
                 this.paper.unmousemove();
                 this.paper.unmouseup();
@@ -165,6 +169,26 @@
                 this.annotation = annotation;
             },
 
+            loadAnnotation: function() {
+                if (this.annotation.fragment.length > 0) {
+                    var pieces = this.annotation.fragment.split(';');
+                    var path = pieces[0];
+                    var mode = pieces[1].toLowerCase();
+
+                    this.mode = mode;
+
+                    this.$nextTick(() => {
+                        path = this.denormalizePath(path);
+                        if (mode === 'free') {
+                            this.$refs.free.fromSVGPath(path, this.tooltip);
+                        }
+                        if (mode === 'rect') {
+                            this.$refs.rect.fromSVGPath(path, this.tooltip);
+                        }
+                    });
+                }
+            },
+
             getCenter: function() {
                 return {
                     x: this.viewBox[0] + (this.viewBox[2] / 2),
@@ -301,8 +325,19 @@
                 return path;
             },
 
+            toSVGPath: function() {
+                if (this.mode === 'free') {
+                    this.$refs.free.toSVGPath();
+                }
+                if (this.mode === 'rect') {
+                    this.$refs.rect.toSVGPath();
+                }
+            },
+
             handleDrawFree: function() {
 
+                this.removeEventHandlers();
+
                 var clickTimeout;
 
                 var clickHandler = function (offsetX, offsetY) {
@@ -325,6 +360,8 @@
 
             handleDrawRect: function() {
 
+                this.removeEventHandlers();
+
                 var startPosition = { x: 0, y: 0 };
                 var currentPosition = { x: 0, y: 0 };
                 var canDraw = false;
@@ -429,7 +466,7 @@
 }
 .cut-canvas {
     width: 100%;
-    height: 800px;
+    height: 600px;
 }
 .canvas--rect:hover {
     cursor: crosshair;