获取 mpld3 图的缩放级别

Getting the zoom level of an mpld3 plot

有没有办法读出 mpld3 图的缩放级别,即可见的 x 轴和 y 轴的范围? 我尝试使用 d3.behavior.zoom,但我不知道如何获得 mpld3 图的缩放行为。

您可以使用我为 interactively adding callouts to scatter plots 开发的模式制作一个 mpld3 插件来执行此操作。实际上,这要简单得多,所以它是 simple-but-useful 插件的一个很好的例子:

import matplotlib.pyplot as plt, mpld3
%matplotlib inline

class ZoomSizePlugin(mpld3.plugins.PluginBase):
    JAVASCRIPT = r"""
    // little save icon
    var my_icon = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAIAAACQkWg2AAAACXBIWXMAAAsTAAALEwEAmpwYAAAAB3RJTUUH3gUTDC0v7E0+LAAAAB1pVFh0Q29tbWVudAAAAAAAQ3JlYXRlZCB3aXRoIEdJTVBkLmUHAAAAa0lEQVQoz32QQRLAIAwCA///Mz3Y6cSG4EkjoAsk1VgAqspecVP3TTIA6MHTQ6sOHm7Zm4dWHcC4wc3hmVzT7xEbYf66dX/xnEOI7M9KYgie6qvW6ZH0grYOmQGOxzCEQn8C5k5mHAOrbeIBWLlaA3heUtcAAAAASUVORK5CYII=";

    // create plugin
    mpld3.register_plugin("zoomSize", ZoomSizePlugin);
    ZoomSizePlugin.prototype = Object.create(mpld3.Plugin.prototype);
    ZoomSizePlugin.prototype.constructor = ZoomSizePlugin;
    ZoomSizePlugin.prototype.requiredProps = [];
    ZoomSizePlugin.prototype.defaultProps = {}

    function ZoomSizePlugin(fig, props){
        mpld3.Plugin.call(this, fig, props);

        // create save button
        var SaveButton = mpld3.ButtonFactory({
            buttonID: "save",
            sticky: false,
            onActivate: function(){save_zoom(fig);}.bind(this),
            icon: function(){return my_icon;},
        });
        this.fig.buttons.push(SaveButton);
    };

    function save_zoom(fig) {
      var ax= fig.axes[0],
          extent = "";
      extent = extent + "left=" + ax.x.invert(0);
      extent = extent + ", right=" + ax.x.invert(ax.width);
      extent = extent + ", bottom=" + ax.y.invert(ax.height);
      extent = extent + ", top=" + ax.y.invert(0);

      prompt("Copy extent of zoomed axis:", extent);
    }

    """

    def __init__(self):
        self.dict_ = {"type": "zoomSize"}

plt.plot([3,1,4,1,5,9,2,6,5,3,5,8], 'ks-', mew=1, mec='w')
mpld3.plugins.connect(plt.gcf(), ZoomSizePlugin())
mpld3.display()

对我来说,它看起来像这样:

这里是a Jupyter Notebook version, if you want to play around