Graph animations do not work in jupyter notebook in vscode

[AnupamSaraph]

Environment data

• VS Code version: XXX
• Jupyter Extension version (available under the Extensions sidebar): 2020.12.414227025
• Python Extension version (available under the Extensions sidebar): 2020.12.424452561
• OS (Windows | Mac | Linux distro) and version: Windows 10 Home Version 1909 OS Build 18363.1256
• Python and/or Anaconda version: 3.7.6
• Type of virtual environment used (N/A | venv | virtualenv | conda | ...): conda
• Jupyter server running: Local | Remote | N/A: Local

Expected behaviour

See: https://plotly.com/python/animations/

Actual behaviour

Animation does not work in Visual Code with plotly.express but works in Google Collaboratory.

The output from VisualCode-jupyter is pasted below. In case of executing the code in Visual Code the graph does not animate and moving the slider has no effect on the graph.

Steps to reproduce:

The code tested for plotting with animation is: ` import plotly.express as px df = px.data.gapminder()

fig = px.scatter(df, x="gdpPercap", y="lifeExp", animation_frame="year", animation_group="country",

   size="pop", color="continent", hover_name="country", facet_col="continent",
   log_x=True, size_max=45, range_x=[100,100000], range_y=[25,90])

fig.show() `

Additional information

The issue was raised on visualcode. However, it looks like something isn't working in plotly itself. If you open the 'Developer Webview Tools', it throws up a bunch of warnings:

Those warnings appear if you drag the slider.

Originally posted by @rchiodo in https://github.com/microsoft/vscode-jupyter/issues/4364#issuecomment-759603424

[AnupamSaraph]

This issue was also raised on plotly https://github.com/plotly/plotly.py/issues/2956. There is no response as yet. However the animation happens on Google Collaboratory and native jupyter. This appears to be a vs-code specific issue.

[nicolaskruchten]

Indeed it seems to be vscode-specific, I'm not sure there's anything for us to do on our end until someone figures out what vscode is doing that interferes with it and can't be fixed on their end.

[DonJayamanne]

Hi, I'd like to help (I'm one of the maintainers of Jupyter extension for VS Code). How can I debug plotly (create a local debug copy of plotly), or is there a build of plotly with the source maps?

[AnupamSaraph]

Hi, I'd like to help (I'm one of the maintainers of Jupyter extension for VS Code). How can I debug plotly (create a local debug copy of plotly), or is there a build of plotly with the source maps?

@nicolaskruchten can you please help?

[nicolaskruchten]

There are some instructions in https://github.com/plotly/plotly.js/blob/master/CONTRIBUTING.md#development which is what we use to build development bundles... let me know if that's enough to get you started! Thanks for looking into it :)

[AnupamSaraph]

There are some instructions in https://github.com/plotly/plotly.js/blob/master/CONTRIBUTING.md#development which is what we use to build development bundles... let me know if that's enough to get you started! Thanks for looking into it :)

@donJayamanne

[SHAHRUKH-KHAN]

Is this in progess? Facing the same issue.

[AnupamSaraph]

See https://github.com/microsoft/vscode-jupyter/issues/4364#issuecomment-817352686 for a work around Or https://github.com/microsoft/vscode-jupyter/issues/4364#issuecomment-830132169

[ethantenison]

I'm having this same issue except in Pycharm Jupyternotebooks on mac.

[yueguoguo]

Any progress on this?