Rendering in jupyter notebooks does not work

[timon-schmelzer-gcx]

Rendering the chord-charts does not seem to work in jupyter notebooks. Steps to reproduce:

1. Create environment (I use anaconda)

   
   conda create -n chord python jupyter pip
   conda activate chord

pip install chord jupyter notebook

2. Execute example code in cell
```python
from chord import Chord

matrix = [
    [0, 5, 6, 4, 7, 4],
    [5, 0, 5, 4, 6, 5],
    [6, 5, 0, 4, 5, 5],
    [4, 4, 4, 0, 5, 5],
    [7, 6, 5, 5, 0, 4],
    [4, 5, 5, 5, 4, 0],
]

names = ["Action", "Adventure", "Comedy", "Drama", "Fantasy", "Thriller"]

Chord(matrix, names).show()

Expected Result

Some fancy chord plot

Actual result

Nothing. The result of Chord(matrix, names).to_html() is also empty.

Result of conda list

# Name                    Version                   Build  Channel
appnope                   0.1.0                    py38_0
attrs                     19.3.0                     py_0
backcall                  0.1.0                    py38_0
bleach                    3.1.0                      py_0
ca-certificates           2020.1.1                      0
certifi                   2020.4.5.1               py38_0
chord                     0.0.7                    pypi_0    pypi
dbus                      1.13.12              h90a0687_0
decorator                 4.4.2                      py_0
defusedxml                0.6.0                      py_0
entrypoints               0.3                      py38_0
expat                     2.2.6                h0a44026_0
gettext                   0.19.8.1             h15daf44_3
glib                      2.63.1               hd977a24_0
icu                       58.2                 h4b95b61_1
importlib_metadata        1.5.0                    py38_0
ipykernel                 5.1.4            py38h39e3cac_0
ipython                   7.13.0           py38h5ca1d4c_0
ipython_genutils          0.2.0                    py38_0
ipywidgets                7.5.1                      py_0
jedi                      0.16.0                   py38_1
jinja2                    2.11.1                     py_0
jpeg                      9b                   he5867d9_2
jsonschema                3.2.0                    py38_0
jupyter                   1.0.0                    py38_7
jupyter_client            6.1.2                      py_0
jupyter_console           6.1.0                      py_0
jupyter_core              4.6.3                    py38_0
libcxx                    4.0.1                hcfea43d_1
libcxxabi                 4.0.1                hcfea43d_1
libedit                   3.1.20181209         hb402a30_0
libffi                    3.2.1                h475c297_4
libiconv                  1.15                 hdd342a3_7
libpng                    1.6.37               ha441bb4_0
libsodium                 1.0.16               h3efe00b_0
mako                      1.1.2                    pypi_0    pypi
markupsafe                1.1.1            py38h1de35cc_0
mistune                   0.8.4           py38h1de35cc_1000
nbconvert                 5.6.1                    py38_0
nbformat                  5.0.4                      py_0
ncurses                   6.2                  h0a44026_0
notebook                  6.0.3                    py38_0
openssl                   1.1.1f               h1de35cc_0
pandoc                    2.2.3.2                       0
pandocfilters             1.4.2                    py38_1
parso                     0.6.2                      py_0
pcre                      8.43                 h0a44026_0
pexpect                   4.8.0                    py38_0
pickleshare               0.7.5                 py38_1000
pip                       20.0.2                   py38_1
prometheus_client         0.7.1                      py_0
prompt-toolkit            3.0.4                      py_0
prompt_toolkit            3.0.4                         0
ptyprocess                0.6.0                    py38_0
pygments                  2.6.1                      py_0
pyqt                      5.9.2            py38h655552a_2
pyrsistent                0.16.0           py38h1de35cc_0
python                    3.8.2                hc70fcce_0
python-dateutil           2.8.1                      py_0
pyzmq                     18.1.1           py38h0a44026_0
qt                        5.9.7                h468cd18_1
qtconsole                 4.7.2                      py_0
qtpy                      1.9.0                      py_0
readline                  8.0                  h1de35cc_0
send2trash                1.5.0                    py38_0
setuptools                46.1.3                   py38_0
sip                       4.19.8           py38h0a44026_0
six                       1.14.0                   py38_0
sqlite                    3.31.1               ha441bb4_0
terminado                 0.8.3                    py38_0
testpath                  0.4.4                      py_0
tk                        8.6.8                ha441bb4_0
tornado                   6.0.4            py38h1de35cc_1
traitlets                 4.3.3                    py38_0
uuid                      1.30                     pypi_0    pypi
wcwidth                   0.1.9                      py_0
webencodings              0.5.1                    py38_1
wheel                     0.34.2                   py38_0
widgetsnbextension        3.5.1                    py38_0
xz                        5.2.4                h1de35cc_4
zeromq                    4.3.1                h0a44026_3
zipp                      2.2.0                      py_0
zlib                      1.2.11               h1de35cc_3

[shahinrostami]

Thank you for reporting this @tschmel . I need a little more information to get started:

1. What browser/build are you using?
2. Can you bring up your web developer console and paste in any errors thrown from the JavaScript?

[timon-schmelzer-gcx]

Hi @shahinrostami ,

here is the output from Chrome (Version 80.0.3987.163 (Official Build) (64-Bit)):

I also tried it with Safari (Version 13.0.5 (15608.5.11)), but it is also not working. Here is the result:

I hope this helps!

Edit: added build versions of browsers

[shahinrostami]

It does help!

Chord retrieves a template when you invoke the constructor, this is loaded from a web resource. That part seems to be going fine because I can see the JavaScript error refers to the d3 variable, which only exists in that downloaded template!

I look into this closer soon, you may find that switching browser or using jupyter lab instead of jupyter notebook may fix the issue in the meantime! Let me know if you have any more information that may help me figure it out 👍

If you're using conda:

conda install jupyterlab=1.1.4 -y
conda install numpy -y
conda install pandas -y

[timon-schmelzer-gcx]

Indeed, switching to jupyter lab solved the problem, so the issue might only occur with jupyter notebooks. I will change the issue title accordingly.

Edit: Actually the title already contains jupyter notebook, so I will leave it as is :).

[shahinrostami]

I'm very happy you can at least start playing with it already @tschmel :)

I'll see what's causing the issue in jupyter notebook soon!

[zhuchangzhan]

I have the same issue with jupyter notebook and confirmed that switching to jupyter lab works

[shahinrostami]

Based on some tests I think it may be best to continue with primary support for jupyter lab rather than jupyter notebook. I will update the documentation to reflect this.

A user offered a workaround for jupyter notebook:

plot = chord.Chord(matrix, names).to_html()

from IPython.display import IFrame
IFrame(src="./out.html", width=700, height=700)

but support for this may be limited. If anyone figures it out please let us know!