mpld3：如何使用插件更改工具欄的位置？

Question

mpld3顯示的工具欄通常位於屏幕的右下角。 我希望它在屏幕的右上角。 似乎控制工具欄位置的代碼可以位於此處 。

我想知道如何使用Javascript選擇工具欄對象，以便我可以更改它的位置。 理想情況下，Javascript代碼是某些自定義mpld3插件的屬性。

Answer 1

這是一個簡單的mpld3插件，可以將工具欄移動到圖形的頂部：

class TopToolbar(plugins.PluginBase):
    """Plugin for moving toolbar to top of figure"""

    JAVASCRIPT = """
    mpld3.register_plugin("toptoolbar", TopToolbar);
    TopToolbar.prototype = Object.create(mpld3.Plugin.prototype);
    TopToolbar.prototype.constructor = TopToolbar;
    function TopToolbar(fig, props){
        mpld3.Plugin.call(this, fig, props);
    };

    TopToolbar.prototype.draw = function(){
      // the toolbar svg doesn't exist
      // yet, so first draw it
      this.fig.toolbar.draw();

      // then change the y position to be
      // at the top of the figure
      this.fig.toolbar.toolbar.attr("y", 2);

      // then remove the draw function,
      // so that it is not called again
      this.fig.toolbar.draw = function() {}
    }
    """
    def __init__(self):
        self.dict_ = {"type": "toptoolbar"}

你可以在這里的筆記本上看到它。