the graph layout changes when submitting a new term, but not when adding or removing associations

dash_app/app.py

@@ -16,7 +16,8 @@ external_stylesheets = [
 ]
 
 
-app = dash.Dash(name=__name__, external_stylesheets=external_stylesheets, url_base_pathname='/msx/')
+app = dash.Dash(name=__name__, external_stylesheets=external_stylesheets, url_base_pathname='/msx/',
+                suppress_callback_exceptions=True)
 graph = Graph()
 graph.fill_with_associations('fruit')
 cyto_graph = graph.get_graph('msx-graph')
@@ -32,14 +33,14 @@ app.layout = html.Div(children=[
                     html.H2(children='Term:'),
                 ]),
                 html.Div(className='col-9', children=[
-                    dcc.Input(id='base-word-input', value='fruit', type='text', className='form-control form-control-lg'),
+                    dcc.Input(id='base-word-input', value='', type='text', className='form-control form-control-lg'),
                 ]),
                 html.Div(className='col-2', children=[
-                    html.Button(id='base-word-submit', n_clicks_timestamp=0, children='Submit Term', className='btn btn-success btn-lg')]),
+                    html.Button(id='submit-word-button', n_clicks_timestamp=0, children='Submit Term', className='btn btn-success btn-lg')]),
                 ])
             ]),
         html.Br(),
-        cyto_graph,
+        html.Div(id='msx-graph-div', children=[cyto_graph]),
         html.Div(children=[
             html.Div(className='row', children=[
                 html.Div(className='col-3', children=[
@@ -64,27 +65,29 @@ server.config['SECRET_KEY'] = os.environ['MSX_SECRET_KEY']
 
 
 @app.callback(
+    Output(component_id='msx-graph', component_property='autoRefreshLayout'),
     Output(component_id='msx-graph', component_property='elements'),
-    Input(component_id='base-word-submit', component_property='n_clicks_timestamp'),
     Input(component_id='add-word-button', component_property='n_clicks_timestamp'),
     Input(component_id='remove-word-button', component_property='n_clicks_timestamp'),
+    Input(component_id='submit-word-button', component_property='n_clicks_timestamp'),
     State(component_id='msx-graph', component_property='tapNodeData'),
+    State(component_id='add-word-input', component_property='value'),
     State(component_id='base-word-input', component_property='value'),
-    State(component_id='add-word-input', component_property='value')
 )
-def select_node(submit_button_ts, add_button_ts, remove_button_ts, graph_selected, base_word, add_word):
-    if remove_button_ts > submit_button_ts and remove_button_ts > add_button_ts:
+def graph_elements_callback(add_button_ts, remove_button_ts, submit_button_ts, graph_selected, add_word, base_word):
+    if submit_button_ts > remove_button_ts and submit_button_ts > add_button_ts:
+        graph.fill_with_associations(base_word)
+        graph_elements = graph.get_graph_elements()
+        return True, graph_elements
+
+    if remove_button_ts > add_button_ts:
         if graph_selected is not None:
             graph.remove_node(graph_selected['label'])
 
-    if submit_button_ts > add_button_ts and submit_button_ts > remove_button_ts:
-        if base_word is not None and base_word != '':
-            graph.fill_with_associations(base_word)
-
-    if add_button_ts > submit_button_ts and add_button_ts > remove_button_ts:
+    if add_button_ts > remove_button_ts:
         if add_word is not None and add_word != '':
             graph.add_node(add_word)
             graph.add_edge(graph.get_base_word(), add_word)
 
     graph_elements = graph.get_graph_elements()
-    return graph_elements
+    return False, graph_elements

dash_app/graph.py

@@ -73,7 +73,8 @@ class Graph:
     def get_graph(self, component_id):
         elements = self.get_graph_elements()
         return cyto.Cytoscape(id=component_id,
-                              layout={'name': 'cose', 'animate': False},
+                              autoRefreshLayout=True,
+                              layout={'name': 'cose', 'animate': True},
                               style={'width': '100%', 'height': '550px'},
                               elements=elements,
                               userZoomingEnabled=False,

dash_app/words.py

@@ -8,7 +8,7 @@ class AssociatedWords:
         self.N_RESULTS = 10
         print("\n Word2Vec model is loading.This can take a couple of minutes.")
         self.model = api.load('glove-twitter-200')
-        print("\n Word2Vec model is ready. Enjoy!!!")
+        print(" Word2Vec model is ready. Enjoy!!!\n")
 
         self.base_word = None
         self.gensim_result = None
@@ -18,6 +18,7 @@ class AssociatedWords:
     def set_base_word(self, word):
         self.base_word = word
         self.gensim_result = self.model.most_similar(self.base_word, topn=self.N_RESULTS)
+        # self.gensim_result = [('apple', 1.0), ('banana', 1.0), ('strawberry', 1.0)]
         self.filter_results()
 
     def filter_results(self):