Get familiar with Ganja.js inline syntax

This commit is contained in:
Aaron Fenyes 2024-06-25 01:54:01 -07:00
parent d1ce91d2aa
commit 3c34481519
2 changed files with 47 additions and 49 deletions

View File

@ -18,34 +18,30 @@
</head> </head>
<body> <body>
<script> <script>
// the "points spheres plane" example from the Ganja coffee shop // in the default view, e4 + e5 is the point at infinity
// CGA3 = Algebra(4, 1);
// https://enkimute.github.io/ganja.js/examples/coffeeshop.html#cga3d_points_spheres_planes v1 = CGA3.inline(() => 1e1 + 1e5)();
// v2 = CGA3.inline(() => 1e2 + 1e5)();
v3 = CGA3.inline(() => 1e3 + 1e5)();
w1 = CGA3.inline(() => 1e1 - Math.sqrt(0.2)*1e4 + Math.sqrt(1.2)*1e5)();
w2 = CGA3.inline(() => 1e2 - Math.sqrt(0.2)*1e4 + Math.sqrt(1.2)*1e5)();
w3 = CGA3.inline(() => 1e3 - Math.sqrt(0.2)*1e4 + Math.sqrt(1.2)*1e5)();
s = CGA3.inline(() => -Math.sqrt(1.2)*1e4 + Math.sqrt(0.2)*1e5);
// Create a Clifford Algebra with 4,1 metric for 3D CGA. document.body.appendChild(CGA3.graph(
Algebra(4,1,()=>{ [
// We start by defining a null basis, and upcasting for points 0xff00b0, v1,
var ni = 1e4+1e5, no = .5e5-.5e4; 0x00ffb0, v2,
var up = (x)=> no + x + .5*x*x*ni; 0x00b0ff, v3,
0x800040, w1,
// Next we'll define 4 points 0x008040, w2,
var p1 = up(1e1), p2 = up(1e2), p3 = up(-1e3), p4 = up(-1e2); 0x004080, w3,
0xd0e0f0, s
// The outer product can be used to construct the sphere through ],
// any four points. {
var s = ()=>p1^p2^p3^p4; conformal: true, gl: true, grid: true
}
// The outer product between any three points and infinity is a plane. ));
var p = ()=>p1^p2^p3^ni;
// Graph the items.
document.body.appendChild(this.graph([
0x00FF0000, p1, "p1", p2, "p2", p3, "p3", p4, "p4", // points
0xE0008800, p, "p", // plane
0xE00000FF, s, "s" // sphere
], {conformal: true, gl: true, grid: true}));
});
</script> </script>
</body> </body>
</html> </html>

View File

@ -30,28 +30,30 @@ canvas {
# https://enkimute.github.io/ganja.js/examples/coffeeshop.html#cga3d_points_spheres_planes # https://enkimute.github.io/ganja.js/examples/coffeeshop.html#cga3d_points_spheres_planes
# #
sphere_example = """ sphere_example = """
Algebra(4, 1, ()=>{ // in the default view, e4 + e5 is the point at infinity
// We start by defining a null basis, and upcasting for points CGA3 = Algebra(4, 1);
var ni = 1e4+1e5, no = .5e5-.5e4; v1 = CGA3.inline(() => 1e1 + 1e5)();
var up = (x)=> no + x + .5*x*x*ni; v2 = CGA3.inline(() => 1e2 + 1e5)();
v3 = CGA3.inline(() => 1e3 + 1e5)();
// Next we'll define 4 points w1 = CGA3.inline(() => 1e1 - Math.sqrt(0.2)*1e4 + Math.sqrt(1.2)*1e5)();
var p1 = up(1e1), p2 = up(1e2), p3 = up(-1e3), p4 = up(-1e2); w2 = CGA3.inline(() => 1e2 - Math.sqrt(0.2)*1e4 + Math.sqrt(1.2)*1e5)();
w3 = CGA3.inline(() => 1e3 - Math.sqrt(0.2)*1e4 + Math.sqrt(1.2)*1e5)();
// The outer product can be used to construct the sphere through s = CGA3.inline(() => -Math.sqrt(1.2)*1e4 + Math.sqrt(0.2)*1e5);
// any four points.
var s = ()=>p1^p2^p3^p4; document.body.appendChild(CGA3.graph(
[
// The outer product between any three points and infinity is a plane. 0xff00b0, v1,
var p = ()=>p1^p2^p3^ni; 0x00ffb0, v2,
0x00b0ff, v3,
// Graph the items. 0x800040, w1,
document.body.appendChild(this.graph([ 0x008040, w2,
0x00FF0000, p1, "p1", p2, "p2", p3, "p3", p4, "p4", // points 0x004080, w3,
0xE0008800, p, "p", // plane 0xd0e0f0, s
0xE00000FF, s, "s" // sphere ],
], {conformal: true, gl: true, grid: true})); {
}); conformal: true, gl: true, grid: true
}
));
""" """
# === page construction === # === page construction ===