Release version 0.2.6.

indoorequal · Nov 19, 2020 · 9272581 · 9272581
1 parent bc2b1bd
commit 9272581
Show file tree

Hide file tree

Showing 4 changed files with 76 additions and 12 deletions.
diff --git a/dist/mapbox-gl-indoorequal.cjs.js b/dist/mapbox-gl-indoorequal.cjs.js
@@ -40,9 +40,6 @@ class LevelControl {
 
   _refresh() {
     this.$el.innerHTML = '';
-    if (this.indoorequal.levels.length === 1) {
-      return;
-    }
     const buttons = this.indoorequal.levels.map((level) => {
       const button = document.createElement('button');
       const strong = document.createElement('strong');
@@ -307,6 +304,31 @@ const layers = [
       ]
     ]
   },
+  {
+    id: "indoor-heat",
+    "type": "heatmap",
+    "source-layer": "heat",
+    "filter": [ "all" ],
+    "paint": {
+      "heatmap-color": ["interpolate", ["linear"], ["heatmap-density"],
+        0, "rgba(102, 103, 173, 0)",
+        0.1, "rgba(102, 103, 173, 0.2)",
+        1, "rgba(102, 103, 173, 0.7)"
+      ],
+      "heatmap-radius": [
+        "interpolate", ["linear"], ["zoom"],
+        0, 3,
+        13, 20,
+        17, 40
+      ],
+      "heatmap-intensity": 1,
+      "heatmap-opacity": [
+        "interpolate", ["linear"], ["zoom"],
+        16, 1,
+        17.1, 0
+      ]
+    }
+  },
   {
     id: "indoor-name",
     "type": "symbol",
@@ -474,7 +496,7 @@ const SOURCE_ID = 'indoorequal';
  * @param {object} options
  * @param {url} [options.url] Override the default tiles URL (https://tiles.indoorequal.org/).
  * @param {string} [options.apiKey] The API key if you use the default tile URL (get your free key at [indoorequal.com](https://indoorequal.com)).
- * @param {array} [options.layers] The layers to be used to style indoor= tiles.
+ * @param {array} [options.layers] The layers to be used to style indoor= tiles. Take a look a the [layers.js file](https://github.com/indoorequal/mapbox-gl-indoorequal/blob/master/src/layers.js) file and the [vector schema](https://indoorequal.com/schema)
  * @property {string} level The current level displayed
  * @property {array} levels  The levels that can be displayed in the current view
  * @fires IndoorEqual#levelschange
@@ -590,6 +612,14 @@ class IndoorEqual {
       });
   }
 
+  /**
+   * Change the heatmap layer visibility
+   * @param {boolean} visible True to make it visible, false to hide it
+   */
+  setHeatmapVisible(visible) {
+    this.map.setLayoutProperty("indoor-heat", "visibility", visible ? "visible" : "none");
+  }
+
   _addSource() {
     const queryParams = this.apiKey ? `?key=${this.apiKey}` : '';
     this.map.addSource(SOURCE_ID, {
@@ -611,7 +641,9 @@ class IndoorEqual {
   }
 
   _updateFilters() {
-    this.layers.forEach((layer) => {
+    this.layers
+    .filter(layer => layer.type !== "heatmap")
+    .forEach((layer) => {
       this.map.setFilter(layer.id, [ ...layer.filter || ['all'], ['==', 'level', this.level]]);
     });
   }

diff --git a/dist/mapbox-gl-indoorequal.esm.js b/dist/mapbox-gl-indoorequal.esm.js
@@ -36,9 +36,6 @@ class LevelControl {
 
   _refresh() {
     this.$el.innerHTML = '';
-    if (this.indoorequal.levels.length === 1) {
-      return;
-    }
     const buttons = this.indoorequal.levels.map((level) => {
       const button = document.createElement('button');
       const strong = document.createElement('strong');
@@ -303,6 +300,31 @@ const layers = [
       ]
     ]
   },
+  {
+    id: "indoor-heat",
+    "type": "heatmap",
+    "source-layer": "heat",
+    "filter": [ "all" ],
+    "paint": {
+      "heatmap-color": ["interpolate", ["linear"], ["heatmap-density"],
+        0, "rgba(102, 103, 173, 0)",
+        0.1, "rgba(102, 103, 173, 0.2)",
+        1, "rgba(102, 103, 173, 0.7)"
+      ],
+      "heatmap-radius": [
+        "interpolate", ["linear"], ["zoom"],
+        0, 3,
+        13, 20,
+        17, 40
+      ],
+      "heatmap-intensity": 1,
+      "heatmap-opacity": [
+        "interpolate", ["linear"], ["zoom"],
+        16, 1,
+        17.1, 0
+      ]
+    }
+  },
   {
     id: "indoor-name",
     "type": "symbol",
@@ -470,7 +492,7 @@ const SOURCE_ID = 'indoorequal';
  * @param {object} options
  * @param {url} [options.url] Override the default tiles URL (https://tiles.indoorequal.org/).
  * @param {string} [options.apiKey] The API key if you use the default tile URL (get your free key at [indoorequal.com](https://indoorequal.com)).
- * @param {array} [options.layers] The layers to be used to style indoor= tiles.
+ * @param {array} [options.layers] The layers to be used to style indoor= tiles. Take a look a the [layers.js file](https://github.com/indoorequal/mapbox-gl-indoorequal/blob/master/src/layers.js) file and the [vector schema](https://indoorequal.com/schema)
  * @property {string} level The current level displayed
  * @property {array} levels  The levels that can be displayed in the current view
  * @fires IndoorEqual#levelschange
@@ -586,6 +608,14 @@ class IndoorEqual {
       });
   }
 
+  /**
+   * Change the heatmap layer visibility
+   * @param {boolean} visible True to make it visible, false to hide it
+   */
+  setHeatmapVisible(visible) {
+    this.map.setLayoutProperty("indoor-heat", "visibility", visible ? "visible" : "none");
+  }
+
   _addSource() {
     const queryParams = this.apiKey ? `?key=${this.apiKey}` : '';
     this.map.addSource(SOURCE_ID, {
@@ -607,7 +637,9 @@ class IndoorEqual {
   }
 
   _updateFilters() {
-    this.layers.forEach((layer) => {
+    this.layers
+    .filter(layer => layer.type !== "heatmap")
+    .forEach((layer) => {
       this.map.setFilter(layer.id, [ ...layer.filter || ['all'], ['==', 'level', this.level]]);
     });
   }