Plotly Dash API documentation

Question

I recently started working on my very first dashboard application using dash.

The tutorials are comprehensible, however, I have a hard time handling the front end details because I cannot find an API reference. Specifically, each element accepts a style argument that let's us modify some CSS details, like text alignment, fonts etc. I have seen some examples in the tutorials but I would love to have an exhaustive list of everything I can pass there.

As an example, I want to create a table but the columns are too close together. I need to control the spacing between them and I imagine there should be an argument like padding, spacing, borderSize... you get the point. Where can I find these details?

Answer 1

It could be possible to edit some styling by passing some keywords to the Dash component. It depends on the component itself.

For example, if you are using DataTable from dash-table-experiment:

import dash_table_experiments as dt
help(dt.DataTable)

you can see that the API of this component allows you to set things like column_widths (list; optional) and min_width (number; optional).

If you need some more complex styling (e.g. a yellow background with linear gradient for all even table cells) I'm afraid you'll have to know some CSS.

A few additional resources:

• Currently the Dash styleguide is based on the Skeleton CSS framework
• Each dcc.Graph is composed by a figure and a layout. Here is the plotly.js figure reference
• For things like showing/hiding legends, traces, etc, have a look at the plotly.js configuration options

Answer 2

• For HTML: https://github.com/plotly/dash-html-components
• For component: https://github.com/plotly/dash-core-components

Seems the dash project didn't create the user-friendly API document (I guess it was related to their business strategy).

The only way to get the help is the dash community and git-code project.