diff --git a/docs/.vuepress/components/Playground.vue b/docs/.vuepress/components/Playground.vue
index 0e6bb537c..ae14e945e 100644
--- a/docs/.vuepress/components/Playground.vue
+++ b/docs/.vuepress/components/Playground.vue
@@ -297,16 +297,24 @@
             </div>
 
             <div class="md-layout md-gutter" v-if="markerForm.type === 'image' || markerForm.type === 'imageLayer'">
-              <md-button class="md-icon-button md-raised" style="margin: 15px 0 0 20px;"
-                         v-bind:class="{'md-primary': markerForm[markerForm.type] === PIN_RED_URL }"
-                         v-on:click="markerForm[markerForm.type] = PIN_RED_URL">
+              <md-button v-if="markerForm.type === 'image'"
+                         class="md-icon-button md-raised" style="margin: 15px 0 0 20px;"
+                         v-bind:class="{'md-primary': markerForm.image === PIN_RED_URL }"
+                         v-on:click="markerForm.image = PIN_RED_URL">
                 <img v-bind:src="PIN_RED_URL" width="32px">
               </md-button>
-              <md-button class="md-icon-button md-raised" style="margin: 15px 0 0 15px;"
+              <md-button v-if="markerForm.type === 'image'"
+                         class="md-icon-button md-raised" style="margin: 15px 0 0 15px;"
                          v-bind:class="{'md-primary': markerForm[markerForm.type] === PIN_BLUE_URL }"
                          v-on:click="markerForm[markerForm.type] = PIN_BLUE_URL">
                 <img v-bind:src="PIN_BLUE_URL" width="32px">
               </md-button>
+              <md-button v-if="markerForm.type === 'imageLayer'"
+                         class="md-icon-button md-raised" style="margin: 15px 0 0 15px;"
+                         v-bind:class="{'md-primary': markerForm.imageLayer === TARGET_URL }"
+                         v-on:click="markerForm.imageLayer = TARGET_URL">
+                <img v-bind:src="TARGET_URL" width="32px">
+              </md-button>
               <div class="md-layout-item">
                 <md-field>
                   <label>Image URL</label>
@@ -342,14 +350,14 @@
             </div>
 
             <div class="md-layout md-gutter" v-if="markerForm.type === 'image' || markerForm.type === 'imageLayer' || markerForm.type === 'html'">
-              <div class="md-layout-item md-size-33">
+              <div class="md-layout-item md-size-25">
                 <md-field>
                   <label>Width</label>
                   <md-input type="number" min="0" step="1" v-model="markerForm.width"
                             :required="markerForm.type === 'image' || markerForm.type === 'imageLayer'"/>
                 </md-field>
               </div>
-              <div class="md-layout-item md-size-33">
+              <div class="md-layout-item md-size-25">
                 <md-field>
                   <label>Height</label>
                   <md-input type="number" min="0" step="1" v-model="markerForm.height"
@@ -357,7 +365,19 @@
                 </md-field>
               </div>
 
-              <div class="md-layout-item md-size-33">
+              <div class="md-layout-item md-size-25" v-if="markerForm.type === 'imageLayer'">
+                <md-field>
+                  <label>Orientation</label>
+                  <md-select v-model="markerForm.orientation">
+                    <md-option value="front">front</md-option>
+                    <md-option value="horizontal">horizontal</md-option>
+                    <md-option value="vertical-left">vertical-left</md-option>
+                    <md-option value="vertical-right">vertical-tight</md-option>
+                  </md-select>
+                </md-field>
+              </div>
+
+              <div class="md-layout-item md-size-25">
                 <md-field>
                   <label>Anchor</label>
                   <md-select v-model="markerForm.anchor">
@@ -376,14 +396,14 @@
             </div>
 
             <div class="md-layout md-gutter">
-              <div class="md-layout-item md-size-66">
+              <div class="md-layout-item md-size-75">
                 <md-field>
                   <label>Tooltip content</label>
                   <md-input type="text" v-model="markerForm.tooltip.content"/>
                 </md-field>
               </div>
 
-              <div class="md-layout-item md-size-33">
+              <div class="md-layout-item md-size-25">
                 <md-field>
                   <label>Tooltip position</label>
                   <md-select v-model="markerForm.tooltip.position">
@@ -547,6 +567,7 @@
         polylineRad: null,
         width      : null,
         height     : null,
+        orientation: null,
         anchor     : null,
         listContent: null,
         content    : null,
@@ -575,6 +596,7 @@
       this.CLIPBOARD_AVAILABLE = false; // SSR rendering dissallow "window" usage here
       this.PIN_RED_URL = 'https://photo-sphere-viewer.js.org/assets/pin-red.png';
       this.PIN_BLUE_URL = 'https://photo-sphere-viewer.js.org/assets/pin-blue.png';
+      this.TARGET_URL = 'https://photo-sphere-viewer.js.org/assets/target.png';
       this.FONT_SIZES = range(10, 31).map(i => `${i}px`);
       this.FONT_SIZES_2 = range(10, 31, 5).map(i => `${i}px`);
     },
@@ -734,6 +756,7 @@
         this.cancelMarker();
         this.markerForm.id = 'marker-' + Math.random().toString(36).slice(2);
         this.markerForm.type = type;
+        this.markerForm.orientation = 'front';
         this.markerForm.anchor = 'center center';
         this.markerForm.tooltip.position = 'top center';
 
@@ -745,10 +768,9 @@
             this.markerForm.anchor = 'bottom center';
             break;
           case 'imageLayer':
-            this.markerForm.imageLayer = this.PIN_RED_URL;
-            this.markerForm.width = 48;
-            this.markerForm.height = 48;
-            this.markerForm.anchor = 'bottom center';
+            this.markerForm.imageLayer = this.TARGET_URL;
+            this.markerForm.width = 120;
+            this.markerForm.height = 120;
             break;
           case 'html':
             this.markerForm.html = 'Test content';
@@ -958,6 +980,12 @@
             if (marker.config.height) {
               m.height = marker.config.height;
             }
+            if (marker.config.anchor !== 'center center') {
+              m.anchor = marker.config.anchor;
+            }
+            if (marker.config.orientation !== 'front') {
+              m.orientation = marker.config.orientation;
+            }
             if (marker.config.tooltip.content) {
               m.tooltip = marker.config.tooltip;
             }