Dropdown widgets for .offline.plot in Python

📊 Plotly Python
1

I’m trying to create an interactive dashboard similar to what is shown in the 2nd example here, but I want to output it to html in offline mode rather than using the plotly servers or a notebook, I’m having trouble messing about with the code. From the 2nd example, to get a drop down widget that will filter a chart it says:

import pandas as pd
import plotly.plotly as py

from ipywidgets import widgets
from IPython.display import display
from plotly.graph_objs import *
from plotly.widgets import GraphWidget

# we will define a function that will handle the input from the dropdown widget
def update_plot(complaint):
    is_noise = complaints['Complaint Type'] == complaint['new']
    temp = complaints[is_noise]
    data = temp.groupby(complaints['Borough'])['Complaint Type'].count()
    
    x = []
    y = []
    for i in range(len(data)):
        x.append(data.index[i])
        y.append(data[i])

    graph.restyle({
                'x': [x],
                'y': [y],
            })
    graph.relayout({'title': 'Number of {} Complaints in New York by Borough'.format(complaint['new'])})

# we will define both the dropdown widget, as well as the graph widget
w = widgets.Dropdown(
    options= list(complaints['Complaint Type'].unique()),
    value='Noise - Street/Sidewalk',
    description='Complaint Type:',
)
graph = GraphWidget('https://plot.ly/~kevintest/1176/')

# observe will set a listener for activity on our dropdown menu
w.observe(update_plot, names="selected_label") 

display(w)
display(graph)

Because I’m using offline plotting rather than a notebook, I usually plot the data at the end of my code with (for example):

data = [trace0, trace1,trace2,trace3,trace4,trace5]

fig = go.Figure(data = data, layout = layout)

py.offline.plot(fig, show_link=False, filename="Bubble.html")

Is it possible to alter it slightly so I can export the drop down widget with my graph in offline mode? I know inbuilt drop downs have recently been implemented, but I’m not sure if they have the level of filtering I require for my graphs (as in I want to get the drop down embedded within my output.)

2

Hi there,

I ran your code and got an error. It didn’t recognize ‘complaints’. Do you mind letting me know what module it comes from, so I can import it properly and then help with your question?

Thanks

3

I presume that complaints is what they’ve named the pandas dataframe. The example the docs gives says it uses pandas, but doesn’t show you the actual data file they’re using!

4

There was an error in the docs, as what you mentioned is true: there was no data for that example. I am in the process of fixing it so I can proceed with helping you.

5

Thanks very much, Adam, very much appreciated! :slight_smile:

6

Any update on this? Does this portion here include the Custom Javascript which conducts the callback? Can’t something be written directly into the code, in order to use the Widget OFFLINE mode?

graph = GraphWidget(‘bar chart made by Kevintest | plotly’)

7

I am also quite interested on this as I’m using plotly in offline mode and would like to implement interaction through widgets.

8

Any update on this? I am also very interested in this.

9

@liyang I recommend using Dash for dropdowns with Plotly graphs in Python:
https://plot.ly/dash/dash-core-components

Dash provides more flexibility in the styling and actions of the dropdown.

If you don’t want to use Dash, docs for more limited dropdowns with the Plotly Python library are here:

These dropdowns can restyle the graph and change its data, but they can’t call more sophisticated callbacks in Python like in Dash.

10

I’ve read those docs but can’t figure out how to use a dropdown menu to select (or change) the dataframe to use as source data for plotting.

I want to export a simple html file but don’t want to use Dash as it would require a server, dealing with waitresses etc.