search

kitchensjn / tskit_arg_visualizer

Interactive visualization method for ancestral recombination graphs
MIT License
11 stars 3 forks source link

Getting viz to show in Google Colab #67

Closed hyanwong closed 4 months ago

hyanwong commented 5 months ago

I'm trying to get tskit_arg_visualizer to work in colab (see screenshot). At the moment, nothing appears when executing the visualiser code. I suspect the issue is that each cell is sandboxed. Additionally I get Can't find variable: require when using the Jupyter notebook incantation in a separate colab cell (when I try the JupyterLab version it doesn't complain, however).

I tried a workaround loading the javascript directly in the same cell using

from IPython.display import Javascript
display(Javascript(url="https://d3js.org/d3.v7.min.js"))

import msprime
import tskit_arg_visualizer
...

But then I get HTTPError: HTTP Error 403: Forbidden

Screenshot 2024-06-19 at 11 42 05
hyanwong commented 5 months ago

I also tried downloading and using a local copy of d3js (see below), but then I get Source Map Loading Errors

Screenshot 2024-06-19 at 12 15 33
kitchensjn commented 5 months ago

Ah yes, thanks for catching that. I haven't used Colab before, but it looks like this requires a different method for loading D3 into that environment. This notebook with the d3blocks package has figured it out so I'll look into what they are doing to get it to work. Interestingly, there isn't any obvious loading statement in the notebook itself, so I wonder if there is a cleaner way to load D3 across all of the different environments.

hyanwong commented 5 months ago

Thanks. It would be great if there is a clean way without the user having to type/figure out the JS.

kitchensjn commented 4 months ago

Alright, this turned out to be a naming issue for the Notebook environment. running_in_notebook() determines whether the package is being executed in a notebook or regular Python (command line, etc). It either displays the ARG within the notebook or, in the latter case, launches the web browser to show the ARG. Google Colab has get_ipython().__class__.__name__ == "Shell" rather than the standard get_ipython().__class__.__name__ == "ZMQInteractiveShell" used by Jupyter Notebook and Lab, so it wasn't catching that it should be displayed in the notebook. At the same time, the notebook was preventing a browser from being launched, so the HTML was just getting discarded. Adding an extra check for "Shell" solves this.

Additionally, it appears that you do not need the header to load D3.js in Google Colabs. I've also found that the header may not be important for Jupyter Lab but is still needed for Jupyter Notebook. Still confirming this last bit, but please let me know if you have issues with the changes thus far.

hyanwong commented 4 months ago

Yep, that works. Thanks for the quick reply and fix!