wip: initial silly plots

Author: agoose77

.github/workflows/deploy.yml

@@ -34,10 +34,16 @@ jobs:
       - uses: actions/setup-node@v4
         with:
           node-version: 18.x
+      - uses: actions/setup-python@v5
+        with:
+          python-version: '3.12' 
+          cache: 'pip' # caching pip dependencies
+      - name; Install Python dependencies
+        run: pip install -r requirements.txt
       - name: Install MyST Markdown
         run: npm install -g mystmd
       - name: Build HTML Assets
-        run: myst build --html
+        run: myst build --html --execute
       - name: Upload artifact
         uses: actions/upload-pages-artifact@v3
         with:

bokeh.md

@@ -0,0 +1,52 @@
+---
+kernelspec:
+  name: python3
+  display_name: Python 3
+---
+
+# Bokeh
+
+```{code-cell} python3
+import numpy as np
+from scipy.integrate import odeint
+
+from bokeh.plotting import figure, show
+from bokeh.io import output_notebook
+
+output_notebook()
+```
+
+```{code-cell} python3
+:name: fig-bokeh
+
+sigma = 10
+rho = 28
+beta = 8.0/3
+theta = 3 * np.pi / 4
+
+def lorenz(xyz, t):
+    x, y, z = xyz
+    x_dot = sigma * (y - x)
+    y_dot = x * rho - x * z - y
+    z_dot = x * y - beta* z
+    return [x_dot, y_dot, z_dot]
+
+initial = (-10, -7, 35)
+t = np.arange(0, 100, 0.006)
+
+solution = odeint(lorenz, initial, t)
+
+x = solution[:, 0]
+y = solution[:, 1]
+z = solution[:, 2]
+xprime = np.cos(theta) * x - np.sin(theta) * y
+
+colors = ["#C6DBEF", "#9ECAE1", "#6BAED6", "#4292C6", "#2171B5", "#08519C", "#08306B"]
+
+p = figure(title="Lorenz attractor example", background_fill_color="#fafafa")
+
+p.multi_line(np.array_split(xprime, 7), np.array_split(z, 7),
+             line_color=colors, line_alpha=0.8, line_width=1.5)
+
+show(p)
+```

index.md

@@ -1,11 +1,11 @@
-# The Basics
+# Plots
 
-## This is a Heading
+There are many plots, such as [](#fig-plotly-output) and [](#fig-bokeh-output). See them below!
 
-Style Sheets can target families of HTML elements like `h2`:
-:::{literalinclude} style.css
-:start-after: BEGIN-H2
-:end-before: END-H2
+:::{embed} #fig-plotly
+:remove-input: true
+
+A plotly figure.
 :::
 
-The `!important` here is required to override the more-specific CSS selectors from our theme.
+![](#fig-bokeh)

myst.yml

@@ -6,7 +6,9 @@ project:
   references:
     guide: https://mystmd.org/guide
   toc:
+    - file: index.md
     - file: bokeh.md
+    - file: plotly.md
 site:
   template: book-theme
   options:

plotly.md

@@ -0,0 +1,38 @@
+---
+kernelspec:
+  name: python3
+  display_name: Python 3
+---
+
+# Plotly
+
+```{code-cell} python3
+import plotly.graph_objects as go
+import numpy as np
+
+np.random.seed(1)
+```
+
+```{code-cell} python3
+#| label: fig-plotly
+
+# Number of data points
+N = 10000
+
+# Generate random data
+x = np.random.randn(N)
+y = np.random.randn(N).astype('float32')
+z = np.random.randint(size=N, low=0, high=256, dtype='uint8')
+c = np.random.randint(size=N, low=-10, high=10, dtype='int8')
+
+fig = go.Figure(data=[go.Scatter3d(
+    x=x,
+    y=y,
+    z=z,
+    marker=dict(color=c),
+    mode='markers',
+    opacity=0.2
+)])
+
+fig.show()
+```

requirements.txt

@@ -0,0 +1,6 @@
+scipy
+numpy
+plotly
+bokeh
+jupyter-server
+ipykernel