Today we’re launching Plotly Express, a new Python library for data visualization built on top of Plotly.py… and it’s perfect for Dash! Read more about how it works in our Medium post: https://medium.com/@plotlygraphs/introducing-plotly-express-808df010143d
If you want to see Plotly Express working with Dash, you can check out a short and sweet sample app here: https://github.com/plotly/dash-px/blob/master/app.py
Here’s what that app looks like:
So nice! I’ve been using plotly_express for my last couple of Dash apps that I’ve made and it’s been 
. Charts that used to take ~15-100 lines of code now only take 2.
Highly recommend everyone take some time and check it out.
We are living in the future 
I just can’t keep up with y’all!
Thanks again! As ever this is forever making our development lives simpler and richer. I can’t wait to start experimenting with this.
This is great!
Love the comparison with Seaborn and matplotlib.
Quick question about using this with dash - what is the best practice to add multiple scatter traces using plotly express?
Currently i do something like
trace_list = list()
trace1 = go.Scattergl(......._
trace2 = go.Scattergl(.....)
trace_list.append(trace1)
trace_list.append(trace2)
If the callback output is Output("graph_id","figure") then i usually : return {"data":trace_list}
Is it similar for using plotly express?
Can i append px.scatter(data, x="column_name", y="column_name") to a list and then return that to the data key of the figure dictionary?
@adi using px with Dash is a bit different: px.scatter() returns a Figure object which you can return directly. Now it does contain traces in a data list, but if you pull them out and return them directly you’ll be missing the corresponding layout object which is likely necessary to render properly.
This looks amazing, can’t wait to try it out!
So is it possible to append multiple traces onto the same plot with plotly express or is it better to revert to full-fledged plotly for that?
Super excited to integrate px into my workflow!
First, thanks for this amazing work you’re great! Quick question: how do you define the layout properties in, for example, the px.scatter() arguments? I read in the support section that it is “A dict of string/value properties that will be passed to the Layout constructor” but i can’t figure out the way of passing it as arguments.
EDIT:
Figured it out! if you have fig = px.scatter() all you have to do before returning fig to the graph is set layout properties like this: fig.layout.font = dict(family=‘Helvetica’) and so on
@jbeyer px will return a full figure which likely will contain multiple traces, so the recommended workflow is the one mentioned by @jorge243 i.e. either use the output of px directly or mutate it before passing it into dcc.Graph(figure=fig)
One extra note is that while you can use
fig = px.scatter()
fig.layout.font = dict(family="Helvetica")
return dcc.Graph(figure=fig)
You can also one-line it with something like
return dcc.Graph( figure=px.scatter(...).update(layout={"font": {"family": "Helvetica"}}) )
because Figure.update() returns the mutated figure 
@nicolaskruchten As a test I wanted to see how Plotly Express works with Dash. The chart loads properly, but the year slider animation does not start. I am using the gapminder example from the Plotly Express guides.
import dash
import dash_html_components as html
import dash_core_components as dcc
import plotly_express as px
app = dash.Dash(__name__)
gapminder = px.data.gapminder()
app.layout = html.Div(
html.Div([
dcc.Graph(figure=px.scatter(gapminder, 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]))
])
)
if __name__ == '__main__':
app.run_server(debug=True)
dash==0.40.0
dash-html-components==0.15.0
dash-core-components==0.45.0
plotly-express==0.1.3
Is there something I am missing?
If you still need help. The way i managed to do it was using:
fig = px.bar(df, x=‘x’, y=‘y’)
fig2 = px.line(df, x=‘x’, y=‘y’)
fig.append_trace(fig2.data[0],None,None)
@XFaCToZ2 yes, Dash doesn’t handle animation frames at the moment, so I would recommend implementing the animation controls with html buttons and a slider outside of the figure.
@jorge243 yep this is how to do it for now! We’re working on a px-native composition API but it’s not quite ready yet
Hi @jorge243,
Can you please provide a full example? It would be ideal if you could make the changes to the example I provided.
I am not quite sure where this new code will go in regard to a Dash app, and I also don’t quite understand how this will allow an animation to work.
Thank you!
@nicolaskruchten I see - thank you for the information.
When I try to display one of the sample plots without using Dash, the code executes and completes but no chart appears. For example:
import plotly_express as px
iris = px.data.iris()
px.scatter(iris, x="sepal_width", y="sepal_length")
Is there some sort of show() method for Plotly Express? I’m using Pycharm 2018.2.4 (Community Edition)
I don’t think we support PyCharm yet for inline display, mostly Jupyter Notebooks / JupyterLab. Hopefully within a month we will have a way to see these in PyCharm and other editors directly
You’re breaking my heart @nicolaskruchten! JK
In the meantime, would you recommend a different python package to achieve the time animations? Or if you have a full example using jorge’s suggestion I would be happy to use that.
Thanks!
@nicolaskruchten @jorge243 Any chance I can get a full example of the time slider animation?