Highchart pass values from draggable feature

Viewed 111

I have implemented dash with Highchart for my requirement . Objective is when I click a button the Highchart with display . Basically it has draggable points along y axis. Working Code below

import dash
import dash_alternative_viz as dav
import dash_html_components as html
from dash.dependencies import Input, Output
import random
import dash_core_components as dcc
from dash.exceptions import PreventUpdate

external_scripts = [
   "https://code.highcharts.com/highcharts.js",
   "http://code.highcharts.com/highcharts-more.js",
   "http://code.highcharts.com/maps/modules/map.js",
   "http://code.highcharts.com/maps/modules/data.js",
   "http://www.highcharts.com/samples/data/maps/world.js",
   "https://code.highcharts.com/modules/draggable-points.js"

]
app = dash.Dash(__name__,external_scripts=external_scripts)

app.layout = html.Div([
 html.Button(id="my_button", children="Apply!"),
 dav.HighChart(id="my_highchart")
])

@app.callback(
 Output("my_highchart", "options"), 
 [Input("my_button", "n_clicks")])
 
def random_chart(n_clicks):
   if n_clicks is None:
       raise PreventUpdate
   else:
      return {
         'title': { 'text': 'Demo' },
         'series': [{
         'data': [29, 71.5],
         'color':'white',
         'marker': {
               'fillColor': 'blue',
                 },
         'cursor': 'move',
          'dragDrop': {
            'draggableX': False,
            'draggableY': True
               }
           }]
       }
 
if __name__ == "__main__":
  app.run_server( port = 8052, debug=True)

My question is If I have moved y axis from 29 to 40 , how should I pass the new y axis value to the next callback function as input ? I could find the new y values in e.newPoint.y but im not able to pass that to dash variable which will be used as an Input to next callback in dash.

Any suggestions please !

Thanks, Meera

1 Answers
Related