concept-collection / numbl-embed-example
initial
Jeremy Magland <jmagland@flatironinstitute.org> committed commit f9f9749dd102 Browse files
2 changed files+83−0
README.mdadded+32−0View file
@@ -0,0 +1,32 @@
1+> **Early Stage & Experimental** - This project is in early development and should be considered experimental.
2+
3+# numbl Embed Example
4+
5+This repository demonstrates how to embed interactive MATLAB scripts in Markdown files using [numbl-embed](https://github.com/flatironinstitute/numbl). When rendered on GitHub Pages, the embedded scripts become editable and executable directly in the browser via [numbl](https://numbl.org).
6+
7+## Example
8+
9+* **Rendered**: [example1](https://magland.github.io/numbl-embed-example/example1)
10+* **Source**: [example1.md](https://raw.githubusercontent.com/magland/numbl-embed-example/refs/heads/main/example1.md)
11+
12+```markdown
13+<script src="https://numbl.org/numbl-embed.js"></script>
14+
15+This demonstrates how to embed numbl in a markdown file that can be rendered on GitHub pages.
16+
17+<numbl-embed>
18+<iframe width="100%" height="600" frameborder="0"></iframe>
19+<script type="text/plain" class="matlab-script">
20+% Matrix operations example
21+A = [8, 1, 6; 3, 5, 7; 4, 9, 2];
22+disp('Matrix A:')
23+disp(A)
24+
25+disp('Sum of each row:')
26+disp(sum(A, 2))
27+
28+disp('Sum of each column:')
29+disp(sum(A, 1))
30+</script>
31+</numbl-embed>
32+```
example1.mdadded+51−0View file
@@ -0,0 +1,51 @@
1+<script src="https://numbl.org/numbl-embed.js"></script>
2+
3+This demonstrates how to embed numbl in a markdown file that can be rendered on GitHub Pages.
4+
5+<numbl-embed>
6+<iframe width="100%" height="600" frameborder="0"></iframe>
7+<script type="text/plain" class="matlab-script">
8+% Matrix operations example
9+A = [8, 1, 6; 3, 5, 7; 4, 9, 2];
10+disp('Matrix A:')
11+disp(A)
12+
13+disp('Sum of each row:')
14+disp(sum(A, 2))
15+
16+disp('Sum of each column:')
17+disp(sum(A, 1))
18+
19+disp('Sum of diagonal:')
20+disp(sum(diag(A)))
21+
22+disp('Total sum:')
23+disp(sum(sum(A)))
24+</script>
25+</numbl-embed>
26+
27+If it worked, you should see an embedded numbl above with a matrix operations example.
28+
29+Here's another example with numerical integration:
30+
31+<numbl-embed>
32+<iframe width="100%" height="600" frameborder="0"></iframe>
33+<script type="text/plain" class="matlab-script">
34+% Numerical integration using trapezoidal rule
35+a = 0;
36+b = pi;
37+n = 100;
38+
39+% Create evenly spaced points
40+h = (b - a) / (n - 1);
41+x = a:h:b;
42+y = sin(x);
43+
44+% Trapezoidal rule: (h/2) * (y(1) + 2*sum(y(2:end-1)) + y(end))
45+integral_approx = (h/2) * (y(1) + 2*sum(y(2:end-1)) + y(end));
46+
47+disp(['Approximate integral of sin(x) from 0 to pi: ', num2str(integral_approx)])
48+disp('Exact value: 2')
49+disp(['Error: ', num2str(abs(integral_approx - 2))])
50+</script>
51+</numbl-embed>