image: handle missing pixels in z

Author: antoinerg

src/traces/image/hover.js

@@ -28,6 +28,9 @@ module.exports = function hoverPoints(pointData, xval, yval) {
     var nx = Math.floor((xval - cd0.x0) / trace.dx);
     var ny = Math.floor(Math.abs(yval - cd0.y0) / trace.dy);
 
+    // return early if pixel is undefined
+    if(!cd0.z[ny][nx]) return;
+
     var hoverinfo = cd0.hi || trace.hoverinfo;
     var fmtColor;
     if(hoverinfo) {

src/traces/image/plot.js

@@ -120,7 +120,7 @@ module.exports.plot = function(gd, plotinfo, cdimage, imageLayer) {
         for(var i = 0; i < cd0.w; i++) {
             if(ipx(i + 1) === ipx(i)) continue;
             for(var j = 0; j < cd0.h; j++) {
-                if(jpx(j + 1) === jpx(j)) continue;
+                if(jpx(j + 1) === jpx(j) || !z[j][i]) continue;
                 c = trace._scaler(z[j][i]);
                 context.fillStyle = trace.colormodel + '(' + fmt(c).join(',') + ')';
                 context.fillRect(ipx(i), jpx(j), ipx(i + 1) - ipx(i), jpx(j + 1) - jpx(j));

test/image/baselines/image_with_gaps.png

@@ -0,0 +1,14 @@
+{
+  "data": [{
+    "type": "image",
+    "z": [
+      [[1, 0, 0], [0, 1, 0], [0, 0, 1]],
+      [[1, 0, 0], [0, 1, 0]],
+      [[1, 0, 0]]
+    ],
+    "zmax": [1, 1, 1]
+  }],
+  "layout": {
+    "width": 400, "height": 400, "title": {"text": "Image with missing pixels"}
+  }
+}