Merge pull request #18479 from tacaswell/nbagg_backports

QuLogic · web-flow · commit 254f0623e104 · 2020-09-14T15:38:00.000-04:00
Nbagg backports
diff --git a/lib/matplotlib/backends/web_backend/js/mpl.js b/lib/matplotlib/backends/web_backend/js/mpl.js
@@ -62,8 +62,8 @@ mpl.figure = function (figure_id, websocket, ondownload, parent_element) {
     this.ws.onopen = function () {
         fig.send_message('supports_binary', { value: fig.supports_binary });
         fig.send_message('send_image_mode', {});
-        if (mpl.ratio !== 1) {
-            fig.send_message('set_dpi_ratio', { dpi_ratio: mpl.ratio });
+        if (fig.ratio !== 1) {
+            fig.send_message('set_dpi_ratio', { dpi_ratio: fig.ratio });
         }
         fig.send_message('refresh', {});
     };
@@ -156,7 +156,10 @@ mpl.figure.prototype._init_canvas = function () {
         this.context.backingStorePixelRatio ||
         1;
 
-    mpl.ratio = (window.devicePixelRatio || 1) / backingStore;
+    this.ratio = (window.devicePixelRatio || 1) / backingStore;
+    if (this.ratio !== 1) {
+        fig.send_message('set_dpi_ratio', { dpi_ratio: this.ratio });
+    }
 
     var rubberband_canvas = (this.rubberband_canvas = document.createElement(
         'canvas'
@@ -200,8 +203,8 @@ mpl.figure.prototype._init_canvas = function () {
                     entry.devicePixelContentBoxSize[0].blockSize
                 );
             } else {
-                canvas.setAttribute('width', width * mpl.ratio);
-                canvas.setAttribute('height', height * mpl.ratio);
+                canvas.setAttribute('width', width * fig.ratio);
+                canvas.setAttribute('height', height * fig.ratio);
             }
             canvas.setAttribute(
                 'style',
@@ -399,10 +402,10 @@ mpl.figure.prototype.handle_resize = function (fig, msg) {
 };
 
 mpl.figure.prototype.handle_rubberband = function (fig, msg) {
-    var x0 = msg['x0'] / mpl.ratio;
-    var y0 = (fig.canvas.height - msg['y0']) / mpl.ratio;
-    var x1 = msg['x1'] / mpl.ratio;
-    var y1 = (fig.canvas.height - msg['y1']) / mpl.ratio;
+    var x0 = msg['x0'] / fig.ratio;
+    var y0 = (fig.canvas.height - msg['y0']) / fig.ratio;
+    var x1 = msg['x1'] / fig.ratio;
+    var y1 = (fig.canvas.height - msg['y1']) / fig.ratio;
     x0 = Math.floor(x0) + 0.5;
     y0 = Math.floor(y0) + 0.5;
     x1 = Math.floor(x1) + 0.5;
@@ -415,8 +418,8 @@ mpl.figure.prototype.handle_rubberband = function (fig, msg) {
     fig.rubberband_context.clearRect(
         0,
         0,
-        fig.canvas.width / mpl.ratio,
-        fig.canvas.height / mpl.ratio
+        fig.canvas.width / fig.ratio,
+        fig.canvas.height / fig.ratio
     );
 
     fig.rubberband_context.strokeRect(min_x, min_y, width, height);
@@ -599,8 +602,8 @@ mpl.figure.prototype.mouse_event = function (event, name) {
         this.canvas_div.focus();
     }
 
-    var x = canvas_pos.x * mpl.ratio;
-    var y = canvas_pos.y * mpl.ratio;
+    var x = canvas_pos.x * this.ratio;
+    var y = canvas_pos.y * this.ratio;
 
     this.send_message(name, {
         x: x,
diff --git a/lib/matplotlib/backends/web_backend/js/nbagg_mpl.js b/lib/matplotlib/backends/web_backend/js/nbagg_mpl.js
@@ -48,11 +48,19 @@ mpl.mpl_figure_comm = function (comm, msg) {
         console.error('Failed to find cell for figure', id, fig);
         return;
     }
+    fig.cell_info[0].output_area.element.one(
+        'cleared',
+        { fig: fig },
+        fig._remove_fig_handler
+    );
 };
 
 mpl.figure.prototype.handle_close = function (fig, msg) {
-    var width = fig.canvas.width / mpl.ratio;
-    fig.root.removeEventListener('remove', this._remove_fig_handler);
+    var width = fig.canvas.width / fig.ratio;
+    fig.cell_info[0].output_area.element.off(
+        'cleared',
+        fig._remove_fig_handler
+    );
 
     // Update the output cell to use the data from the current canvas.
     fig.push_to_output();
@@ -72,7 +80,7 @@ mpl.figure.prototype.close_ws = function (fig, msg) {
 
 mpl.figure.prototype.push_to_output = function (_remove_interactive) {
     // Turn the data on the canvas into data in the output cell.
-    var width = this.canvas.width / mpl.ratio;
+    var width = this.canvas.width / this.ratio;
     var dataURL = this.canvas.toDataURL();
     this.cell_info[1]['text/html'] =
         '<img src="' + dataURL + '" width="' + width + '">';
@@ -171,13 +179,13 @@ mpl.figure.prototype._init_toolbar = function () {
     titlebar.insertBefore(buttongrp, titlebar.firstChild);
 };
 
-mpl.figure.prototype._remove_fig_handler = function () {
-    this.close_ws(this, {});
+mpl.figure.prototype._remove_fig_handler = function (event) {
+    var fig = event.data.fig;
+    fig.close_ws(fig, {});
 };
 
 mpl.figure.prototype._root_extra_style = function (el) {
     el.style.boxSizing = 'content-box'; // override notebook setting of border-box.
-    el.addEventListener('remove', this._remove_fig_handler);
 };
 
 mpl.figure.prototype._canvas_extra_style = function (el) {
diff --git a/requirements/testing/travis_extra.txt b/requirements/testing/travis_extra.txt
@@ -1,7 +1,7 @@
 # Extra pip requirements for the travis python 3.7+ builds
 
 ipykernel
-nbconvert[execute]
+nbconvert[execute]!=6.0.0,!=6.0.1
 nbformat!=5.0.0,!=5.0.1
 pandas!=0.25.0
 pikepdf
