-
Notifications
You must be signed in to change notification settings - Fork 1
/
08_dash_01.py
62 lines (55 loc) · 1.77 KB
/
08_dash_01.py
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
import dash
import dash_core_components as dcc
import dash_html_components as html
from dash.dependencies import Input, Output
import plotly.graph_objs as go
import pandas as pd
import base64
app = dash.Dash()
df = pd.read_csv('data/wheels.csv')
def encode_image(image_file):
encoded = base64.b64encode(open(image_file, 'rb').read())
return 'data:image/png;base64,{}'.format(encoded.decode())
app.layout = html.Div([
html.Div([
dcc.Graph(
id='wheels-plot',
figure={
'data': [
go.Scatter(
x = df['color'],
y = df['wheels'],
dy = 1,
mode = 'markers',
marker = {
'size': 12,
'color': 'rgb(51,204,153)',
'line': {'width': 2}
}
)
],
'layout': go.Layout(
title = 'Wheels & Colors Scatterplot',
xaxis = {'title': 'Color'},
yaxis = {'title': '# of Wheels','nticks':3},
hovermode='closest'
)
}
)], style={'width':'30%', 'float':'left'}),
html.Div([
html.Img(id='hover-image', src='children', height=300)
], style={'paddingTop':35})
])
@app.callback(
Output('hover-image', 'src'),
# [Input('wheels-plot', 'hoverData')]
[Input('wheels-plot', 'clickData')]
)
def callback_image(hoverData):
wheel=hoverData['points'][0]['y']
color=hoverData['points'][0]['x']
path = 'data/images/'
return encode_image(path+df[(df['wheels']==wheel) & \
(df['color']==color)]['image'].values[0])
if __name__ == '__main__':
app.run_server()