print (" Web page display *")
< H1 > dynamic visualization of define custom toolbar location, web pages < / H1 >class TopToolbar (mpld3.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("x", 150);
this.fig.toolbar.toolbar.attr("y", 400);
// then remove the draw function,
// so that it is not called again
this.fig.toolbar.draw = function() {}
}
"""
def __init__(self):
self.dict_ = {"type": "toptoolbar"}
df = pd.DataFrame (dict (xboys, yags, label=clusters, title=usernameList)
< H1 > group by cluster < / H1 >groups = df.groupby ("label")
< H1 > define custom css to format the font and to remove the axis labeling < / H1 > css = "
text.mpld3-text, div.mpld3-tooltip {
font-family:Arial, Helvetica, sans-serif;
}
g.mpld3muraxis, g.mpld3-yaxis {
display: none;}
"
fig, ax = plt.subplots (figsize= (14,6))-sharp set plot size
ax.margins (0.03)-sharp Optional, just adds 5% padding to the autoscaling
for name, group in groups:
points = ax.plot(group.x, group.y, marker="o", linestyle="", ms=18, label=cluster_names[name], mec="none",
color=cluster_colors[name])
ax.set_aspect("auto")
labels = [i for i in group.title]
-sharp set tooltip using points, labels and the already defined "css"
tooltip = mpld3.plugins.PointHTMLTooltip(points[0], labels,
voffset=10, hoffset=10, css=css)
-sharp connect tooltip to fig
mpld3.plugins.connect(fig, tooltip, TopToolbar())
-sharp set tick marks as blank
ax.axes.get_xaxis().set_ticks([])
ax.axes.get_yaxis().set_ticks([])
-sharp set axis as blank
ax.axes.get_xaxis().set_visible(False)
ax.axes.get_yaxis().set_visible(False)
ax.legend (numpoints=1)-sharp show legend with only one dot
mpld3.display ()-sharp show the plot
< H1 > uncomment the below to export to html < / H1 > html = mpld3.fig_to_html (fig)
mpld3.save_html (fig,"clusters_dynamic.html")
print (html)
print (" Web page display ends *")
