Search code examples
githubjupyter-notebookplotly

Plotly express graphs are not showing on GitHub repo jupyter notebook


I've created ipynb project notebook on my machine, and it was working normally. after uploading it to GitHub, plotly graphs are not showing there anymore.

Ant solution on how to show them up?

https://github.com/MoHassan01/Airbnb/blob/main/main.ipynb


Solution

  • TL;DR:

    You should be able to take the GitHub URL and put it in the form at nbviewer and it should render the Plotly plots in the 'static' view of the notebook.

    Details

    (I put 'static' in quotes because using the right tool, you can get javascript backed things to work and still be interactive in nbviewer.)

    nbviewer is the Jupyter Community provided solution for sharing Jupyter Notebooks with non-developers. It has many features not present in the preview that GitHub provides for developers. Rendering Plotly plots is one of several. It used the be more common that newcomers to the Jupyter ecosystem would learn this faster because GitHub wouldn't even attempt to make a preview if the Jupyter .ipynb file was over 100 kb and suggested nbviewer. Sadly, the change to attempting a rudimentary preview for developers has resulted in newcomers not realizing the tool they seek is nbviewer and they they simple need to direct nbviewer at the GitHub resource. (Actually, nbviewer can work with most any publically available static link.)

    Specifics about how the OP's saved .ipynb file not rendering at nbviewer at this time is non-reproducible

    So it is something about how you are doing this or a version difference in the environment where you are working vs. mine that seems to be contributing to your saved .ipynb file failing to display the plots in the nbviewer render. I cloned your repo and ran your main.ipynb file. (Below details how and where I ran this further.) Then I saved that and uploaded it to GitHub's gist site. Importantly, nbviewer renders it just fine here!.

    The source of the .ipynb file at GitHub that is rendering is here.

    Presumably investigating the code in the saved .ipynb source file vs. mine should reveal a difference that may give insight to what is going on. However, the only example provided by the OP to date has a lot of plots and makes comparison difficult. I have stressed that a minimal reproducible example would be better and this would make comparison of the text code in the saved .ipynb files much more straightforward. All my saves work and so I cannot make the failing example myself.

    Details on how and where I ran the OP's code

    I cloned your repo into MyBinder-served Jupyter sessions launched from here. (One can just go there and click the 'launch binder' badge to get a session in your browser without logging in. The environment in that image aleady has all the necessary packages and so nothing needs to be installed.) Then I ran the entire main.ipynb to make sure it worked. I saved that fresh-rerun of the notebook to my system and then uploaded it to GitHub as a gisthere. (Although the first upload attempt timed out, presumably due to the size of the notebook, the second upload attempt it worked okay.) Then I put that URL in the form at nbviewer.

    The nbviewer rendering of the entire main.ipynb run fresh in my environment looks good.