persistent selections for 'scattermapbox'

- support only 'marker.opacity' until we bump mapbox-gl

Author: etpinard

src/traces/scattermapbox/attributes.js

@@ -107,6 +107,17 @@ module.exports = overrideAll({
     textfont: mapboxAttrs.layers.symbol.textfont,
     textposition: mapboxAttrs.layers.symbol.textposition,
 
+    selected: {
+        marker: {
+            opacity: scatterAttrs.selected.marker.opacity
+        }
+    },
+    unselected: {
+        marker: {
+            opacity: scatterAttrs.unselected.marker.opacity
+        }
+    },
+
     hoverinfo: extendFlat({}, plotAttrs.hoverinfo, {
         flags: ['lon', 'lat', 'text', 'name']
     })

src/traces/scattermapbox/convert.js

@@ -185,8 +185,15 @@ function makeCircleGeoJSON(calcTrace, hash) {
         sizeFn = makeBubbleSizeFn(trace);
     }
 
-    function combineOpacities(d, mo) {
-        return trace.opacity * mo * (d.dim ? DESELECTDIM : 1);
+    var combineOpacities;
+    if(trace.selectedpoints) {
+        combineOpacities = function(d, mo) {
+            return trace.opacity * mo * (d.selected ? 1 : DESELECTDIM);
+        };
+    } else {
+        combineOpacities = function(d, mo) {
+            return trace.opacity * mo;
+        };
     }
 
     var opacityFn;
@@ -195,7 +202,7 @@ function makeCircleGeoJSON(calcTrace, hash) {
             var mo = isNumeric(d.mo) ? +Lib.constrain(d.mo, 0, 1) : 0;
             return combineOpacities(d, mo);
         };
-    } else if(trace._hasDimmedPts) {
+    } else if(trace.selectedpoints) {
         opacityFn = function(d) {
             return combineOpacities(d, marker.opacity);
         };
@@ -343,7 +350,7 @@ function calcCircleOpacity(trace, hash) {
     var marker = trace.marker;
     var out;
 
-    if(Array.isArray(marker.opacity) || trace._hasDimmedPts) {
+    if(Array.isArray(marker.opacity) || trace.selectedpoints) {
         var vals = Object.keys(hash[OPACITY_PROP]);
         var stops = [];
 

src/traces/scattermapbox/defaults.js

@@ -16,10 +16,9 @@ var handleMarkerDefaults = require('../scatter/marker_defaults');
 var handleLineDefaults = require('../scatter/line_defaults');
 var handleTextDefaults = require('../scatter/text_defaults');
 var handleFillColorDefaults = require('../scatter/fillcolor_defaults');
-
+var DESELECTDIM = require('../../constants/interactions').DESELECTDIM;
 var attributes = require('./attributes');
 
-
 module.exports = function supplyDefaults(traceIn, traceOut, defaultColor, layout) {
     function coerce(attr, dflt) {
         return Lib.coerce(traceIn, traceOut, attributes, attr, dflt);
@@ -41,7 +40,7 @@ module.exports = function supplyDefaults(traceIn, traceOut, defaultColor, layout
     }
 
     if(subTypes.hasMarkers(traceOut)) {
-        handleMarkerDefaults(traceIn, traceOut, defaultColor, layout, coerce, {noLine: true});
+        handleMarkerDefaults(traceIn, traceOut, defaultColor, layout, coerce, {noLine: true, noSelect: true});
 
         // array marker.size and marker.color are only supported with circles
 
@@ -53,10 +52,16 @@ module.exports = function supplyDefaults(traceIn, traceOut, defaultColor, layout
             if(Array.isArray(marker.size)) marker.size = marker.size[0];
             if(Array.isArray(marker.color)) marker.color = marker.color[0];
         }
+
+        // only marker.opacity for now
+        var mo = traceOut.marker.opacity;
+        var moEffective = Array.isArray(mo) ? 1 : mo;
+        coerce('selected.marker.opacity', moEffective);
+        coerce('unselected.marker.opacity', DESELECTDIM * moEffective);
     }
 
     if(subTypes.hasText(traceOut)) {
-        handleTextDefaults(traceIn, traceOut, layout, coerce);
+        handleTextDefaults(traceIn, traceOut, layout, coerce, {noSelect: true});
     }
 
     coerce('fill');

src/traces/scattermapbox/index.js

@@ -20,6 +20,13 @@ ScatterMapbox.hoverPoints = require('./hover');
 ScatterMapbox.eventData = require('./event_data');
 ScatterMapbox.selectPoints = require('./select');
 
+ScatterMapbox.style = function(_, cd) {
+    if(cd) {
+        var trace = cd[0].trace;
+        trace._glTrace.update(cd);
+    }
+};
+
 ScatterMapbox.moduleType = 'trace';
 ScatterMapbox.name = 'scattermapbox';
 ScatterMapbox.basePlotModule = require('../../plots/mapbox');

src/traces/scattermapbox/select.js

@@ -20,15 +20,11 @@ module.exports = function selectPoints(searchInfo, polygon) {
 
     var di, lonlat, x, y, i;
 
-    // flag used in ./convert.js
-    // to not insert data-driven 'circle-opacity' when we don't need to
-    trace._hasDimmedPts = false;
-
     if(!subtypes.hasMarkers(trace)) return [];
 
     if(polygon === false) {
         for(i = 0; i < cd.length; i++) {
-            cd[i].dim = 0;
+            cd[i].selected = 0;
         }
     } else {
         for(i = 0; i < cd.length; i++) {
@@ -38,20 +34,17 @@ module.exports = function selectPoints(searchInfo, polygon) {
             y = ya.c2p(lonlat);
 
             if(polygon.contains([x, y])) {
-                trace._hasDimmedPts = true;
                 selection.push({
                     pointNumber: i,
                     lon: lonlat[0],
                     lat: lonlat[1]
                 });
-                di.dim = 0;
+                di.selected = 1;
             } else {
-                di.dim = 1;
+                di.selected = 0;
             }
         }
     }
 
-    trace._glTrace.update(cd);
-
     return selection;
 };

test/jasmine/tests/scattermapbox_test.js

@@ -110,26 +110,14 @@ describe('scattermapbox defaults', function() {
 describe('scattermapbox convert', function() {
     'use strict';
 
-    function _convert(trace, selected) {
+    function _convert(trace) {
         var gd = { data: [trace] };
         Plots.supplyDefaults(gd);
 
         var fullTrace = gd._fullData[0];
         Plots.doCalcdata(gd, fullTrace);
 
         var calcTrace = gd.calcdata[0];
-
-        if(selected) {
-            var hasDimmedPts = false;
-
-            selected.forEach(function(v, i) {
-                if(v) hasDimmedPts = true;
-                calcTrace[i].dim = v;
-            });
-
-            fullTrace._hasDimmedPts = hasDimmedPts;
-        }
-
         return convert(calcTrace);
     }
 
@@ -226,36 +214,41 @@ describe('scattermapbox convert', function() {
         };
 
         var specs = [{
-            patch: {},
-            selected: [0, 1, 1],
-            expected: {stops: [[0, 1], [1, 0.2]], props: [0, 1, 1]}
+            patch: {
+                selectedpoints: [1, 2]
+            },
+            expected: {stops: [[0, 0.2], [1, 1]], props: [0, 1, 1]}
         }, {
-            patch: {opacity: 0.5},
-            selected: [0, 1, 1],
-            expected: {stops: [[0, 0.5], [1, 0.1]], props: [0, 1, 1]}
+            patch: {
+                opacity: 0.5,
+                selectedpoints: [1, 2]
+            },
+            expected: {stops: [[0, 0.1], [1, 0.5]], props: [0, 1, 1]}
         }, {
             patch: {
-                marker: {opacity: 0.6}
+                marker: {opacity: 0.6},
+                selectedpoints: [1, 2]
             },
-            selected: [1, 0, 1],
-            expected: {stops: [[0, 0.12], [1, 0.6]], props: [0, 1, 0]}
+            expected: {stops: [[0, 0.12], [1, 0.6]], props: [0, 1, 1]}
         }, {
             patch: {
-                marker: {opacity: [0.5, 1, 0.6]}
+                marker: {
+                    opacity: [0.5, 1, 0.6],
+                },
+                selectedpoints: [0, 2]
             },
-            selected: [1, 0, 1],
-            expected: {stops: [[0, 0.1], [1, 1], [2, 0.12]], props: [0, 1, 2]}
+            expected: {stops: [[0, 0.5], [1, 0.2], [2, 0.6]], props: [0, 1, 2]}
         }, {
             patch: {
-                marker: {opacity: [2, null, -0.6]}
+                marker: {opacity: [2, null, -0.6]},
+                selectedpoints: [0, 1, 2]
             },
-            selected: [1, 1, 1],
-            expected: {stops: [[0, 0.2], [1, 0]], props: [0, 1, 1]}
+            expected: {stops: [[0, 1], [1, 0]], props: [0, 1, 1]}
         }];
 
         specs.forEach(function(s, i) {
             var msg0 = '- case ' + i + ' ';
-            var opts = _convert(Lib.extendDeep({}, _base, s.patch), s.selected);
+            var opts = _convert(Lib.extendDeep({}, _base, s.patch));
 
             expect(opts.circle.paint['circle-opacity'].stops)
                 .toEqual(s.expected.stops, msg0 + 'stops');