Mpld3: How to change the location of the toolbar using a plugin?
The mpld3 display toolbar is usually located in the lower right corner of the screen. I would like it to be in the upper right corner of the screen. It looks like the code that controls the position of the toolbar can be found here .
I would like to know how to select a toolbar object using Javascript so that I can change its location. The Javascript code would ideally be an attribute of some custom mpld3 plugin.
+3
source to share
1 answer
Here is a simple plugin mpld3
to move the toolbar to the top of the picture:
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"}
You can see it in action in the laptop here .
+4
source to share