feature: add ability to specify tools to interactive charts so richer exploration with images and other content is possible

[suneeta-mall]

I ran into a scenario where I needed the interactive plots to show me the images in the tooltip in the thumbnail so I can debug the offending samples. Boken allows this with HoverTool concept that takes in a template of HTML and can render the data as desired.

In my use case, I have HoverTool defined as the following:

hover_tool = HoverTool(tooltips="""
<div>
    <div>
        <img src='@image' style='float: left; margin: 5px 5px 5px 5px'/>
    </div>
    <div>
        <span style='font-size: 16px; color: #224499'>Class:</span>
        <span style='font-size: 18px'>@class</span>
    </div>
    <div>
        <span style='font-size: 16px; color: #224499'>Index:</span>
        <span style='font-size: 18px'>$index</span>
    </div>
    <div>
        <span style='font-size: 16px; color: #224499'>Values:</span>
        <span style='font-size: 18px'>($x, $y)</span>
    </div>
</div>
"""

Wherein my hover_data includes base64 encoded images as one of the columns with header image, generated using a method similar to the following:

    @staticmethod
    def embeddable_image(data):
        img_data = (data[0, 0, ...] * 255).astype(np.uint8)
        image = Image.fromarray(img_data, mode="L").resize((64, 64), Image.BICUBIC)
        buffer = BytesIO()
        image.save(buffer, format="jpeg")
        for_encoding = buffer.getvalue()
        image_blurb = f"data:image/jpg;base64,{base64.b64encode(for_encoding).decode()}"
        return image_blurb

Then I apply this method to samples building hover_data as follows:

df["image"] = list(map(self.embeddable_image, np.vsplit(img_set, img_set.shape[0])))

where df is my data frame representing hover_data.

So, when I invoke the interactive umap API:

        p = umap.plot.interactive(
            mapper,
            labels=r_labels_set,
            hover_data=df,
            point_size=2,
            tools=["pan", "wheel_zoom", "box_zoom", "save", "reset", "help", hover_tool],
            color_key_cmap="Paired",
            background="black",
        )

Some example results:

[pep8speaks]

Hello @suneeta-mall! Thanks for updating this PR. We checked the lines you've touched for PEP 8 issues, and found:

There are currently no PEP 8 issues detected in this Pull Request. Cheers! :beers:

Comment last updated at 2022-04-26 00:58:26 UTC

[lmcinnes]

Sorry for being so slow to getting to this. It looks extremely useful, thanks! If you want to add a note about this, and the example you have in this PR to the documentation that would be greatly appreciated.