Dash wrapper for Plotly's react-chart-editor
Project description
Dash Chart Editor
Dash Chart Editor is a Dash component wrapper for the Plotly React Chart Editor package, enabling you to use an editor panel for Plotly charts in your Dash app.
Installation
pip install dash-chart-editor
To build locally see the Contributing Guide
Demo and Quickstart
import dash_chart_editor as dce
from dash import Dash, html
import pandas as pd
df = pd.read_csv('https://raw.githubusercontent.com/plotly/datasets/master/solar.csv')
app = Dash(__name__, external_scripts=["https://cdn.plot.ly/plotly-2.18.2.min.js"])
app.layout = html.Div([
html.H4("Dash Chart Editor Demo with the Plotly Solar dataset"),
dce.DashChartEditor(dataSources=df.to_dict("list")),
])
if __name__ == "__main__":
app.run_server(debug=True)
Examples
See more demo apps in the /examples
folder
-
quickstart.py The quickstart app shown above.
-
figure_templates.py - A demo on how to use plotly figure templates with the chart editor.
-
figure_templates_dbc.py - A demo of Bootstrap themed figure templates from the Dash Bootstrap Templates library.
-
customize.py - Example of ways to customize DashChartEditor
- add a logo with
logoSrc
- only allow certain figure types with
traceOptions
- set graph mode bar menu with
config
. See all the options https://github.com/plotly/plotly.js/blob/master/src/plot_api/plot_config.js.
- add a logo with
-
default_figure.py - Shows how to add a default figure to use when the app starts.
-
change_datasets.py - An example showing loading different datasets in a dropdown
-
display_dce_figure_in_dccGraph.py - This app shows how to save a figure edited in
dash-chart-editor
and using it in a different part of a dashboard - in this case it's displayed in adcc.Graph()
. -
three_figure_demo.py - This demos how to use a dash-chart-editor in a model to update three different figures in an app.
Contributing
We welcome contributions to dash-chart-editor. If you find a bug or something is unclear please submit a bug report, if you have ideas for new features please feel free to make a feature request.
If you would like to submit a pull request, please read our contributing guide, which contains instructions on how to build and install dash-chart-editor locally, and how to submit the pull request itself.
Dash Chart Editor Reference
Access this documentation in your Python terminal with:
>>> import dash_chart_editor
>>> help(dash_chart_editor.DashChartEditor)
- id (string; optional):
Dash prop to be registered for use with callbacks.
- annotateOptions (dict; default True):
Options that drive the available options under the "Annotate"
tree.
`annotateOptions` is a boolean | dict with keys:
- images (boolean; optional)
- shapes (boolean; optional)
- text (boolean; optional)
- config (dict; default {editable: True}):
Plotly config options, listed here:
https://github.com/plotly/plotly.js/blob/master/src/plot_api/plot_config.js.
- controlOptions (dict; default True):
Options that drive the available options under the "Control"
tree.
`controlOptions` is a boolean | dict with keys:
- menus (boolean; optional)
- sliders (boolean; optional)
- data (boolean | number | string | dict | list; optional):
Output data of the chart editor.
- dataSources (dict with strings as keys and values of type list; optional):
Input dataSources for driving the chart editors selections.
- figure (dict; optional):
Output figure of the chart editor (dcc.Graph esk output).
- frames (boolean | number | string | dict | list; optional):
Output frames of the chart editor.
- layout (boolean | number | string | dict | list; optional):
Output layout of the chart editor.
- loadFigure (dict with strings as keys and values of type boolean | number | string | dict | list; optional):
{data, layout, frames} given to the chart, used to populate
selections and chart when loading.
- logoSrc (string; optional):
Logo that will be displayed in the chart editor.
- logoStyle (dict; optional):
Style object of the Logo.
- saveState (boolean; default True):
When passed True, this will save the current state of the grid to `figure`.
- structureOptions (dict; default True):
Options that drive the available options under the "Structure"
tree.
`structureOptions` is a boolean | dict with keys:
- subplots (boolean; optional)
- traces (boolean; optional)
- transforms (boolean; optional)
- style (dict; default {width: '100%', height: '100%'}):
style of the whole editing element, including charting area.
- styleOptions (dict; default True):
Options that drive the available options under the "Style" tree.
`styleOptions` is a boolean | dict with keys:
- axes (boolean; optional)
- colorBars (boolean; optional)
- general (boolean; optional)
- legend (boolean; optional)
- maps (boolean; optional)
- traces (boolean; optional)
- traceOptions (boolean | number | string | dict | list; optional):
List of trace options to display.
Project details
Release history Release notifications | RSS feed
Download files
Download the file for your platform. If you're not sure which to choose, learn more about installing packages.
Source Distribution
Built Distribution
File details
Details for the file dash_chart_editor-0.0.1a5.tar.gz
.
File metadata
- Download URL: dash_chart_editor-0.0.1a5.tar.gz
- Upload date:
- Size: 2.2 MB
- Tags: Source
- Uploaded using Trusted Publishing? No
- Uploaded via: twine/4.0.2 CPython/3.11.0
File hashes
Algorithm | Hash digest | |
---|---|---|
SHA256 | 0f9db19afa8212e89443350f3f623f0d4d7caef7d417ae564d6336fad2ec101d |
|
MD5 | 2e02559a200f87d34f887fdda42b738b |
|
BLAKE2b-256 | f9e48abaf7b175bb147f98ff29846923a8c203a852d253e41a8d21dee28995c0 |
File details
Details for the file dash_chart_editor-0.0.1a5-py3-none-any.whl
.
File metadata
- Download URL: dash_chart_editor-0.0.1a5-py3-none-any.whl
- Upload date:
- Size: 2.2 MB
- Tags: Python 3
- Uploaded using Trusted Publishing? No
- Uploaded via: twine/4.0.2 CPython/3.11.0
File hashes
Algorithm | Hash digest | |
---|---|---|
SHA256 | cad60e37541a185fb135f0ea848bfc3a7547c54388d82d386670842646948d24 |
|
MD5 | ebeec2cdb2f33182a38d7a4e5de5513a |
|
BLAKE2b-256 | bf84e84f96f26a79be0d0accc8c2b62aee6183205c11252882b3180f7141d5e3 |