31:T5e4,md`Just like in PGA, the outer product ${tex`\wedge`} and the regressive product ${tex`\vee`} represent *join* and *meet* operations. In the Conformal model, you get **point-pairs**, **circles** and **spheres** as new objects. ## Null Basis We typically don't work directly with the extra ${tex`e_+`} and ${tex`e_-`} generators, but instead first define a null basis. Any two orthogonal null vectors will work, here's the ones ganja.js uses : ${tex`e_{origin} = e_o = \frac 1 2 (e_- - e_+)`} ${tex`e_{infinity} = e_\infty = e_+ + e_-`} Using these (null) basis vectors a euclidean point is defined as a map : ${tex`up(x,y,z) \rightarrow xe_1 + ye_2 + ze_3 + \frac 1 2 (x^2+y^2+z^2)e_\infty + e_o`} And that's all that is needed to start creating higher dimensional objects (just a selection) : | grade | name | construction | | |-------|--------|--------------|---| | 1 | point | up(x,y,z) | | | 2 | point-pair | ${tex`p_1 \wedge p_2\quad^{\red {**}}`}| ${tex`l_1\vee s_1\quad`} or ${tex`\quad c_1\vee s_1`} | 3 | circle | ${tex`p_1\wedge p_2\wedge p_3\quad`} or ${tex`\quad pp_1\wedge p_1`} | ${tex`s_1\vee s_2\quad`} or ${tex`\quad s_1\vee p_1`} | 3 | line | ${tex`p_1\wedge p_2\wedge e_\infty\quad`}or ${tex`\quad pp_1\wedge e_\infty`} | ${tex`p_1\vee p_2`} | 4 | sphere | ${tex`p_1\wedge p_2\wedge p_3\wedge p_4`} | | 4 | plane | ${tex`p_1\wedge p_2\wedge p_3\wedge e_\infty`} | `32:T873,CGA.inline((f)=>{ // Infinity, origin and upcasting to conformal space. var ni=1e4+1e5, no=.5e5-.5e4, up=(x)=>x+.5*x*x*ni+no; // rotator x degrees around bivector P var rot=(x,P)=>Math.cos(x)+Math.sin(x)*P.Normalized; // returns an array of rotated points in n steps, covering r radians of the circle. var lathe=(x,P,n,r)=>[...Array(n+1)].map((y,i)=>rot(-i/n*r*.5,P)>>>x); // convert an array of points to an array of connecting line segments. var curve=x=>x.map((x,i,a)=>[x,i?a[i-1]:x]); // returns the angle between two conformal points (on a sphere around the origin only) var angle=(x,y)=>Math.acos((x^no^ni).Normalized<<(y^no^ni).Normalized); // returns the point mirrored around the origin var anti=(x)=>{var y=0e1+x; y.e1=-x.e1; y.e2=-x.e2; y.e3=-x.e3; return y; } // create our two points x and y on the unit sphere. (hence the normalized) var x=up((-1e3-.5e1-1e2).Normalized), y=up((1e2-.5e1-1e3).Normalized); // pseudo code : // var great_circle = x^y^anti(x), // plane_of_great_circle = great_circle^ni, // rotation_bivector = !plane_of_great_circle*1e123, // great_arc = curve(lathe(x,rotation_bivector,64,angle(x,y))); // or in enki-speak, its just one line, the great arc between x and y : var great_arc = (x,y)=>curve(lathe(x,!(x^y^anti(x)^ni)*1e123,64,angle(x,y))); // A sphere at the origin var s=!(no-.50*ni); // Graph it return this.graph(()=>{ var nx = up(([...x.slice(1,4)]*[1e1,1e2,1e3]).Normalized), ny = up(([...y.slice(1,4)]*[1e1,1e2,1e3]).Normalized); return [ 0,()=>no,x,"x",y,"y", // origin, x and y 0x8888ff,nx^ny^anti(nx), // light blue great circle 0xff0000,...great_arc(nx,ny), // red great arc 0x000000,[x,y], // line segment 0xccccff,[no,x,y], // a triangle 0x888888,!1e3&s,!1e1&s,!1e2&s, // intersections of sphere with principal planes 0xffffee,s, // our sphere ]},{conformal:true,gl:true,animate:f}) })(f)33:T82d,viewof arc_elements = CGA.inline((f)=>{ // Infinity, origin and upcasting to conformal space. var ni=1e4+1e5, no=.5e5-.5e4, up=(x)=>x+.5*x*x*ni+no; // rotator x degrees around bivector P var rot=(x,P)=>Math.cos(x)+Math.sin(x)*P; // returns an array of rotated points in n steps, covering r radians of the circle. var lathe=(x,P,n,r)=>[...Array(n+1)].map((y,i)=>rot(-i/n*r*.5,P)>>>x); // convert an array of points to an array of connecting line segments. var curve=x=>x.map((x,i,a)=>[x,i?a[i-1]:x]); // returns the angle between two conformal points (on a sphere around the origin only) var angle=(x,y)=>Math.acos((x^no^ni).Normalized<<(y^no^ni).Normalized); // returns the point mirrored around the origin var anti=(x)=>{var y=0e1+x; y.e1=-x.e1; y.e2=-x.e2; y.e3=-x.e3; return y; } // create our two points x and y on the unit sphere. (hence the normalized) var x=up((-1e3+.3e2-.5e1).Normalized), y=up((-1e3+-.3e2-.5e1).Normalized); var a=up(0); // Graph it return this.graph(()=>{ // user may move points, keep them on sphere. x.set(up(([...x.slice(1,4)]*[1e1,1e2,1e3]).Normalized)) y.set(up(([...y.slice(1,4)]*[1e1,1e2,1e3]).Normalized)) // pseudo code : // var great_circle = x^y^anti(x), // plane_of_great_circle = great_circle^ni, // rotation_bivector = !plane_of_great_circle*1e123, // great_arc = curve(lathe(x,rotation_bivector,64,angle(x,y))); // or in enki-speak, its just one line, the great arc between x and y : var great_arc = (x,y,d)=>curve(lathe(d==-1?y:x,(!(x^y^anti(x)^ni)*1e123).Normalized,24,d==-1?2*Math.PI-angle(x,y):angle(x,y))); // A sphere at the origin var s=!(no-.50*ni); return [ 0,x,"x",y,"y", // origin, x and y (angle(x,y)*180/Math.PI).toFixed(1), 0xff0000,...great_arc(x,y), // red great arc 0x008800,...great_arc(x,y,-1).filter((x,i)=>i%2), // green great arc 0xa0ffffee,s, // our sphere ]},{conformal:true,gl:true,animate:f}) })(g)34:[] 2f:{"title":"Conformal Geometric Algebra","cells":[{"id":0,"value":"md`# Conformal Geometric Algebra\n\nI recently added a visualizer for ${tex`\\mathbb R_{4,1}`} \"Conformal Geometric Algebra\" to my GA library [Ganja.js](https://github.com/enkimute/ganja.js). It enables you to display Conformal objects using exactly the same syntax as for any of the other spaces supported. (${tex`\\mathbb R_{2,0,1} \\scriptsize\\text{\"2D PGA\"}`} , ${tex`\\mathbb R_{3,0,1} \\scriptsize\\text{\"3D PGA\"}`}, ${tex`\\mathbb R_{3,1} \\scriptsize\\text{\"2D CGA\"}`}). 3D CGA is only supported by the webGL visualizer - not the SVG one.\n\nTo get started, include ganja and create a conformal Algebra.`","pinned":false,"hidden":false,"mode":"ojs"},{"id":9,"value":"Algebra = require('ganja.js')","pinned":true,"hidden":false,"mode":"ojs"},{"id":12,"value":"CGA = Algebra(4,1)","pinned":true,"hidden":false,"mode":"ojs"},{"id":15,"value":"$31","pinned":false,"hidden":false,"mode":"ojs"},{"id":64,"value":"md`## Outer product : Points, Lines, Circles.\n\nTo create points we simply use the up function as defined above. To represent the euclidean point at ${tex`\\bold {x,y,z}`} we call it with a multivector ${tex`p`} :\n\n ${tex`p = \\bold xe_1 + \\bold ye_2 + \\bold ze_3`}\n\nThen the conformal point is found :\n\n ${tex`up(p) = p + \\frac 1 2 p^2e_\\infty + e_o`}\n\nTo create a circle, we wedge three points.\n\n ${tex`c = p_1 \\wedge p_2 \\wedge p_3`}\n\nIf one of those points is ${tex`e_\\infty`}, the circle becomes a line.\n\n ${tex`l = p_1 \\wedge p_2 \\wedge e_\\infty`}\n\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":390,"value":"viewof a = checkbox()","pinned":false,"hidden":false,"mode":"ojs"},{"id":67,"value":"thisIsNotTheThumbnail && CGA.inline((a)=>{\n // null basis and up.\n var ni = 1e4+1e5, no = .5e5-.5e4, up=(x)=>x+.5*x*x*ni+no;\n // some points, a circle and a line.\n var p1 = up(1e1), p2 = up(1e2), p3 = up(1e3), o = up(0),\n // The circle and line are functions so they update when the points get dragged. \n c = ()=>p1^p2^p3, l = ()=>p1^p2^ni;\n // graph some points, a circle and a line.\n return this.graph(()=>[\n ()=>o, // as function - don't want the user to move it.\n p1, [...p1.slice(1,4)].map(x=>x.toFixed(1)).join(','),\n p2, [...p2.slice(1,4)].map(x=>x.toFixed(1)).join(','),\n p3, [...p3.slice(1,4)].map(x=>x.toFixed(1)).join(','),\n 0x44aa44, c, \"c\",\n 0x8888ff, l,\"l\"\n ],{gl:true, conformal:true, animate:a, height:350})\n\n})(a)","pinned":false,"hidden":false,"mode":"ojs"},{"id":163,"value":"md`## Outer product : Spheres and Planes\n\nExtending the same idea, spheres can be constructed by wedging four points : \n\n ${tex`S=p_1 \\wedge p_2 \\wedge p_3 \\wedge p_4`}\n\nCircles can also be constructed by dualizing points. Given a center **p** and radius **r** :\n\n ${tex`S=!(up(p)-\\frac 1 2r^2e_\\infty)`}\n\nWhere as always in ganja.js, \"**!**\" denotes the duality operator.\n\nA plane is constructed by wedging three points with ${tex`e_\\infty`} :\n\n ${tex`P=p_1 \\wedge p_2 \\wedge p_3 \\wedge e_\\infty`}\n\nOr it can be constructed dually from a vector ${tex`v = \\bold xe_1 + \\bold ye_2 + \\bold ze_3`} normal to the plane and\na distance from the origin ${tex`d`}:\n\n ${tex`P=!(v - de_\\infty)`}\n\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":394,"value":"viewof b = checkbox()","pinned":false,"hidden":false,"mode":"ojs"},{"id":165,"value":"thisIsNotTheThumbnail && CGA.inline((b)=>{\n // null basis and up.\n var ni = 1e4+1e5, no = .5e5-.5e4, up=(x)=>x+.5*x*x*ni+no;\n \n // Some points.\n var p1=up(1e1), p2=up(1e2), p3=up(1e3), p4=up(-1e2), p=up(-1e1-.5e3);\n \n // a sphere\n var S= ()=>p1^p2^p3^p4;\n \n // a dual sphere\n var S2 = ()=>!(p - .5*.3**2*ni);\n \n // and a plane\n var P= ()=>p1^p2^p3^ni;\n \n // graph some points, a circle and a line.\n return this.graph([\n 0xff0000, p1, \"p1\", p2, \"p2\", p3, \"p3\", p4, \"p4\", p, \"p\",\n 0xffffcc, S, P, \n 0xccccff, S2,\n ],{gl:true, conformal:true, animate:b, height:350})\n\n})(b)","pinned":false,"hidden":false,"mode":"ojs"},{"id":232,"value":"md`## Regressive product : Intersecting\n\nThe regresive product (${tex`a \\vee b = !(!a \\wedge !b)`}) can be used to intersect these primitives.\n\n* the intersection of two spheres is a circle (green).\n* the intersection of two planes is a line (blue)\n* the intersection of a sphere and a plane is a circle (blue)\n* the intersection of a line and a sphere is a point pair (purple)\n* the intersection of a circle and a plane is a point pair (blue)\n* the intersection of a circle and a sphere is a point pair (green)\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":397,"value":"viewof c = checkbox()","pinned":false,"hidden":false,"mode":"ojs"},{"id":237,"value":"CGA.inline((c)=>{\n var ni = 1e4+1e5, no = .5e5-.5e4, up=(x)=>x+.5*x*x*ni+no;\n var p1=up(1e1-.2e2), p2=up(1e2-.2e2), p3=up(1e3-.2e2), p4=up(-1e2-.2e2), p=up(1e1+1e3), p6=up(-1e3);\n var S=()=>p1^p2^p3^p4, S2=()=>!(p6-0.05*ni);\n var C=()=>up(-.9e2+0.75e1)^up(-.9e2+.5e3)^up(-.9e2-0.9e1);\n var P=()=>p1^p2^p3^ni,P2=()=>p1^p4^p3^ni;\n return this.graph(()=>[\n 0x80000000, p1,p2,p3,p4,p,p6,\n 0x0000ff, S&P, // circle V plane\n 0x44AA44, p^p2^ni, \n 0xFF00FF, p^p2^ni&S, // line V sphere\n 0x000088, P&P2, // plane V plane\n 0x008800, S&S2, // sphere V sphere\n 0xaaaa88, C, \n 0x008800, C&S, // circle V sphere\n 0x0000ff, C&P2, // circle V plane\n 0xffffcc, S, P, P2, S2\n ],{gl:true, conformal:true, animate:c, height:350})\n\n})(c)","pinned":false,"hidden":false,"mode":"ojs"},{"id":295,"value":"md`## Regressive product : Negative radius.\n\nMost of these will produce objects with negative radius when they don't intersect.`","pinned":false,"hidden":false,"mode":"ojs"},{"id":400,"value":"viewof d = checkbox()","pinned":false,"hidden":false,"mode":"ojs"},{"id":298,"value":"CGA.inline((d)=>{\n var ni = 1e4+1e5, no = .5e5-.5e4, up=(x)=>x+.5*x*x*ni+no;\n var p1=up(Math.sin((d?1:0)*performance.now()/700)*1e1+1.5e1-.2e2), \n p3=up(Math.sin((d?1:0)*performance.now()/700)*.4e1-1.0e1-.2e2), \n p4=up(Math.sin((d?1:0)*performance.now()/700)*.4e1-1.0e1-.4e2), \n p5=up(Math.sin((d?1:0)*performance.now()/700)*.4e1-1.3e1+.1e2), \n p2=up(-.2e2);\n return this.graph(()=>{ \n var s1=()=>!(p1-0.1*ni), s2=()=>!(p2-0.3*ni), c=()=>(p3^p4^p5).Normalized;\n return ()=>[\n 0x80000000,p1,p2,p3,p4,p5,\n 0x0000ff,s1&s2,\"s1&s2\",\n 0x0000ff,c&s2,\"c&s2\",\n 0x0000ff,c,\n 0xffffee,s1,s2\n ]},{gl:true, conformal:true, animate:d, height:350})\n\n})(d)","pinned":false,"hidden":false,"mode":"ojs"},{"id":478,"value":"md`## Inner product : Distance\n\nThe Inner product produces (half of the square of) the distance between multivectors.`","pinned":false,"hidden":false,"mode":"ojs"},{"id":482,"value":"viewof e=checkbox()","pinned":false,"hidden":false,"mode":"ojs"},{"id":484,"value":"viewof ip_elements = CGA.inline((e)=>{\n var ni = 1e4+1e5, no = .5e5-.5e4, up=(x)=>x+.5*x*x*ni+no;\n var dist = (a,b)=>Math.abs((a<(2*(a&b).Length)**.5;\n var p1=up(Math.sin(e?performance.now()/400:0)*1e1+1.5e1-.2e2), \n p2=up(-.2e2);\n return this.graph(()=>{ \n if (e) p1=up(Math.sin(e?performance.now()/400:0)*1e1+1.5e1-.2e2);\n var s1=!(p1-0.1*ni), s2=!(p2-0.3*ni);\n return [\n 0,p1,p2,\n 0x0000ff,s1&s2,dists(s1,s2).toFixed(2),\n 0xffffee,s1,s2\n ]},{gl:true, conformal:true, animate:e, height:350})\n\n})(e)","pinned":false,"hidden":false,"mode":"ojs"},{"id":945,"value":"box(\"#FFFFEE\")` \np1 : ${[...ip_elements[1].slice(1,4)].map(x=>x.toFixed(2)).join()}\n\np2 : ${[...ip_elements[2].slice(1,4)].map(x=>x.toFixed(2)).join()}\n\ndistance : ${ip_elements[5]}\n\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":565,"value":"md`## Segments and Triangles\n\nJust like in PGA, arrays of points can be used to render segments or polygons. We illustrate by rendering the great arc between two given points **x** and **y**, as well as a triangle.`","pinned":false,"hidden":false,"mode":"ojs"},{"id":852,"value":"viewof f = checkbox()","pinned":false,"hidden":false,"mode":"ojs"},{"id":567,"value":"$32","pinned":false,"hidden":false,"mode":"ojs"},{"id":953,"value":"md`## Observable viewof and CGA\n\nThe CGA vizualizer has already been extended to support viewof and observable updates. Move point **x** or **y** around to see things update live.`","pinned":false,"hidden":false,"mode":"ojs"},{"id":959,"value":"viewof g = checkbox()","pinned":false,"hidden":false,"mode":"ojs"},{"id":966,"value":"box(\"#FFFFEE\")`\nshortest angle x to y : ${arc_elements[5]}°\n\nlongest angle x to y : ${360-arc_elements[5]}°\n\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":957,"value":"$33","pinned":false,"hidden":false,"mode":"ojs"},{"id":351,"value":"md`## Stay tuned, notebook in progress .. \n\nStill need to add camera controls for conformal space, object transforms for conformal space, ... \n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":875,"value":"md`---`","pinned":false,"hidden":false,"mode":"ojs"},{"id":1099,"value":"box = (col)=>function(){ return html`

${md.apply(this,arguments)}

`}","pinned":false,"hidden":false,"mode":"ojs"},{"id":872,"value":"thisIsNotTheThumbnail = !navigator.userAgent.match('HeadlessChrome')","pinned":false,"hidden":false,"mode":"ojs"},{"id":361,"value":"checkbox=(label='animate',value=0) => Object.assign(html`${label}`,{value})","pinned":false,"hidden":false,"mode":"ojs"}],"files":"$W34","stdlib":"1","titling":"auto"}