If you still have constellate dev running, then your changes should already be loaded. If not, run constellate dev getting-started.ipynb and then navigate to localhost:3000. Select the "Getting Started" notebook and then navigate to the second page. You should see something like this:

image.png

Let's go over what Constellate did. If you're just trying to get your feet wet, feel free to just go to the next page, but it's useful if you want to understand the behind-the-scenes action.

  • Constellate sees a Markdown cell followed by a Python cell that produces a static image as output, and it further sees that you import matplotlib.
  • Constellate applies a custom theme to the plot. There are several reasons for this:
    • The theme has matching light and dark versions, so toggling the dark theme will change the plot to match.1
    • There are sister themes for other common Python visualization libraries, so mixing matplotlib and bokeh plots will maintain a single visual style.
    • Referring to colors used in a plot is fairly common, and doing that with dark mode support requires Constellate knowing what those colors are. Note how I use <span color='text-c1'>normal</span> to make normal colored to match the color used in the plot, in both light and dark mode. There's more on this in the user guide.
  • Constellate, as noted above, then runs the cell2 twice: once to generate a light-mode version, and once to generate a dark-mode version. These are then saved as images and included in the processed getting-started.constellate file used to inform the server.

  1. Note how the hues used are in the same order: a dark blue in the light theme becomes a light blue in the dark theme, so you can still talk about "the blue line" and make sense.

If you still have constellate dev running, then your changes should already be loaded. If not, run constellate dev getting-started.ipynb and then navigate to localhost:3000. Select the "Getting Started" notebook and then navigate to the second page. You should see something like this:

image.png

Let's go over what Constellate did. If you're just trying to get your feet wet, feel free to just go to the next page, but it's useful if you want to understand the behind-the-scenes action.

  • Constellate sees a Markdown cell followed by a Python cell that produces a static image as output, and it further sees that you import matplotlib.
  • Constellate applies a custom theme to the plot. There are several reasons for this:
    • The theme has matching light and dark versions, so toggling the dark theme will change the plot to match.1
    • There are sister themes for other common Python visualization libraries, so mixing matplotlib and bokeh plots will maintain a single visual style.
    • Referring to colors used in a plot is fairly common, and doing that with dark mode support requires Constellate knowing what those colors are. Note how I use <span color='text-c1'>normal</span> to make normal colored to match the color used in the plot, in both light and dark mode. There's more on this in the user guide.
  • Constellate, as noted above, then runs the cell2 twice: once to generate a light-mode version, and once to generate a dark-mode version. These are then saved as images and included in the processed getting-started.constellate file used to inform the server.

  1. Note how the hues used are in the same order: a dark blue in the light theme becomes a light blue in the dark theme, so you can still talk about "the blue line" and make sense.