Merge branch 'master' into lines-annotation

package.json

@@ -61,6 +61,7 @@
     "karma-sinon": "^1.0.4",
     "karma-sourcemap-loader": "^0.3.7",
     "karma-webpack": "^1.7.0",
+    "kdbush": "^1.0.1",
     "mousetrap": "^1.6.0",
     "nib": "^1.1.2",
     "node-resemble": "^1.1.3",

src/feature.js

@@ -53,7 +53,7 @@ var feature = function (arg) {
 
     // Don't bind handlers for improved performance on features that don't
     // require it.
-    if (!m_selectionAPI) {
+    if (!this.selectionAPI()) {
       return;
     }
 
@@ -413,24 +413,37 @@ var feature = function (arg) {
   ////////////////////////////////////////////////////////////////////////////
   /**
    * Get/Set visibility of the feature
+   *
+   * @param {boolean|undefined} val: undefined to return the visibility, a
+   *    boolean to change the visibility.
+   * @param {boolean} direct: if true, when getting the visibility, disregard
+   *    the visibility of the parent layer, and when setting, refresh the state
+   *    regardless of whether it has changed or not.
+   * @return {boolean|object} either the visibility (if getting) or the feature
+   *    (if setting).
    */
   ////////////////////////////////////////////////////////////////////////////
-  this.visible = function (val) {
+  this.visible = function (val, direct) {
     if (val === undefined) {
+      if (!direct && m_layer && m_layer.visible && !m_layer.visible()) {
+        return false;
+      }
       return m_visible;
     }
-    if (m_visible !== val) {
+    if (m_visible !== val || direct) {
       m_visible = val;
       m_this.modified();
-
+      if (m_layer && m_layer.visible && !m_layer.visible()) {
+        val = false;
+      }
       // bind or unbind mouse handlers on visibility change
-      if (m_visible) {
+      if (val) {
         m_this._bindMouseHandlers();
       } else {
         m_this._unbindMouseHandlers();
       }
       for (var i = 0; i < m_dependentFeatures.length; i += 1) {
-        m_dependentFeatures[i].visible(val);
+        m_dependentFeatures[i].visible(m_visible, direct);
       }
     }
     return m_this;
@@ -532,16 +545,26 @@ var feature = function (arg) {
 
   ////////////////////////////////////////////////////////////////////////////
   /**
-   * Query or set if the selection API is enabled for this feature.
-   * @returns {bool}
+   * Get/Set if the selection API is enabled for this feature.
+   *
+   * @param {boolean|undefined} val: undefined to return the selectionAPI
+   *    state, or a boolean to change the state.
+   * @param {boolean} direct: if true, when getting the selectionAPI state,
+   *    disregard the state of the parent layer, and when setting, refresh the
+   *    state regardless of whether it has changed or not.
+   * @return {boolean|object} either the selectionAPI state (if getting) or the
+   *    feature (if setting).
    */
   ////////////////////////////////////////////////////////////////////////////
-  this.selectionAPI = function (arg) {
+  this.selectionAPI = function (arg, direct) {
     if (arg === undefined) {
+      if (!direct && m_layer && m_layer.selectionAPI && !m_layer.selectionAPI()) {
+        return false;
+      }
       return m_selectionAPI;
     }
     arg = !!arg;
-    if (arg !== m_selectionAPI) {
+    if (arg !== m_selectionAPI || direct) {
       m_selectionAPI = arg;
       this._unbindMouseHandlers();
       this._bindMouseHandlers();

src/featureLayer.js

@@ -30,6 +30,8 @@ var featureLayer = function (arg) {
       s_init = this._init,
       s_exit = this._exit,
       s_update = this._update,
+      s_visible = this.visible,
+      s_selectionAPI = this.selectionAPI,
       s_draw = this.draw;
 
   ////////////////////////////////////////////////////////////////////////////
@@ -231,13 +233,72 @@ var featureLayer = function (arg) {
    */
   ////////////////////////////////////////////////////////////////////////////
   this.draw = function () {
-    // Call sceneObject.draw, which calls draw on all child objects.
-    s_draw();
+    if (m_this.visible()) {
+      // Call sceneObject.draw, which calls draw on all child objects.
+      s_draw();
 
-    // Now call render on the renderer. In certain cases it may not do
-    // anything if the if the child objects are drawn on the screen already.
-    if (m_this.renderer()) {
-      m_this.renderer()._render();
+      // Now call render on the renderer. In certain cases it may not do
+      // anything if the child objects are drawn on the screen already.
+      if (m_this.renderer()) {
+        m_this.renderer()._render();
+      }
+    }
+    return m_this;
+  };
+
+  ////////////////////////////////////////////////////////////////////////////
+  /**
+   * Get/Set visibility of the layer
+   *
+   * @param {boolean|undefined} val: undefined to return the visibility, a
+   *    boolean to change the visibility.
+   * @return {boolean|object} either the visibility (if getting) or the layer
+   *    (if setting).
+   */
+  ////////////////////////////////////////////////////////////////////////////
+  this.visible = function (val) {
+    if (val === undefined) {
+      return s_visible();
+    }
+    if (m_this.visible() !== val) {
+      s_visible(val);
+
+      // take a copy of the features; changing visible could mutate them.
+      var features = m_features.slice(), i;
+
+      for (i = 0; i < features.length; i += 1) {
+        features[i].visible(features[i].visible(undefined, true), true);
+      }
+      if (val) {
+        m_this.draw();
+      }
+    }
+    return m_this;
+  };
+
+  ////////////////////////////////////////////////////////////////////////////
+  /**
+   * Get/Set selectionAPI of the layer
+   *
+   * @param {boolean|undefined} val: undefined to return the selectionAPI
+   *    state, or a boolean to change it.
+   * @return {boolean|object} either the selectionAPI state (if getting) or the
+   *    layer (if setting).
+   */
+  ////////////////////////////////////////////////////////////////////////////
+  this.selectionAPI = function (val) {
+    if (val === undefined) {
+      return s_selectionAPI();
+    }
+    if (m_this.selectionAPI() !== val) {
+      s_selectionAPI(val);
+
+      // take a copy of the features; changing selectionAPI could mutate them.
+      var features = m_features.slice(), i;
+
+      for (i = 0; i < features.length; i += 1) {
+        features[i].selectionAPI(features[i].selectionAPI(undefined, true), true);
+      }
     }
     return m_this;
   };

src/gl/pointFeature.js

@@ -38,6 +38,11 @@ var gl_pointFeature = function (arg) {
       m_pixelWidthUniform = null,
       m_aspectUniform = null,
       m_dynamicDraw = arg.dynamicDraw === undefined ? false : arg.dynamicDraw,
+      /* If you are drawing very large points, you will often get better
+       * performance using a different primitiveShape.  The 'sprite' shape uses
+       * the least memory, but has hardware-specific limitations to its size.
+       * 'triangle' seems to be fastest on low-powered hardware, but 'square'
+       * visits fewer fragments. */
       m_primitiveShape = 'sprite', // arg can change this, below
       s_init = this._init,
       s_update = this._update,
@@ -529,6 +534,7 @@ var gl_pointFeature = function (arg) {
   ////////////////////////////////////////////////////////////////////////////
   this._exit = function () {
     m_this.renderer().contextRenderer().removeActor(m_actor);
+    m_actor = null;
     s_exit();
   };
 

src/gl/quadFeature.js

@@ -373,11 +373,11 @@ var gl_quadFeature = function (arg) {
       m_this._build();
     }
     if (m_actor_color) {
-      m_actor_color.setVisible(m_this.visible());
+      m_actor_color.setVisible(m_this.visible(undefined, true));
       m_actor_color.material().setBinNumber(m_this.bin());
     }
     if (m_actor_image) {
-      m_actor_image.setVisible(m_this.visible());
+      m_actor_image.setVisible(m_this.visible(undefined, true));
       m_actor_image.material().setBinNumber(m_this.bin());
     }
     m_this.updateTime().modified();

src/index.js

@@ -25,6 +25,10 @@
  * earcut
  * @copyright 2016, Mapbox
  * @license ISC
+ *
+ * kdbush
+ * @copyright 2017, Vladimir Agafonkin
+ * @license ISC
  */
 
 var $ = require('jquery');

src/jsonReader.js

@@ -257,7 +257,11 @@ var jsonReader = function (arg) {
             .style({
               strokeColor: m_this._style('strokeColor', '#ff7800', lines, convertColor),
               strokeWidth: m_this._style('strokeWidth', 4, lines),
-              strokeOpacity: m_this._style('strokeOpacity', 0.5, lines)
+              strokeOpacity: m_this._style('strokeOpacity', 0.5, lines),
+              strokeOffset: m_this._style('strokeOffset', 0, lines),
+              lineCap: m_this._style('lineCap', 'butt', lines),
+              lineJoin: m_this._style('lineCap', 'miter', lines),
+              closed: m_this._style('closed', false, lines)
             })
         );
       }

src/layer.js

@@ -55,6 +55,8 @@ var layer = function (arg) {
       m_active = arg.active === undefined ? true : arg.active,
       m_opacity = arg.opacity === undefined ? 1 : arg.opacity,
       m_attribution = arg.attribution || null,
+      m_visible = arg.visible === undefined ? true : arg.visible,
+      m_selectionAPI = arg.selectionAPI === undefined ? true : arg.selectionAPI,
       m_zIndex;
 
   m_rendererName = checkRenderer(m_rendererName);
@@ -192,20 +194,27 @@ var layer = function (arg) {
 
   ////////////////////////////////////////////////////////////////////////////
   /**
-   * Get whether or not the layer is active.  An active layer will receive
+   * Get/Set whether or not the layer is active.  An active layer will receive
    * native mouse when the layer is on top.  Non-active layers will never
    * receive native mouse events.
    *
-   * @returns {Boolean}
+   * @returns {Boolean|object}
    */
   ////////////////////////////////////////////////////////////////////////////
-  this.active = function () {
-    return m_active;
+  this.active = function (arg) {
+    if (arg === undefined) {
+      return m_active;
+    }
+    if (m_active !== arg) {
+      m_active = arg;
+      m_node.toggleClass('active', m_active);
+    }
+    return this;
   };
 
   ////////////////////////////////////////////////////////////////////////////
   /**
-   * Get/Set root node of the layer
+   * Get root node of the layer
    *
    * @returns {div}
    */
@@ -352,6 +361,48 @@ var layer = function (arg) {
     return m_attribution;
   };
 
+  ////////////////////////////////////////////////////////////////////////////
+  /**
+   * Get/Set visibility of the layer
+   *
+   * @param {boolean|undefined} val: undefined to return the visibility, a
+   *    boolean to change the visibility.
+   * @return {boolean|object} either the visibility (if getting) or the layer
+   *    (if setting).
+   */
+  ////////////////////////////////////////////////////////////////////////////
+  this.visible = function (val) {
+    if (val === undefined) {
+      return m_visible;
+    }
+    if (m_visible !== val) {
+      m_visible = val;
+      m_node.css('display', m_visible ? '' : 'none');
+      m_this.modified();
+    }
+    return m_this;
+  };
+
+  ////////////////////////////////////////////////////////////////////////////
+  /**
+   * Get/Set selectionAPI of the layer
+   *
+   * @param {boolean|undefined} val: undefined to return the selectionAPI
+   *    state, or a boolean to change it.
+   * @return {boolean|object} either the selectionAPI state (if getting) or the
+   *    layer (if setting).
+   */
+  ////////////////////////////////////////////////////////////////////////////
+  this.selectionAPI = function (val) {
+    if (val === undefined) {
+      return m_selectionAPI;
+    }
+    if (m_selectionAPI !== val) {
+      m_selectionAPI = val;
+    }
+    return m_this;
+  };
+
   ////////////////////////////////////////////////////////////////////////////
   /**
    * Init layer

src/pixelmapFeature.js

@@ -339,13 +339,14 @@ var pixelmapFeature = function (arg) {
       m_quadFeature = m_this.layer().createFeature('quad', {
         selectionAPI: false,
         gcs: m_this.gcs(),
-        visible: m_this.visible()
+        visible: m_this.visible(undefined, true)
       });
       m_this.dependentFeatures([m_quadFeature]);
-      m_quadFeature.style({image: m_info.canvas,
-                           position: m_this.style.get('position')})
-                   .data([{}])
-                   .draw();
+      m_quadFeature.style({
+        image: m_info.canvas,
+        position: m_this.style.get('position')})
+      .data([{}])
+      .draw();
     }
     /* If we prepared the pixelmap and rendered it, send a prepared event */
     if (prepared) {