Merge release-v2.35.3 dev branch to master to include recent fixes

LICENSE

@@ -1,6 +1,6 @@
-The MIT License (MIT)
+MIT License
 
-Copyright (c) 2021 Plotly, Inc
+Copyright (c) 2016-2024 Plotly Technologies Inc.
 
 Permission is hereby granted, free of charge, to any person obtaining a copy
 of this software and associated documentation files (the "Software"), to deal

draftlogs/7164_fix.md

@@ -0,0 +1 @@
+- Allow null or broken selection objects without throwing an error [[#7164](https://github.com/plotly/plotly.js/pull/7164)]

draftlogs/7167_fix.md

@@ -0,0 +1 @@
+- Render scatterternary traces correctly if they have the `ids` attribute [[#7164](https://github.com/plotly/plotly.js/pull/7164)]

draftlogs/7199_fix.md

@@ -0,0 +1 @@
+- Do not convert url-sourced layout images to data uri unless we're in staticPlot mode, to improve interactivity when images are changed with zoom/pan [[#7199](https://github.com/plotly/plotly.js/pull/7199)]

draftlogs/7204_fix.md

@@ -0,0 +1 @@
+ - Fix mablibre source map [[#7204](https://github.com/plotly/plotly.js/pull/7204)]

draftlogs/7205_fix.md

@@ -0,0 +1 @@
+ - Fix years in license [[#7205](https://github.com/plotly/plotly.js/pull/7205)]

src/components/images/draw.js

@@ -73,7 +73,7 @@ module.exports = function draw(gd) {
 
         thisImage.attr('xmlns', xmlnsNamespaces.svg);
 
-        if(d.source && d.source.slice(0, 5) === 'data:') {
+        if(!gd._context.staticPlot || (d.source && d.source.slice(0, 5) === 'data:')) {
             thisImage.attr('xlink:href', d.source);
             this._imgSrc = d.source;
         } else {

src/components/selections/select.js

@@ -182,6 +182,7 @@ function prepSelect(evt, startX, startY, dragOptions, mode) {
             for(var q = 0; q < selections.length; q++) {
                 var s = fullLayout.selections[q];
                 if(
+                    !s ||
                     s.xref !== xRef ||
                     s.yref !== yRef
                 ) {

src/plots/cartesian/index.js

@@ -568,7 +568,10 @@ function makeSubplotLayer(gd, plotinfo) {
     var yLayer = constants.layerValue2layerClass[plotinfo.yaxis.layer];
     var hasOnlyLargeSploms = fullLayout._hasOnlyLargeSploms;
 
-    if(!plotinfo.mainplot || fullLayout._zindices.length > 1) {
+    var hasMultipleZ = fullLayout._zindices.length > 1;
+    var mainplotinfo = plotinfo.mainplotinfo;
+
+    if(!plotinfo.mainplot || hasMultipleZ) {
         if(hasOnlyLargeSploms) {
             // TODO could do even better
             // - we don't need plot (but we would have to mock it in lsInner
@@ -585,9 +588,15 @@ function makeSubplotLayer(gd, plotinfo) {
                 plotinfo.shapelayer = ensureSingle(backLayer, 'g', 'shapelayer');
                 plotinfo.imagelayer = ensureSingle(backLayer, 'g', 'imagelayer');
 
-                plotinfo.minorGridlayer = ensureSingle(plotgroup, 'g', 'minor-gridlayer');
-                plotinfo.gridlayer = ensureSingle(plotgroup, 'g', 'gridlayer');
-                plotinfo.zerolinelayer = ensureSingle(plotgroup, 'g', 'zerolinelayer');
+                if(mainplotinfo && hasMultipleZ) {
+                    plotinfo.minorGridlayer = mainplotinfo.minorGridlayer;
+                    plotinfo.gridlayer = mainplotinfo.gridlayer;
+                    plotinfo.zerolinelayer = mainplotinfo.zerolinelayer;
+                } else {
+                    plotinfo.minorGridlayer = ensureSingle(plotgroup, 'g', 'minor-gridlayer');
+                    plotinfo.gridlayer = ensureSingle(plotgroup, 'g', 'gridlayer');
+                    plotinfo.zerolinelayer = ensureSingle(plotgroup, 'g', 'zerolinelayer');
+                }
 
                 var betweenLayer = ensureSingle(plotgroup, 'g', 'layer-between');
                 plotinfo.shapelayerBetween = ensureSingle(betweenLayer, 'g', 'shapelayer');
@@ -622,7 +631,6 @@ function makeSubplotLayer(gd, plotinfo) {
             }
         }
     } else {
-        var mainplotinfo = plotinfo.mainplotinfo;
         var mainplotgroup = mainplotinfo.plotgroup;
         var xId = id + '-x';
         var yId = id + '-y';

src/plots/map/map.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var maplibregl = require('maplibre-gl/dist/maplibre-gl-unminified');
+var maplibregl = require('maplibre-gl');
 
 var Lib = require('../../lib');
 var geoUtils = require('../../lib/geo_location_utils');

src/traces/scatterternary/calc.js

@@ -15,6 +15,7 @@ module.exports = function calc(gd, trace) {
     var displaySum = ternary.sum;
     var normSum = trace.sum || displaySum;
     var arrays = {a: trace.a, b: trace.b, c: trace.c};
+    var ids = trace.ids;
 
     var i, j, dataArray, newArray, fillArray1, fillArray2;
 
@@ -58,6 +59,9 @@ module.exports = function calc(gd, trace) {
             y = a;
             x = c - b;
             cd[i] = {x: x, y: y, a: a, b: b, c: c};
+            if (ids) {
+                cd[i].id = ids[i];
+            }
         } else cd[i] = {x: false, y: false};
     }
 

test/image/mocks/ternary_simple.json

@@ -4,6 +4,7 @@
    "a": [2, 1, 1],
    "b": [1, 2, 1],
    "c": [1, 1, 2.12345],
+   "ids": ["first ID", "second ID", "third ID"],
    "type": "scatterternary"
   }
  ],

test/jasmine/tests/layout_images_test.js

@@ -319,9 +319,8 @@ describe('Layout images', function() {
         var gd;
         var data = [{ x: [1, 2, 3], y: [1, 2, 3] }];
 
-        beforeEach(function(done) {
-            gd = createGraphDiv();
-            Plotly.newPlot(gd, data, {
+        var layoutFn = function() {
+            return {
                 images: [{
                     source: jsLogo,
                     x: 2,
@@ -331,12 +330,17 @@ describe('Layout images', function() {
                 }],
                 width: 500,
                 height: 400
-            }).then(done);
+            };
+        }
+
+        beforeEach(function(done) {
+            gd = createGraphDiv();
+            Plotly.newPlot(gd, data, layoutFn()).then(done);
         });
 
         afterEach(destroyGraphDiv);
 
-        it('should only create canvas if url image', function(done) {
+        it('should only create canvas if url image and staticPlot', function(done) {
             var originalCreateElement = document.createElement;
             var newCanvasElement;
             spyOn(document, 'createElement').and.callFake(function(elementType) {
@@ -350,7 +354,21 @@ describe('Layout images', function() {
 
             Plotly.relayout(gd, 'images[0].source', dataUriImage)
             .then(function() {
-                expect(newCanvasElement).toBeUndefined();
+                expect(newCanvasElement).withContext('non-static data uri').toBeUndefined();
+
+                return Plotly.relayout(gd, 'images[0].source', jsLogo);
+            })
+            .then(function() {
+                expect(newCanvasElement).withContext('non-static url').toBeUndefined();
+
+                return Plotly.newPlot(gd, data, layoutFn(), {staticPlot: true});
+            })
+            .then(function() {
+                newCanvasElement = undefined;
+                return Plotly.relayout(gd, 'images[0].source', dataUriImage);
+            })
+            .then(function() {
+                expect(newCanvasElement).withContext('static data uri').toBeUndefined();
 
                 return Plotly.relayout(gd, 'images[0].source', jsLogo);
             })
@@ -392,11 +410,21 @@ describe('Layout images', function() {
             .then(done, done.fail);
         });
 
-        it('should remove the image tag if an invalid source', function(done) {
+        it('should remove the image tag if an invalid source and staticPlot', function(done) {
             var selection = d3Select('image');
             expect(selection.size()).toBe(1);
 
             Plotly.relayout(gd, 'images[0].source', 'invalidUrl')
+            .then(function() {
+                var newSelection = d3Select('image');
+                expect(newSelection.size()).toBe(1);
+            })
+            .then(function() {
+                return Plotly.newPlot(gd, data, layoutFn(), {staticPlot: true});
+            })
+            .then(function() {
+                return Plotly.relayout(gd, 'images[0].source', 'invalidUrl');
+            })
             .then(function() {
                 var newSelection = d3Select('image');
                 expect(newSelection.size()).toBe(0);

test/jasmine/tests/select_test.js

@@ -75,7 +75,7 @@ function assertSelectionNodes(cornerCnt, outlineCnt, _msg) {
 }
 
 var selectingCnt, selectingData, selectedCnt, selectedData, deselectCnt, doubleClickData;
-var selectedPromise, deselectPromise, clickedPromise;
+var selectedPromise, deselectPromise, clickedPromise, relayoutPromise;
 
 function resetEvents(gd) {
     selectingCnt = 0;
@@ -125,6 +125,12 @@ function resetEvents(gd) {
             resolve();
         });
     });
+
+    relayoutPromise = new Promise(function(resolve) {
+        gd.on('plotly_relayout', function() {
+            resolve();
+        });
+    });
 }
 
 function assertEventCounts(selecting, selected, deselect, msg) {
@@ -1035,6 +1041,100 @@ describe('Test select box and lasso in general:', function() {
         });
     });
 
+    describe('select / deselect with fake selections', function() {
+        var gd;
+        beforeEach(function(done) {
+            gd = createGraphDiv();
+
+            var mockCopy = Lib.extendDeep({}, mock);
+            mockCopy.layout.dragmode = 'select';
+            mockCopy.layout.hovermode = 'closest';
+            mockCopy.layout.selections = [null];
+            addInvisible(mockCopy);
+
+            _newPlot(gd, mockCopy.data, mockCopy.layout)
+                .then(done);
+        });
+
+        it('should trigger selecting/selected/deselect events', function(done) {
+            resetEvents(gd);
+
+            drag(selectPath);
+
+            selectedPromise.then(function() {
+                expect(selectedCnt).toBe(1, 'with the correct selected count');
+                assertEventData(selectedData.points, [{
+                    curveNumber: 0,
+                    pointNumber: 0,
+                    pointIndex: 0,
+                    x: 0.002,
+                    y: 16.25
+                }, {
+                    curveNumber: 0,
+                    pointNumber: 1,
+                    pointIndex: 1,
+                    x: 0.004,
+                    y: 12.5
+                }], 'with the correct selected points (2)');
+                assertRange(selectedData.range, {
+                    x: [0.002000, 0.0046236],
+                    y: [0.10209191961595454, 24.512223978291406]
+                }, 'with the correct selected range');
+
+                return doubleClick(250, 200);
+            })
+            .then(deselectPromise)
+            .then(function() {
+                expect(doubleClickData).toBe(null, 'with the correct deselect data');
+            })
+            .then(done, done.fail);
+        });
+
+        it('should handle add/sub selection', function(done) {
+            resetEvents(gd);
+            expect(gd.layout.selections.length).toBe(1);
+
+            drag([[193, 193], [213, 193]], {shiftKey: true})
+
+            selectedPromise.then(function() {
+                expect(selectedCnt).toBe(1, 'with the correct selected count');
+                assertEventData(selectedData.points, [{
+                    curveNumber: 0,
+                    pointNumber: 4,
+                    pointIndex: 4,
+                    x: 0.013,
+                    y: 6.875
+                }], 'with the correct selected points (1)');
+            })
+            .then(function() {
+                // this is not working here, but it works in the test dashboard, not sure why
+                // but at least this test shows us that no errors are thrown.
+                // expect(gd.layout.selections.length).toBe(2, 'fake selection is still there');
+
+                resetEvents(gd);
+
+                return doubleClick(250, 200);
+            })
+            .then(relayoutPromise)
+            .then(function() {
+                expect(gd.layout.selections.length).toBe(0, 'fake selection is cleared');
+                expect(doubleClickData).toBe(null, 'with the correct deselect data');
+            })
+            .then(done, done.fail);
+        });
+
+        it('should clear fake selections on doubleclick', function(done) {
+            resetEvents(gd);
+
+            doubleClick(250, 200);
+
+            relayoutPromise.then(function() {
+                expect(gd.layout.selections.length).toBe(0, 'fake selections are cleared');
+            })
+            .then(done, done.fail);
+        });
+    });
+
     describe('lasso events', function() {
         var mockCopy = Lib.extendDeep({}, mock);
         mockCopy.layout.dragmode = 'lasso';
@@ -1979,6 +2079,7 @@ describe('Test select box and lasso per trace:', function() {
                     function() {
                         assertPoints([[0.5, 0.25, 0.25]]);
                         assertSelectedPoints({0: [0]});
+                        expect(selectedData.points[0].id).toBe("first ID")
                     },
                     [380, 180],
                     BOXEVENTS, 'scatterternary select'

test/jasmine/tests/ternary_test.js

@@ -21,7 +21,7 @@ var assertHoverLabelContent = customAssertions.assertHoverLabelContent;
 
 var SORTED_EVENT_KEYS = [
     'data', 'fullData', 'curveNumber', 'pointNumber', 'pointIndex',
-    'xaxis', 'yaxis', 'a', 'b', 'c',
+    'xaxis', 'yaxis', 'a', 'b', 'c', 'id',
     'bbox'
 ].sort();