Learn how to use Dash Bio for next-gen sequencing & quality control. 🧬 Register for the Oct 27 webinar.

Django_plotly_dash Unable to find stateless DjangoApp called simpleexample

Hi,

I’m using django_plotly_dash for a webapp and i does it not allow to use Dash applications with a different name to SimpleExample

I don’t know what I’ve done wrong.

http://localhost:8080/sima/data_exploration

The page source code from tag {% plotly_app_bootstrap name="example" aspect="21by9" %} has

<div class="embed-responsive embed-responsive-21by9">
    <iframe src="/django_plotly_dash/app/example/" class="embed-responsive-item"></iframe> </div>

if i go to url http://localhost:8080/django_plotly_dash/app/example/

My idea is to integrate several types of graphs (bubble, boxplot, lines) within the same page.

Note: if I change the name of the Dash application to SimpleExample then it works, but I can’t understand how to change it.

My Code is

data_exploration.html

{% extends "app/master.html" %}

{% block head %}

<script src="https://cdn.plot.ly/plotly-latest.min.js"></script>

{% load plotly_dash %}

<h2>SIMA</h2>

{% endblock %}

{% block content %}

<div class="row justify-content-center">
    {% plotly_app_bootstrap name="SimpleExample" aspect="21by9" %}
</div>

{% endblock %}

example.py

# Dash

from django_plotly_dash import DjangoDash

import dash_core_components as dcc

import dash_html_components as html

from dash.dependencies import Input, Output

# Plotly

from plotly.subplots import make_subplots

import plotly.graph_objects as go

# Pandas

import pandas as pd

import math

external_stylesheets = ['https://codepen.io/chriddyp/pen/bWLwgP.css']

app = DjangoDash('SimpleExample', external_stylesheets=external_stylesheets)

df = pd.read_csv('https://raw.githubusercontent.com/plotly/datasets/master/gapminderDataFiveYear.csv')

app.layout = html.Div([

    dcc.Graph(id='graph-with-slider'),

    dcc.Slider(

        id='year-slider',

        min=df['year'].min(),

        max=df['year'].max(),

        value=df['year'].min(),

        marks={str(year): str(year) for year in df['year'].unique()},

        step=None

    )

])

@app.callback(

    Output('graph-with-slider', 'figure'),

    [Input('year-slider', 'value')])

def update_figure(selected_year):

    filtered_df = df[df.year == selected_year].sort_values(['continent', 'country'])

    hover_text = []

    bubble_size = []

    for index, row in filtered_df.iterrows():

        hover_text.append(('Country: {country}<br>'+

                        'Life Expectancy: {lifeExp}<br>'+

                        'GDP per capita: {gdp}<br>'+

                        'Population: {pop}<br>'))

        bubble_size.append(math.sqrt(row['pop']))

    filtered_df['text'] = hover_text

    filtered_df['size'] = bubble_size

    sizeref = 2. * max(filtered_df['size']) / (100 ** 2)

    # Dictionary with dataframes for each continent

    continent_names = ['Africa', 'Americas', 'Asia', 'Europe', 'Oceania']

    continent_data = {continent:filtered_df.query("continent == '%s'" %continent)

                                for continent in continent_names}

    # Create figure

    fig = go.Figure()

    for continent_name, continent in continent_data.items():

        fig.add_trace(go.Scatter(

            x=continent['gdpPercap'], y=continent['lifeExp'],

            name=continent_name, text=continent['text'],

            marker_size=continent['size'],

            ))

    fig.update_traces(mode='markers', marker=dict(sizemode='area',

                                              sizeref=sizeref, line_width=2))

    fig.update_layout(

        title='Life Expectancy v. Per Capita GDP, 2007',

        xaxis=dict(

            title='GDP per capita (2000 dollars)',

            gridcolor='white',

            type='log',

            gridwidth=2,

        ),

        yaxis=dict(

            title='Life Expectancy (years)',

            gridcolor='white',

            gridwidth=2,

        ),

        paper_bgcolor='rgb(243, 243, 243)',

        plot_bgcolor='rgb(243, 243, 243)',

    )

    fig.update_layout(transition_duration=500)

    return fig

Thanks!

@sguerrero in your code you have:

This is setting the name of app to be SimpleExample - this is the name that the template tag uses to determine which Dash app to render. Use a different name for each one that you want to use.

Thanks for the reply.

I don’t know exactly what happened (or what I did wrong), but even changing the app name this showed the error, what I did was from the django admin, delete the SimpleExample app and then it worked.

Regards.