From the course: Interactive Dashboards with Plotly and Dash
Unlock this course with a free trial
Join today to access over 25,300 courses taught by industry experts.
Demo: Multiple tabs
From the course: Interactive Dashboards with Plotly and Dash
Demo: Multiple tabs
- [Instructor] And the first thing that I'm going to do is open up dcc.Tabs. This will allow me to embed multiple tabs within them as children. And so let's go ahead and do dcc.Tab, and we'll give this Tab 1. And in order to embed multiple tabs, we want to open up a list here. So I'll go ahead and do that, comma, dcc.Tab, and we'll do Tab 2. All right, and let's take a look. And so we have this very ugly tab-based structure. We don't even have titles for our tabs, but you will notice that the text changes here. So let's go ahead and give these labels. So label equals Tab 1 and label equals Tab 2. Okay, and so now we have nice titles for each of our tabs. And of course, when we know what the contents of these are, we should give them relevant titles. But right now we're just playing with tabs. And so one other thing to point out here is another argument of dcc.Tabs is class name. You'll notice that our style was white. It's a default style, but if we go ahead and do class name equals…
Practice while you learn with exercise files
Download the files the instructor uses to teach the course. Follow along and learn by watching, listening and practicing.
Contents
-
-
-
-
-
-
-
(Locked)
Intro to dashboard layouts2m 26s
-
(Locked)
Visual elements and layout options4m 40s
-
(Locked)
Revisiting Dash app layouts3m 54s
-
(Locked)
HTML and markdown7m 17s
-
(Locked)
Assignment: HTML and markdown2m 15s
-
(Locked)
Solution: HTML and markdown2m 28s
-
(Locked)
HTML styles5m 58s
-
(Locked)
Styling interactive elements4m 9s
-
(Locked)
Styling Plotly figures3m 4s
-
(Locked)
Assignment: App styling1m 26s
-
(Locked)
Solution: App styling2m 25s
-
(Locked)
Dash Bootstrap components4m 10s
-
(Locked)
Dash Bootstrap themes5m 1s
-
(Locked)
Demo: Applying a Bootstrap theme4m 27s
-
(Locked)
Grid-based layouts6m 44s
-
(Locked)
Demo: Grid-based layouts5m 54s
-
(Locked)
Multiple tabs3m 45s
-
(Locked)
Demo: Multiple tabs3m 48s
-
(Locked)
Assignment: Building a layout1m 27s
-
(Locked)
Solution: Building a layout3m 10s
-
(Locked)
Key takeaways2m 9s
-
(Locked)
-
-