Skip to content
Expose plotly dash apps as django tags
Python Shell HTML
Branch: master
Clone or download
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
.vscode Update code to stub functions following Dash version update (#40) Sep 3, 2018
demo Add an extra hook for locating and loading stateless apps (#168) Jul 15, 2019
django_plotly_dash Fix typo and bump version (#169) Jul 16, 2019
docs Add online demo info to documentation and readme (#156) May 17, 2019
.gitignore
.travis.yml Upgrade ci build (#144) Apr 21, 2019
CONTRIBUTIONS.md Update CONTRIBUTIONS.md Jun 20, 2019
LICENSE Added license to documentation Aug 5, 2018
MANIFEST.in Prerelease version 0.5.0 (#13) Jul 18, 2018
README.md Add online demo info to documentation and readme (#156) May 17, 2019
check_code Initial arguments (#32) Aug 20, 2018
check_code_demo Initial arguments (#32) Aug 20, 2018
check_code_demo_test Initial arguments (#32) Aug 20, 2018
check_code_dpd Prerelease version 0.5.0 (#13) Jul 18, 2018
dev_requirements.txt Improve docs and other fixes (#151) May 5, 2019
dev_requirements.yaml Adding coveralls Nov 10, 2018
frozen_dev.txt Release 1.0.0 (#167) Jul 15, 2019
make_env Prerelease version 0.5.0 (#13) Jul 18, 2018
prepare_demo Serve locally (#133) Apr 10, 2019
prepare_redis Prerelease version 0.5.0 (#13) Jul 18, 2018
pylintrc
requirements.txt Upgrade ci build (#144) Apr 21, 2019
requirements.yaml added requirements for conda environments using .yaml files. Most of … Sep 13, 2018
setup.py Add better sourcing of version info (#83) Dec 8, 2018

README.md

django-plotly-dash

PyPI version Downloads Develop Branch Build Status Coverage Status Documentation Status

Expose plotly dash apps as Django tags. Multiple Dash apps can then be embedded into a single web page, persist and share internal state, and also have access to the current user and session variables.

See the source for this project here: https://github.com/GibbsConsulting/django-plotly-dash

This README file provides a short guide to installing and using the package, and also outlines how to run the demonstration application.

More detailed information can be found in the online documentation at https://readthedocs.org/projects/django-plotly-dash

An online version of the demo can be found at https://djangoplotlydash.com

Installation

First, install the package. This will also install plotly and some dash packages if they are not already present.

pip install django_plotly_dash

Then, add django_plotly_dash to INSTALLED_APPS in your Django settings.py file

INSTALLED_APPS = [
    ...
    'django_plotly_dash.apps.DjangoPlotlyDashConfig',
    ...
    ]

The application's routes need to be registered within the routing structure by an appropriate include statement in a urls.py file::

urlpatterns = [
    ...
    path('django_plotly_dash/', include('django_plotly_dash.urls')),
]

The name within the URL is not important and can be changed.

For the final installation step, a migration is needed to update the database::

./manage.py migrate

Note that this package requires version 2.0 or greater of Django, due to the use of the path function for registering routes.

Further configuration, including live updating to share application state, is described in the online documentation.

Demonstration

The source repository contains a demo application. To clone the repo and lauch the demo:

git clone https://github.com/GibbsConsulting/django-plotly-dash.git

cd django-plotly-dash

./make_env                # sets up a virtual environment for development
                          #   with direct use of the source code for the package

./prepare_redis           # downloads a redis docker container
                          #   and launches it with default settings
                          #   *THIS STEP IS OPTIONAL*

./prepare_demo            # prepares and launches the demo
                          #   using the Django debug server at http://localhost:8000

Usage

To use existing dash applications, first register them using the DjangoDash class. This replaces the Dash class of the dash package.

Taking a very simple example inspired by the excellent getting started documentation:

import dash
import dash_core_components as dcc
import dash_html_components as html

from django_plotly_dash import DjangoDash

app = DjangoDash('SimpleExample')

app.layout = html.Div([
    dcc.RadioItems(
        id='dropdown-color',
        options=[{'label': c, 'value': c.lower()} for c in ['Red', 'Green', 'Blue']],
        value='red'
    ),
    html.Div(id='output-color'),
    dcc.RadioItems(
        id='dropdown-size',
        options=[{'label': i, 'value': j} for i, j in [('L','large'), ('M','medium'), ('S','small')]],
        value='medium'
    ),
    html.Div(id='output-size')

])

@app.callback(
    dash.dependencies.Output('output-color', 'children'),
    [dash.dependencies.Input('dropdown-color', 'value')])
def callback_color(dropdown_value):
    return "The selected color is %s." % dropdown_value

@app.callback(
    dash.dependencies.Output('output-size', 'children'),
    [dash.dependencies.Input('dropdown-color', 'value'),
     dash.dependencies.Input('dropdown-size', 'value')])
def callback_size(dropdown_color, dropdown_size):
    return "The chosen T-shirt is a %s %s one." %(dropdown_size,
                                                  dropdown_color)

Note that the DjangoDash constructor requires a name to be specified. This name is then used to identify the dash app in templates:

{% load plotly_dash %}

{% plotly_app name="SimpleExample" %}

The registration code needs to be in a location that will be imported into the Django process before any model or template tag attempts to use it. The example Django application in the demo subdirectory achieves this through an import in the main urls.py file; any views.py would also be sufficient.

Whilst this example allows for the direct use of existing Dash applications, it does not provide for the sharing or updating of internal state. The online documentation provides details on using these and other additional features.

Development

The make_env script sets up the development environment, and pulls in the packages specified in the dev_requirements.txt file. The check_code script invokes the test suite (using pytest) as well as invoking pylint on both the package and the associated demo.

You can’t perform that action at this time.