How to get plotly working with FastPages
How to get plotly to work with fastai blogs
# Basic plotly figure
import plotly.express as px
import plotly.io as pio
from IPython.display import HTML
pio.templates.default = "seaborn"
gapminder = px.data.gapminder()
fig = px.violin(
gapminder,
x="continent",
y="lifeExp",
color="continent",
labels={"lifeExp": "life expectancy at birth"},
)
Now that we have the figure, if we were to simply run fig.show()
we would be able to see the figure locally but the jekyll build will fail when trying to render the page. In order to get the figure to show locally and on the blog post we have to use a workaround.
First you will need to add a hide tag at the beginning of the code block.
# #hide
fig.show()
This will tell jekyll (i think?) to ignore the output and not show any of it, because it is now being ignored the errors are gone. But, we now dont have a plot on the blog post, to get it to render will need to follow the next step.
To get the figure to render on the blog you will need to convert the figure to html, and specify the js (specifing the js is crucial, it will not work otherwise). Then use IPython to render the HTML. You can add a hide_input
tag to hide this block but show the plot
# #hide_input
HTML(fig.to_html(include_plotlyjs='cdn'))