dash-draggable
dash-draggable copied to clipboard
deltaX/deltaY properties not set when using handler
This appears to be the case in the following example where deltaX/deltaY properties always take on value of 0:
import dash
import dash_html_components as html
from dash.dependencies import Output, Input, State
import dash_core_components as dcc
import dash_daq as daq
import dash_draggable as drag
import sd_material_ui
external_stylesheets = ['https://codepen.io/chriddyp/pen/bWLwgP.css']
app = dash.Dash(external_stylesheets=external_stylesheets)
app.config['suppress_callback_exceptions']=True
# A FlatButton on Paper
app.layout = html.Div([
drag.dash_draggable(id='dragger',
handle='.handle',
defaultPosition={'x': 200, 'y': 0},
children=[
html.Div([
sd_material_ui.Paper(children=[
sd_material_ui.IconButton(
id='button',
iconClassName='glyphicon glyphicon-menu-hamburger',
iconStyle={'color': 'grey',
'width': 50,
'height': 50,
'position': 'relative',
'top': '2px',
'left': '-12px'},
tooltip='Drag Me', touch=True,
tooltipPosition='bottom-right')],
zDepth=3,
circle=True,
style=dict(height=50,
width=50,
textAlign='center',
position='relative',
display='inline-block',
top='25px',
left='-25px')
)], className='handle'),
html.Div(id='graph-container')
]),
])
@app.callback(
Output('graph-container', 'children'),
[Input('button', 'n_clicks')],
[State('dragger', 'deltaX'),
State('dragger', 'deltaY')]
)
def hide_graph(clicks: int, deltaX: int, deltaY: int):
KNOB = sd_material_ui.Paper(zDepth=1,
style=dict(height=625,
width=750),
children=[
html.Div([
daq.Knob(
label="Gradient Ranges",
value=7,
size=500,
color={"gradient": True,
"ranges": {"red": [0, 5], "yellow": [5, 9],
"green": [9, 10]}},
style=dict(position='relative',
top='25px',
left='0px'))
])
]),
print(deltaX, deltaY)
# <Graph Render Logic dependent on deltaX, deltaY>
if __name__ == '__main__':
app.css.append_css({'external_url': 'https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css'})
app.run_server(debug=True)
Perhaps there are conflicts from coexisting/nested components? Needs evaluation
Hmm could you try rewriting the app with all components in the layout?
Ill try that out and post back
Issue not resolved but found a workaround for goal - will post PR here soon