From 973b3405ef3ff54809e110f6a6c09fc2e54ed9fe Mon Sep 17 00:00:00 2001
From: GRL <g.lesniewski@thecodingmachine.com>
Date: Mon, 10 May 2021 15:10:11 +0200
Subject: [PATCH] documentation of show/hide layer

---
 docs/maps/api-reference.md | 29 +++++++++++++++++++++++++++++
 maps/tests/iframe.html     | 10 +++++-----
 2 files changed, 34 insertions(+), 5 deletions(-)

diff --git a/docs/maps/api-reference.md b/docs/maps/api-reference.md
index 9891a88a..3a893474 100644
--- a/docs/maps/api-reference.md
+++ b/docs/maps/api-reference.md
@@ -235,3 +235,32 @@ mySound.play(config);
 // ...
 mySound.stop();
 ```
+
+### Show / Hide a layer 
+
+```
+WA.showLayer(layerName : string): void
+WA.hideLayer(layerName : string) : void
+```
+These 2 methods can be used to show and hide a layer.
+
+Example :
+
+```javascript
+<div>
+    <label for="show/hideBottom">See bottom : </label>
+    <input type="checkbox" id="show/hideBottom" name="visible" value="show" checked>
+</div>
+<script>
+    document.getElementById('show/hideLayer').onclick = () => {
+        if (document.getElementById('show/hideBottom').checked) {
+            WA.showLayer('bottom');
+        }
+        else {
+            WA.hideLayer('bottom');
+        }
+    }
+</script>
+```
+
+
diff --git a/maps/tests/iframe.html b/maps/tests/iframe.html
index 116bbfd9..c5c30972 100644
--- a/maps/tests/iframe.html
+++ b/maps/tests/iframe.html
@@ -19,15 +19,15 @@
             }));
         </script>
         <div>
-            <label for="visibilityLayer">Metadata Layer</label><input type="checkbox" id="visibilityLayer" name="visible" value="show" checked>
+            <label for="show/hideLayer">Layer Name : </label><input type="checkbox" id="show/hideLayer" name="visible" value="show" checked>
         </div>
         <script>
-            document.getElementById('visibilityLayer').onclick = () => {
-                if (document.getElementById('visibilityLayer').checked) {
-                    WA.showLayer('Metadata');
+            document.getElementById('show/hideLayer').onclick = () => {
+                if (document.getElementById('show/hideLayer').checked) {
+                    WA.showLayer('LayerName');
                 }
                 else {
-                    WA.hideLayer('Metadata');
+                    WA.hideLayer('LayerName');
                 }
             }
         </script>