Black Lives Matter. Please consider donating to Black Girls Code today.

Explanation/References for New User

I am very new to Dash and Plotly with very little exposure to Python in general. I am working with on a project that involves transforming plotly data into a dash format. My coworker is fairly knowledgeable with plotly but does not know how to convert his plotly graphs to Dash. My job is to take the charts created by my coworker and make them more presentable and customizable with Dash. I have gone through the introductory Dash tutorial but would like to know if anyone has any more resources or advice to help me with this project. Thanks!

I am very new to Dash and Plotly with very little exposure to Python in general.

Having little exposure to Python will pose some issues since a lot of the things that you probably want to do in dash will require knowledge of pythonic patterns such as list comprehensions and dict comprehensions as well as the ability to inspect python objects and modules. If you learn a little bit each day your knowledge will soon buildup. Just take it slow and pay special attention to creating dictonary datatypes because that is how the logic flows from dash to plotly.js.

My coworker is fairly knowledgeable with plotly but does not know how to convert his plotly graphs to Dash

This is pretty simple since each figure object is essentially a dictionary, just written for javascript. For example, let’s take a look at the tutorial for line and scatter charts.

var trace1 = {
  x: [1, 2, 3, 4],
  y: [10, 15, 13, 17],
  mode: 'markers',
  type: 'scatter'
};

var trace2 = {
  x: [2, 3, 4, 5],
  y: [16, 5, 11, 9],
  mode: 'lines',
  type: 'scatter'
};

var trace3 = {
  x: [1, 2, 3, 4],
  y: [12, 9, 15, 12],
  mode: 'lines+markers',
  type: 'scatter'
};

var data = [trace1, trace2, trace3];

This would be the equivalent to writing:

import plotly.graph_objs as go

trace1 = {
  'x': [1, 2, 3, 4],
  'y': [10, 15, 13, 17],
  'mode': 'markers',
  'type': 'scatter'
}

trace2 = {
  'x': [2, 3, 4, 5],
  'y': [16, 5, 11, 9],
  'mode': 'lines',
  'type': 'scatter'
}

trace3 = {
  'x': [1, 2, 3, 4],
  'y': [12, 9, 15, 12],
  'mode': 'lines+markers',
  'type': 'scatter'
}

data = [trace1, trace2, trace3]
layout = go.Layout()
figure = go.Figure(data=data, layout=layout)

iplot(figure)

As for any resources, I’d say that it really depends on what you need help with. Off the top of my head I’d list:

  • python debugger. This would top my list. Using import pdb; pdb.set_trace() and then pdb.set_trace() for wherever you want to inspect what’s going on in the program
  • MDN developler docs for any layout/styles related questions
  • The community. If you stick around, you’ll see that we help out when we can.