diff --git a/src/app/cartography/shared/widgets/drawings.ts b/src/app/cartography/shared/widgets/drawings.ts
index 62004fa1..a2a43e24 100644
--- a/src/app/cartography/shared/widgets/drawings.ts
+++ b/src/app/cartography/shared/widgets/drawings.ts
@@ -8,10 +8,15 @@ import { ImageDrawingWidget } from "./drawings/image-drawing";
 import { RectDrawingWidget } from "./drawings/rect-drawing";
 import { LineDrawingWidget } from "./drawings/line-drawing";
 import { EllipseDrawingWidget } from "./drawings/ellipse-drawing";
+import { DrawingWidget } from "./drawings/drawing-widget";
 
 
 export class DrawingsWidget implements Widget {
   private svgToDrawingConverter: SvgToDrawingConverter;
+  private drawingWidgets: DrawingWidget[] = [
+    new TextDrawingWidget(), new ImageDrawingWidget(), new RectDrawingWidget(),
+    new LineDrawingWidget(), new EllipseDrawingWidget()
+  ];
 
   constructor() {
     this.svgToDrawingConverter = new SvgToDrawingConverter();
@@ -42,20 +47,9 @@ export class DrawingsWidget implements Widget {
         return `translate(${d.x},${d.y})`;
       });
 
-    const text_drawing = new TextDrawingWidget();
-    text_drawing.draw(drawing_merge);
-
-    const image_drawing = new ImageDrawingWidget();
-    image_drawing.draw(drawing_merge);
-
-    const rect_drawing = new RectDrawingWidget();
-    rect_drawing.draw(drawing_merge);
-
-    const line_drawing = new LineDrawingWidget();
-    line_drawing.draw(drawing_merge);
-
-    const ellipse_drawing = new EllipseDrawingWidget();
-    ellipse_drawing.draw(drawing_merge);
+    this.drawingWidgets.forEach((widget) => {
+      widget.draw(drawing_merge);
+    });
 
     drawing
       .exit()
diff --git a/src/app/cartography/shared/widgets/drawings/drawing-widget.ts b/src/app/cartography/shared/widgets/drawings/drawing-widget.ts
new file mode 100644
index 00000000..2e950eee
--- /dev/null
+++ b/src/app/cartography/shared/widgets/drawings/drawing-widget.ts
@@ -0,0 +1,5 @@
+import { SVGSelection } from "../../models/types";
+
+export interface DrawingWidget {
+  draw(view: SVGSelection);
+}
diff --git a/src/app/cartography/shared/widgets/drawings/ellipse-drawing.ts b/src/app/cartography/shared/widgets/drawings/ellipse-drawing.ts
index aca1b342..bfabb479 100644
--- a/src/app/cartography/shared/widgets/drawings/ellipse-drawing.ts
+++ b/src/app/cartography/shared/widgets/drawings/ellipse-drawing.ts
@@ -1,9 +1,10 @@
 import { SVGSelection } from "../../models/types";
 import { Drawing } from "../../models/drawing";
 import { EllipseElement } from "../../models/drawings/ellipse-element";
+import { DrawingWidget } from "./drawing-widget";
 
 
-export class EllipseDrawingWidget {
+export class EllipseDrawingWidget implements DrawingWidget {
   public draw(view: SVGSelection) {
     const drawing = view
       .selectAll<SVGEllipseElement, EllipseElement>('ellipse.ellipse_element')
diff --git a/src/app/cartography/shared/widgets/drawings/image-drawing.ts b/src/app/cartography/shared/widgets/drawings/image-drawing.ts
index cbf8dfd0..755d74c2 100644
--- a/src/app/cartography/shared/widgets/drawings/image-drawing.ts
+++ b/src/app/cartography/shared/widgets/drawings/image-drawing.ts
@@ -1,9 +1,10 @@
 import { SVGSelection } from "../../models/types";
 import { Drawing } from "../../models/drawing";
 import { ImageElement } from "../../models/drawings/image-element";
+import { DrawingWidget } from "./drawing-widget";
 
 
-export class ImageDrawingWidget {
+export class ImageDrawingWidget implements DrawingWidget {
   public draw(view: SVGSelection) {
     const drawing = view
       .selectAll<SVGImageElement, ImageElement>('image.image_element')
diff --git a/src/app/cartography/shared/widgets/drawings/line-drawing.ts b/src/app/cartography/shared/widgets/drawings/line-drawing.ts
index 6992eccd..0fef6087 100644
--- a/src/app/cartography/shared/widgets/drawings/line-drawing.ts
+++ b/src/app/cartography/shared/widgets/drawings/line-drawing.ts
@@ -1,9 +1,10 @@
 import { SVGSelection } from "../../models/types";
 import { Drawing } from "../../models/drawing";
 import { LineElement } from "../../models/drawings/line-element";
+import { DrawingWidget } from "./drawing-widget";
 
 
-export class LineDrawingWidget {
+export class LineDrawingWidget implements DrawingWidget {
   public draw(view: SVGSelection) {
     const drawing = view
       .selectAll<SVGLineElement, LineElement>('line.line_element')
diff --git a/src/app/cartography/shared/widgets/drawings/rect-drawing.ts b/src/app/cartography/shared/widgets/drawings/rect-drawing.ts
index 968a90be..83f86746 100644
--- a/src/app/cartography/shared/widgets/drawings/rect-drawing.ts
+++ b/src/app/cartography/shared/widgets/drawings/rect-drawing.ts
@@ -1,9 +1,10 @@
 import { SVGSelection } from "../../models/types";
 import { Drawing } from "../../models/drawing";
 import { RectElement } from "../../models/drawings/rect-element";
+import { DrawingWidget } from "./drawing-widget";
 
 
-export class RectDrawingWidget {
+export class RectDrawingWidget implements DrawingWidget {
   public draw(view: SVGSelection) {
     const drawing = view
       .selectAll<SVGRectElement, RectElement>('rect.rect_element')
diff --git a/src/app/cartography/shared/widgets/drawings/text-drawing.ts b/src/app/cartography/shared/widgets/drawings/text-drawing.ts
index 51791e39..927470c2 100644
--- a/src/app/cartography/shared/widgets/drawings/text-drawing.ts
+++ b/src/app/cartography/shared/widgets/drawings/text-drawing.ts
@@ -1,9 +1,10 @@
 import { SVGSelection } from "../../models/types";
 import { TextElement } from "../../models/drawings/text-element";
 import { Drawing } from "../../models/drawing";
+import { DrawingWidget } from "./drawing-widget";
 
 
-export class TextDrawingWidget {
+export class TextDrawingWidget implements DrawingWidget {
   public draw(view: SVGSelection) {
     const drawing = view
       .selectAll<SVGTextElement, TextElement>('text.text_element')