diff --git a/common/config/public/ConfigClass.ts b/common/config/public/ConfigClass.ts
index 436269b..29fc7d1 100644
--- a/common/config/public/ConfigClass.ts
+++ b/common/config/public/ConfigClass.ts
@@ -38,6 +38,7 @@ export module ClientConfig {
 
   export interface MapConfig {
     enabled: boolean;
+    useImageMarkers: boolean;
     mapProvider: MapProviders;
     mapboxAccessToken: string;
     customLayers: MapLayers[];
@@ -128,6 +129,7 @@ export class PublicConfigClass {
     },
     Map: {
       enabled: true,
+      useImageMarkers: true,
       mapProvider: ClientConfig.MapProviders.OpenStreetMap,
       mapboxAccessToken: '',
       customLayers: [{name: 'street', url: ''}]
diff --git a/frontend/app/ui/gallery/map/lightbox/lightbox.map.gallery.component.ts b/frontend/app/ui/gallery/map/lightbox/lightbox.map.gallery.component.ts
index 33d0019..69e9137 100644
--- a/frontend/app/ui/gallery/map/lightbox/lightbox.map.gallery.component.ts
+++ b/frontend/app/ui/gallery/map/lightbox/lightbox.map.gallery.component.ts
@@ -1,4 +1,4 @@
-import {AfterViewInit, Component, ElementRef, HostListener, Input, OnChanges, OnInit, ViewChild} from '@angular/core';
+import {AfterViewInit, Component, ElementRef, HostListener, Input, OnChanges, ViewChild} from '@angular/core';
 import {PhotoDTO} from '../../../../../../common/entities/PhotoDTO';
 import {Dimension} from '../../../../model/IRenderable';
 import {FullScreenService} from '../../fullscreen.service';
@@ -163,16 +163,18 @@ export class GalleryMapLightboxComponent implements OnChanges, AfterViewInit {
         }
 
       };
-      if (iconTh.Available === true) {
-        FixOrientationPipe.transform(iconTh.Src, p.metadata.orientation).then((icon) => {
-          obj.iconUrl = icon;
-        });
-      } else {
-        iconTh.OnLoad = () => {
+      if (Config.Client.Map.useImageMarkers === true) {
+        if (iconTh.Available === true) {
           FixOrientationPipe.transform(iconTh.Src, p.metadata.orientation).then((icon) => {
             obj.iconUrl = icon;
           });
-        };
+        } else {
+          iconTh.OnLoad = () => {
+            FixOrientationPipe.transform(iconTh.Src, p.metadata.orientation).then((icon) => {
+              obj.iconUrl = icon;
+            });
+          };
+        }
       }
       return obj;
     });
diff --git a/frontend/app/ui/settings/map/map.settings.component.html b/frontend/app/ui/settings/map/map.settings.component.html
index ab12392..a5b7352 100644
--- a/frontend/app/ui/settings/map/map.settings.component.html
+++ b/frontend/app/ui/settings/map/map.settings.component.html
@@ -19,74 +19,96 @@
     </h5>
     <div class="card-body">
       <div [hidden]="!error" class="alert alert-danger" role="alert"><strong>Error: </strong>{{error}}</div>
+      <ng-container *ngIf="settings.enabled">
 
-
-      <div class="form-group row">
-        <label class="col-md-2 control-label" for="mapProvider" i18n>Map provider</label>
-        <div class="col-md-10">
-          <select name="mapProvider" id="mapProvider"
-                  [disabled]="!settings.enabled"
-                  class="form-control" [(ngModel)]="settings.mapProvider" required>
-            <option *ngFor="let type of mapProviders" [ngValue]="type.key">{{type.value}}
-            </option>
-          </select>
+        <div class="form-group row" [hidden]="simplifiedMode">
+          <label class="col-md-2 control-label" for="enableOnScrollRendering" i18n>Use image markers</label>
+          <div class="col-md-10">
+            <bSwitch
+              id="enableOnScrollRendering"
+              class="switch"
+              name="enableOnScrollRendering"
+              [switch-on-color]="'primary'"
+              [switch-inverse]="true"
+              [switch-off-text]="text.Disabled"
+              [switch-on-text]="text.Enabled"
+              [switch-handle-width]="100"
+              [switch-label-width]="20"
+              [(ngModel)]="settings.useImageMarkers">
+            </bSwitch>
+            <small class="form-text text-muted" i18n>Map will use thumbnail images as markers instead of the default
+              pin.
+            </small>
+          </div>
         </div>
-      </div>
 
-      <div  class="container custom-layer-container" *ngIf="settings.mapProvider === MapProviders.Custom">
-        <table class="table table-hover">
-          <thead>
-          <tr>
-            <th i18n>Name</th>
-            <th i18n>Tile Url*</th>
-            <th></th>
-          </tr>
-          </thead>
-          <tr *ngFor="let layer of settings.customLayers; let i = index">
-            <td><input type="text" class="form-control" placeholder="Street"
-                       [(ngModel)]="layer.name"
-                       [name]="'tileName-'+i" [id]="'tileName-'+i" required></td>
-            <td>
-              <input type="text" class="form-control" placeholder="http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png"
-                     [(ngModel)]="layer.url"
-                     [name]="'tileUrl-'+i" [id]="'tileUrl-'+i" required>
-            </td>
-            <td>
-              <button [disabled]="settings.customLayers.length == 1" (click)="removeLayer(layer)"
-                      [ngClass]="settings.customLayers.length > 1? 'btn-danger':'btn-secondary'"
-                      class="btn float-right">
-                <span class="oi oi-trash" aria-hidden="true" aria-label="Delete"></span>
-              </button>
-            </td>
-          </tr>
-        </table>
 
-        <div class="row justify-content-end">
-        <small class="form-text text-muted custom-layer-info">
-          <ng-container i18n>*The map module will use these urls to fetch the map tiles.</ng-container>
-        </small>
+        <div class="form-group row">
+          <label class="col-md-2 control-label" for="mapProvider" i18n>Map provider</label>
+          <div class="col-md-10">
+            <select name="mapProvider" id="mapProvider"
+                    [disabled]="!settings.enabled"
+                    class="form-control" [(ngModel)]="settings.mapProvider" required>
+              <option *ngFor="let type of mapProviders" [ngValue]="type.key">{{type.value}}
+              </option>
+            </select>
+          </div>
         </div>
-        <div class="row justify-content-end">
-          <button class="btn btn-primary"
-                  (click)="addNewLayer()" i18n>+ Add Layer
-          </button>
+
+        <div class="container custom-layer-container" *ngIf="settings.mapProvider === MapProviders.Custom">
+          <table class="table table-hover">
+            <thead>
+            <tr>
+              <th i18n>Name</th>
+              <th i18n>Tile Url*</th>
+              <th></th>
+            </tr>
+            </thead>
+            <tr *ngFor="let layer of settings.customLayers; let i = index">
+              <td><input type="text" class="form-control" placeholder="Street"
+                         [(ngModel)]="layer.name"
+                         [name]="'tileName-'+i" [id]="'tileName-'+i" required></td>
+              <td>
+                <input type="text" class="form-control" placeholder="http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png"
+                       [(ngModel)]="layer.url"
+                       [name]="'tileUrl-'+i" [id]="'tileUrl-'+i" required>
+              </td>
+              <td>
+                <button [disabled]="settings.customLayers.length == 1" (click)="removeLayer(layer)"
+                        [ngClass]="settings.customLayers.length > 1? 'btn-danger':'btn-secondary'"
+                        class="btn float-right">
+                  <span class="oi oi-trash" aria-hidden="true" aria-label="Delete"></span>
+                </button>
+              </td>
+            </tr>
+          </table>
+
+          <div class="row justify-content-end">
+            <small class="form-text text-muted custom-layer-info">
+              <ng-container i18n>*The map module will use these urls to fetch the map tiles.</ng-container>
+            </small>
+          </div>
+          <div class="row justify-content-end">
+            <button class="btn btn-primary"
+                    (click)="addNewLayer()" i18n>+ Add Layer
+            </button>
+          </div>
         </div>
-      </div>
 
-      <div class="form-group row" *ngIf="settings.mapProvider === MapProviders.Mapbox">
-        <label class="col-md-2 control-label" for="mapboxAccessToken" i18n>Mapbox access token</label>
-        <div class="col-md-10">
-          <input type="text" class="form-control" placeholder="Mapbox access token"
-                 [(ngModel)]="settings.mapboxAccessToken"
-                 name="mapboxAccessToken" id="mapboxAccessToken" required>
-          <small class="form-text text-muted">
-            <ng-container i18n>MapBox needs an access token to work, create one at</ng-container>
-            &nbsp;<a href="https://www.mapbox.com">https://www.mapbox.com</a>.
-          </small>
+        <div class="form-group row" *ngIf="settings.mapProvider === MapProviders.Mapbox">
+          <label class="col-md-2 control-label" for="mapboxAccessToken" i18n>Mapbox access token</label>
+          <div class="col-md-10">
+            <input type="text" class="form-control" placeholder="Mapbox access token"
+                   [(ngModel)]="settings.mapboxAccessToken"
+                   name="mapboxAccessToken" id="mapboxAccessToken" required>
+            <small class="form-text text-muted">
+              <ng-container i18n>MapBox needs an access token to work, create one at</ng-container>
+              &nbsp;<a href="https://www.mapbox.com">https://www.mapbox.com</a>.
+            </small>
+          </div>
         </div>
-      </div>
-
 
+      </ng-container>
       <button class="btn btn-success float-right"
               [disabled]="!settingsForm.form.valid || !changed || inProgress"
               (click)="save()" i18n>Save
diff --git a/frontend/app/ui/settings/metafiles/metafile.settings.component.html b/frontend/app/ui/settings/metafiles/metafile.settings.component.html
index ebc86e1..5faafd5 100644
--- a/frontend/app/ui/settings/metafiles/metafile.settings.component.html
+++ b/frontend/app/ui/settings/metafiles/metafile.settings.component.html
@@ -7,12 +7,12 @@
           class="switch"
           name="enabled"
           [switch-on-color]="'success'"
-          [switch-inverse]="'inverse'"
+          [switch-inverse]="true"
           [switch-off-text]="text.Disabled"
           [switch-on-text]="text.Enabled"
           [switch-disabled]="inProgress"
-          [switch-handle-width]="'100'"
-          [switch-label-width]="'20'"
+          [switch-handle-width]="100"
+          [switch-label-width]="20"
           [(ngModel)]="settings.enabled">
         </bSwitch>
       </div>
diff --git a/frontend/app/ui/settings/other/other.settings.component.html b/frontend/app/ui/settings/other/other.settings.component.html
index 66deee8..6312bc9 100644
--- a/frontend/app/ui/settings/other/other.settings.component.html
+++ b/frontend/app/ui/settings/other/other.settings.component.html
@@ -16,11 +16,11 @@
             class="switch"
             name="enable"
             [switch-on-color]="'primary'"
-            [switch-inverse]="'inverse'"
+            [switch-inverse]="true"
             [switch-off-text]="text.Disabled"
             [switch-on-text]="text.Enabled"
-            [switch-handle-width]="'100'"
-            [switch-label-width]="'20'"
+            [switch-handle-width]="100"
+            [switch-label-width]="20"
             [(ngModel)]="settings.Server.enable">
           </bSwitch>
           <small class="form-text text-muted" i18n>Runs directory scanning and thumbnail generation (only for Jimp) in a
@@ -52,11 +52,11 @@
             class="switch"
             name="enableOnScrollThumbnailPrioritising"
             [switch-on-color]="'primary'"
-            [switch-inverse]="'inverse'"
+            [switch-inverse]="true"
             [switch-off-text]="text.Disabled"
             [switch-on-text]="text.Enabled"
-            [switch-handle-width]="'100'"
-            [switch-label-width]="'20'"
+            [switch-handle-width]="100"
+            [switch-label-width]="20"
             [(ngModel)]="settings.Client.enableOnScrollThumbnailPrioritising">
           </bSwitch>
           <small class="form-text text-muted" i18n>Those thumbnails get higher priority that are visible on the screen
@@ -72,11 +72,11 @@
             class="switch"
             name="enableOnScrollRendering"
             [switch-on-color]="'primary'"
-            [switch-inverse]="'inverse'"
+            [switch-inverse]="true"
             [switch-off-text]="text.Disabled"
             [switch-on-text]="text.Enabled"
-            [switch-handle-width]="'100'"
-            [switch-label-width]="'20'"
+            [switch-handle-width]="100"
+            [switch-label-width]="20"
             [(ngModel)]="settings.Client.enableOnScrollRendering">
           </bSwitch>
           <small class="form-text text-muted" i18n>Shows only the required amount of photos at once. Renders more if
@@ -94,11 +94,11 @@
             class="switch"
             name="enableCache"
             [switch-on-color]="'primary'"
-            [switch-inverse]="'inverse'"
+            [switch-inverse]="true"
             [switch-off-text]="text.Disabled"
             [switch-on-text]="text.Enabled"
-            [switch-handle-width]="'100'"
-            [switch-label-width]="'20'"
+            [switch-handle-width]="100"
+            [switch-label-width]="20"
             [(ngModel)]="settings.Client.enableCache">
           </bSwitch>
           <small class="form-text text-muted" i18n>Caches directory contents and search results for better performance
@@ -115,11 +115,11 @@
             class="switch"
             name="captionFirstNaming"
             [switch-on-color]="'primary'"
-            [switch-inverse]="'inverse'"
+            [switch-inverse]="true"
             [switch-off-text]="text.Disabled"
             [switch-on-text]="text.Enabled"
-            [switch-handle-width]="'100'"
-            [switch-label-width]="'20'"
+            [switch-handle-width]="100"
+            [switch-label-width]="20"
             [(ngModel)]="settings.Client.captionFirstNaming">
           </bSwitch>
           <small class="form-text text-muted" i18n>Show the caption (IPTC 120) tags from the EXIF data instead of the filenames.
@@ -137,11 +137,11 @@
             class="switch"
             name="showItemCount"
             [switch-on-color]="'primary'"
-            [switch-inverse]="'inverse'"
+            [switch-inverse]="true"
             [switch-off-text]="text.Disabled"
             [switch-on-text]="text.Enabled"
-            [switch-handle-width]="'100'"
-            [switch-label-width]="'20'"
+            [switch-handle-width]="100"
+            [switch-label-width]="20"
             [(ngModel)]="settings.Client.NavBar.showItemCount">
           </bSwitch>
           <small class="form-text text-muted" i18n>Show the number of items (photos) in the folder
diff --git a/frontend/app/ui/settings/random-photo/random-photo.settings.component.html b/frontend/app/ui/settings/random-photo/random-photo.settings.component.html
index ad70e54..dd7cd44 100644
--- a/frontend/app/ui/settings/random-photo/random-photo.settings.component.html
+++ b/frontend/app/ui/settings/random-photo/random-photo.settings.component.html
@@ -8,12 +8,12 @@
           class="switch"
           name="enabled"
           [switch-on-color]="'success'"
-          [switch-inverse]="'inverse'"
+          [switch-inverse]="true"
           [switch-off-text]="text.Disabled"
           [switch-on-text]="text.Enabled"
           [switch-disabled]="inProgress || (!settings.enabled && !_settingsService.isSupported())"
-          [switch-handle-width]="'100'"
-          [switch-label-width]="'20'"
+          [switch-handle-width]="100"
+          [switch-label-width]="20"
           [(ngModel)]="settings.enabled">
         </bSwitch>
       </div>
diff --git a/frontend/app/ui/settings/search/search.settings.component.html b/frontend/app/ui/settings/search/search.settings.component.html
index 2aaaea8..73c9a1b 100644
--- a/frontend/app/ui/settings/search/search.settings.component.html
+++ b/frontend/app/ui/settings/search/search.settings.component.html
@@ -8,12 +8,12 @@
           class="switch"
           name="enabled"
           [switch-on-color]="'success'"
-          [switch-inverse]="'inverse'"
+          [switch-inverse]="true"
           [switch-off-text]="text.Disabled"
           [switch-on-text]="text.Enabled"
           [switch-disabled]="inProgress || (!settings.enabled && !_settingsService.isSupported())"
-          [switch-handle-width]="'100'"
-          [switch-label-width]="'20'"
+          [switch-handle-width]="100"
+          [switch-label-width]="20"
           [(ngModel)]="settings.enabled">
         </bSwitch>
       </div>
@@ -32,11 +32,11 @@
               name="autocompleteEnabled"
               [switch-on-color]="'primary'"
               [switch-disabled]="!settings.enabled"
-              [switch-inverse]="'inverse'"
+              [switch-inverse]="true"
               [switch-off-text]="text.Disabled"
               [switch-on-text]="text.Enabled"
-              [switch-handle-width]="'100'"
-              [switch-label-width]="'20'"
+              [switch-handle-width]="100"
+              [switch-label-width]="20"
               [(ngModel)]="settings.AutoComplete.enabled">
             </bSwitch>
             <small class="form-text text-muted" i18n>Show hints while typing search query</small>
@@ -53,11 +53,11 @@
               name="instantSearchEnabled"
               [switch-on-color]="'primary'"
               [switch-disabled]="!settings.enabled"
-              [switch-inverse]="'inverse'"
+              [switch-inverse]="true"
               [switch-off-text]="text.Disabled"
               [switch-on-text]="text.Enabled"
-              [switch-handle-width]="'100'"
-              [switch-label-width]="'20'"
+              [switch-handle-width]="100"
+              [switch-label-width]="20"
               [(ngModel)]="settings.instantSearchEnabled">
             </bSwitch>
             <small class="form-text text-muted" i18n>Enables showing search results, while typing search query</small>
diff --git a/frontend/app/ui/settings/settings.service.ts b/frontend/app/ui/settings/settings.service.ts
index 1b45e53..57a947d 100644
--- a/frontend/app/ui/settings/settings.service.ts
+++ b/frontend/app/ui/settings/settings.service.ts
@@ -44,6 +44,7 @@ export class SettingsService {
         },
         Map: {
           enabled: true,
+          useImageMarkers: true,
           mapProvider: ClientConfig.MapProviders.OpenStreetMap,
           mapboxAccessToken: '',
           customLayers: [{name: 'street', url: ''}]
diff --git a/frontend/app/ui/settings/share/share.settings.component.html b/frontend/app/ui/settings/share/share.settings.component.html
index e48006d..fe7732e 100644
--- a/frontend/app/ui/settings/share/share.settings.component.html
+++ b/frontend/app/ui/settings/share/share.settings.component.html
@@ -8,12 +8,12 @@
           class="switch"
           name="enabled"
           [switch-on-color]="'success'"
-          [switch-inverse]="'inverse'"
+          [switch-inverse]="true"
           [switch-off-text]="text.Disabled"
           [switch-on-text]="text.Enabled"
           [switch-disabled]="inProgress || (!settings.enabled && !_settingsService.isSupported())"
-          [switch-handle-width]="'100'"
-          [switch-label-width]="'20'"
+          [switch-handle-width]="100"
+          [switch-label-width]="20"
           [(ngModel)]="settings.enabled">
         </bSwitch>
       </div>
@@ -31,11 +31,11 @@
               name="passwordProtected"
               [switch-on-color]="'primary'"
               [switch-disabled]="!settings.enabled"
-              [switch-inverse]="'inverse'"
+              [switch-inverse]="true"
               [switch-off-text]="text.Disabled"
               [switch-on-text]="text.Enabled"
-              [switch-handle-width]="'100'"
-              [switch-label-width]="'20'"
+              [switch-handle-width]="100"
+              [switch-label-width]="20"
               [(ngModel)]="settings.passwordProtected">
             </bSwitch>
             <small class="form-text text-muted" i18n>Enables password protected sharing links</small>
diff --git a/frontend/app/ui/settings/thumbnail/thumbanil.settings.component.html b/frontend/app/ui/settings/thumbnail/thumbanil.settings.component.html
index abc5be7..2c89138 100644
--- a/frontend/app/ui/settings/thumbnail/thumbanil.settings.component.html
+++ b/frontend/app/ui/settings/thumbnail/thumbanil.settings.component.html
@@ -54,11 +54,11 @@
               class="switch"
               name="enabled"
               [switch-on-color]="'primary'"
-              [switch-inverse]="'inverse'"
+              [switch-inverse]="true"
               [switch-off-text]="text.Low"
               [switch-on-text]="text.High"
-              [switch-handle-width]="'100'"
-              [switch-label-width]="'20'"
+              [switch-handle-width]="100"
+              [switch-label-width]="20"
               [(ngModel)]="settings.server.qualityPriority">
             </bSwitch>
             <small class="form-text text-muted" i18n>High quality may be slow. Especially with Jimp.</small>
diff --git a/frontend/app/ui/settings/video/video.settings.component.html b/frontend/app/ui/settings/video/video.settings.component.html
index 2a26f42..d84b659 100644
--- a/frontend/app/ui/settings/video/video.settings.component.html
+++ b/frontend/app/ui/settings/video/video.settings.component.html
@@ -7,12 +7,12 @@
           class="switch"
           name="enabled"
           [switch-on-color]="'success'"
-          [switch-inverse]="'inverse'"
+          [switch-inverse]="true"
           [switch-off-text]="text.Disabled"
           [switch-on-text]="text.Enabled"
           [switch-disabled]="inProgress"
-          [switch-handle-width]="'100'"
-          [switch-label-width]="'20'"
+          [switch-handle-width]="100"
+          [switch-label-width]="20"
           [(ngModel)]="settings.enabled">
         </bSwitch>
       </div>