diff --git a/src/app/cartography/components/d3-map/d3-map.component.ts b/src/app/cartography/components/d3-map/d3-map.component.ts
index 72da69fe..07c2673e 100644
--- a/src/app/cartography/components/d3-map/d3-map.component.ts
+++ b/src/app/cartography/components/d3-map/d3-map.component.ts
@@ -153,6 +153,10 @@ export class D3MapComponent implements OnInit, OnChanges, OnDestroy {
     });
   }
 
+  public applyMapSettingsChanges() {
+    this.redraw();
+  }
+
   public createGraph(domElement: HTMLElement) {
     const rootElement = select(domElement);
     this.svg = rootElement.select<SVGSVGElement>('svg');
diff --git a/src/app/cartography/widgets/drawing.ts b/src/app/cartography/widgets/drawing.ts
index a3304b12..2f55b8dc 100644
--- a/src/app/cartography/widgets/drawing.ts
+++ b/src/app/cartography/widgets/drawing.ts
@@ -13,6 +13,7 @@ import { SelectionManager } from '../managers/selection-manager';
 import { LineElement } from '../models/drawings/line-element';
 import { EllipseElement } from '../models/drawings/ellipse-element';
 import { RectElement } from '../models/drawings/rect-element';
+import { MapSettingsService } from '../../services/mapsettings.service';
 
 @Injectable()
 export class DrawingWidget implements Widget {
@@ -24,7 +25,8 @@ export class DrawingWidget implements Widget {
     private rectDrawingWidget: RectDrawingWidget,
     private lineDrawingWidget: LineDrawingWidget,
     private ellipseDrawingWidget: EllipseDrawingWidget,
-    private selectionManager: SelectionManager
+    private selectionManager: SelectionManager,
+    private mapSettingsService: MapSettingsService
   ) {
     this.drawingWidgets = [
       this.textDrawingWidget,
@@ -52,36 +54,40 @@ export class DrawingWidget implements Widget {
     });
 
     drawing_body_merge.select('.layer_label_wrapper').remove();
-    drawing_body_merge
-      .filter(n => ((n.element instanceof RectElement) || (n.element instanceof EllipseElement)))
-      .append<SVGRectElement>('rect')
-      .attr('class', 'layer_label_wrapper')
-      .attr('width', '26')
-      .attr('height', '26')
-      .attr('x', n => n.element ? n.element.width/2 - 13 : 0)
-      .attr('y', n => n.element ? n.element.height/2 - 13 : 0)
-      .attr('fill', 'red');
+    if (this.mapSettingsService.isLayerNumberVisible) {
+      drawing_body_merge
+        .filter(n => ((n.element instanceof RectElement) || (n.element instanceof EllipseElement)))
+        .append<SVGRectElement>('rect')
+        .attr('class', 'layer_label_wrapper')
+        .attr('width', '26')
+        .attr('height', '26')
+        .attr('x', n => n.element ? n.element.width/2 - 13 : 0)
+        .attr('y', n => n.element ? n.element.height/2 - 13 : 0)
+        .attr('fill', 'red');
+    }
 
     drawing_body_merge.select('.layer_label').remove();
-    drawing_body_merge
-      .filter(n => ((n.element instanceof RectElement) || (n.element instanceof EllipseElement)))
-      .append<SVGTextElement>('text')
-      .attr('class', 'layer_label')
-      .text((elem) => elem.z)
-      .attr('x', function(n) {
-        if(n.z >= 100 ) return n.element ? n.element.width/2 - 13 : 0
-        else if(n.z >= 10 ) return n.element ? n.element.width/2 - 9 : 0
-        else return n.element.width/2 - 5
-      })
-      .attr('y', n => n.element ? n.element.height/2 + 5 : 0)
-      .attr('style', () => {
-        const styles: string[] = [];
-        styles.push(`font-family: "Noto Sans"`);
-        styles.push(`font-size: 11pt`);
-        styles.push(`font-weight: bold`);
-        return styles.join('; ');
-      })
-      .attr('fill', `#ffffff`);
+    if (this.mapSettingsService.isLayerNumberVisible) {
+      drawing_body_merge
+        .filter(n => ((n.element instanceof RectElement) || (n.element instanceof EllipseElement)))
+        .append<SVGTextElement>('text')
+        .attr('class', 'layer_label')
+        .text((elem) => elem.z)
+        .attr('x', function(n) {
+          if(n.z >= 100 ) return n.element ? n.element.width/2 - 13 : 0
+          else if(n.z >= 10 ) return n.element ? n.element.width/2 - 9 : 0
+          else return n.element.width/2 - 5
+        })
+        .attr('y', n => n.element ? n.element.height/2 + 5 : 0)
+        .attr('style', () => {
+          const styles: string[] = [];
+          styles.push(`font-family: "Noto Sans"`);
+          styles.push(`font-size: 11pt`);
+          styles.push(`font-weight: bold`);
+          return styles.join('; ');
+        })
+        .attr('fill', `#ffffff`);
+    }
 
     drawing_body_merge
       .select<SVGAElement>('line.top')
diff --git a/src/app/cartography/widgets/node.ts b/src/app/cartography/widgets/node.ts
index a5d708f3..dc41df38 100644
--- a/src/app/cartography/widgets/node.ts
+++ b/src/app/cartography/widgets/node.ts
@@ -10,6 +10,7 @@ import { SelectionManager } from '../managers/selection-manager';
 import { LabelWidget } from './label';
 import { NodesEventSource } from '../events/nodes-event-source';
 import { ClickedDataEvent } from '../events/event-source';
+import { MapSettingsService } from '../../services/mapsettings.service';
 
 @Injectable()
 export class NodeWidget implements Widget {
@@ -20,7 +21,8 @@ export class NodeWidget implements Widget {
     private graphDataManager: GraphDataManager,
     private selectionManager: SelectionManager,
     private labelWidget: LabelWidget,
-    private nodesEventSource: NodesEventSource
+    private nodesEventSource: NodesEventSource,
+    private mapSettingsService: MapSettingsService
   ) {}
 
   public draw(view: SVGSelection) {
@@ -43,34 +45,38 @@ export class NodeWidget implements Widget {
       });
 
     node_body_merge.select('.layer_label_wrapper').remove();
-    node_body_merge
-      .append<SVGRectElement>('rect')
-      .attr('class', 'layer_label_wrapper')
-      .attr('width', '26')
-      .attr('height', '26')
-      .attr('x', (n: MapNode) => n.width/2 - 13)
-      .attr('y', (n: MapNode) => n.height/2 - 13)
-      .attr('fill', 'red');
+    if (this.mapSettingsService.isLayerNumberVisible) {
+      node_body_merge
+        .append<SVGRectElement>('rect')
+        .attr('class', 'layer_label_wrapper')
+        .attr('width', '26')
+        .attr('height', '26')
+        .attr('x', (n: MapNode) => n.width/2 - 13)
+        .attr('y', (n: MapNode) => n.height/2 - 13)
+        .attr('fill', 'red');
+    }
 
     node_body_merge.select('.layer_label').remove();
-    node_body_merge
-      .append<SVGTextElement>('text')
-      .attr('class', 'layer_label')
-      .text((n: MapNode) => { return n.z})
-      .attr('x', function(n: MapNode) {
-        if(n.z >= 100 ) return n.width/2 - 13
-        else if(n.z >= 10 ) return n.width/2 - 9
-        else return n.width/2 - 5
-      })
-      .attr('y', (n: MapNode) => n.height/2 + 5)
-      .attr('style', () => {
-        const styles: string[] = [];
-        styles.push(`font-family: "Noto Sans"`);
-        styles.push(`font-size: 11pt`);
-        styles.push(`font-weight: bold`);
-        return styles.join('; ');
-      })
-      .attr('fill', `#ffffff`);
+    if (this.mapSettingsService.isLayerNumberVisible) {
+      node_body_merge
+        .append<SVGTextElement>('text')
+        .attr('class', 'layer_label')
+        .text((n: MapNode) => { return n.z})
+        .attr('x', function(n: MapNode) {
+          if(n.z >= 100 ) return n.width/2 - 13
+          else if(n.z >= 10 ) return n.width/2 - 9
+          else return n.width/2 - 5
+        })
+        .attr('y', (n: MapNode) => n.height/2 + 5)
+        .attr('style', () => {
+          const styles: string[] = [];
+          styles.push(`font-family: "Noto Sans"`);
+          styles.push(`font-size: 11pt`);
+          styles.push(`font-weight: bold`);
+          return styles.join('; ');
+        })
+        .attr('fill', `#ffffff`);
+    }
 
     // update image of node
     node_body_merge
diff --git a/src/app/components/project-map/project-map.component.html b/src/app/components/project-map/project-map.component.html
index 4e640dcb..3c5a1257 100644
--- a/src/app/components/project-map/project-map.component.html
+++ b/src/app/components/project-map/project-map.component.html
@@ -90,6 +90,9 @@
           <mat-checkbox [ngModel]="notificationsVisibility" (change)="toggleNotifications($event.checked)">
             Show notifications
           </mat-checkbox>
+          <mat-checkbox [ngModel]="layersVisibility" (change)="toggleLayers($event.checked)">
+            Show layers
+          </mat-checkbox>
         </div>
       </mat-menu>
 
diff --git a/src/app/components/project-map/project-map.component.ts b/src/app/components/project-map/project-map.component.ts
index 1894e0c2..ac7a350d 100644
--- a/src/app/components/project-map/project-map.component.ts
+++ b/src/app/components/project-map/project-map.component.ts
@@ -83,6 +83,7 @@ export class ProjectMapComponent implements OnInit, OnDestroy {
   public isTopologySummaryVisible: boolean = false;
   public isInterfaceLabelVisible: boolean = false;
   public notificationsVisibility: boolean = false;
+  public layersVisibility: boolean = false;
 
   tools = {
     selection: true,
@@ -238,6 +239,7 @@ export class ProjectMapComponent implements OnInit, OnDestroy {
     }));
 
     this.notificationsVisibility = localStorage.getItem('notificationsVisibility') === 'true' ? true : false;
+    this.layersVisibility = localStorage.getItem('layersVisibility') === 'true' ? true : false;
     this.addKeyboardListeners();
   }
 
@@ -479,6 +481,17 @@ export class ProjectMapComponent implements OnInit, OnDestroy {
     }
   }
 
+  public toggleLayers(visible: boolean) {
+    this.layersVisibility = visible;
+    this.mapSettingsService.toggleLayers(visible);
+    if (this.layersVisibility) {
+      localStorage.setItem('layersVisibility', 'true');
+    } else {
+      localStorage.removeItem('layersVisibility')
+    }
+    this.mapChild.applyMapSettingsChanges();
+  }
+
   private showMessage(msg) {
     if (this.notificationsVisibility) {
       if (msg.type === 'error') this.toasterService.error(msg.message);
diff --git a/src/app/services/mapsettings.service.ts b/src/app/services/mapsettings.service.ts
index ec9f8e54..2c14f21d 100644
--- a/src/app/services/mapsettings.service.ts
+++ b/src/app/services/mapsettings.service.ts
@@ -6,9 +6,12 @@ export class MapSettingsService {
     public isMapLocked = new Subject<boolean>();
     public isTopologySummaryVisible: boolean = false;
     public isLogConsoleVisible: boolean = false;
+    public isLayerNumberVisible: boolean = false;
     public interfaceLabels: Map<string, boolean> = new Map<string, boolean>();
 
-    constructor() {}
+    constructor() {
+        this.isLayerNumberVisible = localStorage.getItem('layersVisibility') === 'true' ? true : false;
+    }
 
     changeMapLockValue(value: boolean) {
         this.isMapLocked.next(value);
@@ -22,6 +25,10 @@ export class MapSettingsService {
         this.isLogConsoleVisible = value;
     }
 
+    toggleLayers(value: boolean) {
+        this.isLayerNumberVisible = value;
+    }
+
     toggleShowInterfaceLabels(projectId: string, value: boolean) {
         this.interfaceLabels.set(projectId, value);
     }