Black Lives Matter. Please consider donating to Black Girls Code today.

Changing Divs on screen with functions and Markdown included

I would like to set up my dash app similar to the drug discovery app example here:

However, I am not quite sure what was used to change graphs functionally and I would like to change the markdown text as well. In an html sense I would like to change the whole parent div with all its elements being displayed by pressing a button.

I have most of my experience in c++ so I apoligize if my explanation isn’t clear.

Note that for all of these gallery examples, the source code is included. See the “View the source” link below the GIFs in

Is there a way to return markdown and divs in Dash functions? I’m pretty sure I understand how to return the different graphs.

Yup, you would update the children property of a component and your callback would return your new set of components. I recommend searching children inside the forum for examples and reading through carefully. In particular, note:

Remember how every component was described entirely through its set of keyword arguments? Those properties are important now. With Dash interactivity, we can dynamically update any of those properties through a callback function. Frequently we’ll update the children of a component to display new text or the figure of a dcc.Graph component to display new data, but we could also update the style of a component or even the available options of a dcc.Dropdown component!

Great thank you! I am a bit confused, however, about return graphs. Is the general idea to save the graph data and layout in a dictionary and then return this in a later function?