- fix gl2d_scatter_fill_self_next ( rollback the baselines test/image/baselines/gl2d_scatter_fill_self_next.png )

- add a new test with 2 draw side by side

Author: ErwanMAS

src/traces/scattergl/index.js

@@ -259,26 +259,57 @@ function sceneUpdate(gd, subplot) {
         // draw traces in proper order
         scene.draw = function draw() {
             var i;
+	    var we_must_draw_previous_line_marker = 0 ;
             for(i = 0; i < scene.count; i++) {
+		var we_defer_somes_draw = 0 ;
+		if ( scene.fill2d && scene.fillOptions[i] && scene.fillOptions[i].fillmode == "tonext" ) {
+		    we_defer_somes_draw = 1 ;
+		} else {
+		    if ( we_must_draw_previous_line_marker && scene.line2d && scene.lineOptions[i-1] ) {
+			scene.line2d.draw(i-1);
+		    }
+		    if ( we_must_draw_previous_line_marker && scene.scatter2d && scene.markerOptions[i-1] ) {
+			scene.scatter2d.draw(i-1);
+		    }
+		    we_must_draw_previous_line_marker = 0 ;
+		}
                 if(scene.fill2d && scene.fillOptions[i]) {
                     scene.fill2d.draw(i);
                 }
+		// we draw line2d 
+		if ( we_must_draw_previous_line_marker && scene.line2d && scene.lineOptions[i-1] ) {
+		    scene.line2d.draw(i-1);
+		}
                 if(scene.line2d && scene.lineOptions[i]) {
-                    scene.line2d.draw(i);
+		    if ( we_defer_somes_draw == 0 ) {
+			scene.line2d.draw(i);
+		    }
                 }
                 if(scene.error2d && scene.errorXOptions[i]) {
                     scene.error2d.draw(i);
                 }
                 if(scene.error2d && scene.errorYOptions[i]) {
                     scene.error2d.draw(i + scene.count);
                 }
-                if(scene.scatter2d && scene.markerOptions[i] && (!scene.selectBatch || !scene.selectBatch[i])) {
-                    // traces in no-selection mode
-                    scene.scatter2d.draw(i);
-                }
+		// we draw scatter2d 
+		if (!scene.selectBatch || !scene.selectBatch[i]) {
+		    if ( we_must_draw_previous_line_marker && scene.scatter2d && scene.markerOptions[i-1] ) {
+			scene.scatter2d.draw(i-1);
+		    }
+		    if(scene.scatter2d && scene.markerOptions[i]) {
+			if ( we_defer_somes_draw == 0 ) {
+			    scene.scatter2d.draw(i);
+			}
+		    }
+		}
                 if(scene.glText[i] && scene.textOptions[i]) {
                     scene.glText[i].render();
                 }
+		if ( we_defer_somes_draw == 1 ) {
+		    we_must_draw_previous_line_marker = 1 ;
+		} else {
+		    we_must_draw_previous_line_marker = 0 ;
+		}
             }
 
             // draw traces in selection mode

test/image/baselines/gl2d_scatter_fill_self_next.png

@@ -0,0 +1,50 @@
+{
+    "data":[
+        {
+            "x": [1, 2, 3, 1, null, 4, 5, 6],
+            "y": [2, 3, 2, 2, null, 3, 4, 3],
+            "fill": "tonext","fillcolor":"#282",  "line": { "color": "#8c8" },
+            "type": "scattergl"
+        },
+        {
+            "x": [-1, 4, 9, null, 0, 1, 2],
+            "y": [1, 6, 1, null, 5, 6, 5],
+            "fill": "tonext","fillcolor":"#822",  "line": { "color": "#c88" },
+            "type": "scattergl"
+        },
+        {
+            "x": [2, 7, 9],
+            "y": [2, 4, 2],
+            "fill": "toself","fillcolor":"#228",  "line": { "color": "#88c" },
+            "type": "scattergl"
+        },
+        {
+            "x": [1, 2, 3, 1, null, 4, 5, 6],
+            "y": [2, 3, 2, 2, null, 3, 4, 3],
+            "fill": "tonext","fillcolor":"#282",  "line": { "color": "#8c8" },
+            "type": "scatter", "showlegend": true, "xaxis": "x2", "yaxis": "y2" 
+        },
+        {
+            "x": [-1, 4, 9, null, 0, 1, 2],
+            "y": [1, 6, 1, null, 5, 6, 5],
+            "fill": "tonext","fillcolor":"#822",  "line": { "color": "#c88" },
+            "type": "scatter", "showlegend": true, "xaxis": "x2", "yaxis": "y2" 
+        },
+        {
+            "x": [2, 7, 9],
+            "y": [2, 4, 2],
+            "fill": "toself","fillcolor":"#228",  "line": { "color": "#88c" },
+            "type": "scatter","showlegend": true, "xaxis": "x2", "yaxis": "y2" 
+        }
+    ],
+    "layout":{
+        "title": "Fill toself and tonext",
+        "width": 600,"height": 400,
+        "margin": {"l": 20, "r": 40, "t": 40, "b": 40},
+        "grid": {"columns": 2, "rows": 1, "pattern": "independent", "roworder": "bottom to top"} ,
+        "xaxis" : { "title": "GL" , "type": "linear", "rangemode": "tozero", "nticks": 3 },
+        "xaxis2": { "title": "" , "type": "linear", "rangemode": "tozero", "nticks": 3 },
+        "yaxis" : { "title": "" , "type": "linear", "range": [0,8], "nticks": 3 },
+        "yaxis2": { "title": "" , "type": "linear", "range": [0,8], "nticks": 3 }
+    }    
+}