Created
May 7, 2020 21:14
-
-
Save alexcjohnson/52b6e679528ddff39254d41348c70ab3 to your computer and use it in GitHub Desktop.
Dash app tutorial wrapper
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
# | |
# Dash app wrapper: show an app next to its code, | |
# for tutorials and presentations. | |
# | |
# Replace "todo" on the first line with your app, tweak the styles to taste. | |
# Then run this file as a dash app. | |
# | |
# Caveats: | |
# - Your app must be in a place you can import it from this script | |
# - In this version, your app must create an `app` variable, and | |
# its `layout` must be a component, not a function. | |
# | |
import todo as example | |
import dash_core_components as dcc | |
import dash_html_components as html | |
with open(example.__file__) as f: | |
example_text = f.read() | |
app = example.app | |
example_layout = app.layout | |
app.layout = html.Div([ | |
example_layout, | |
dcc.Markdown( | |
"```py\n" + example_text + "\n```", | |
style={ | |
"position": "fixed", | |
"right": 0, | |
"top": 0, | |
"width": "60%", | |
"height": "100%", | |
"overflow": "scroll", | |
"borderLeft": "2px solid #ccc", | |
"fontSize": "1.2em", | |
"paddingLeft": "5px", | |
"backgroundColor": "#fff" | |
} | |
) | |
], style={ | |
"backgroundColor": "#e4f5f2", | |
"height": "100%", | |
"position": "fixed", | |
"left": 0, | |
"top": 0, | |
"width": "100%", | |
"padding": "10px" | |
}) | |
if __name__ == "__main__": | |
app.run_server(debug=True, dev_tools_ui=False) |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment