2c:null 2d:["$","title",null,{"children":"BabylonJS Demo | AxiomTutor | Observable"}] 32:T859,arrowBuilder = function( scene, params ) { const start = [params.startx, params.starty, params.startz]; const end = [params.endx, params.endy, params.endz]; const dir = [params.dirx, params.diry, params.dirz]; let all = function(a: (number|undefined)[]) { for (let i=0; i","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":7,"value":"BABYLON = (await import(\"https://esm.sh/babylonjs@6\")).default","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":61,"value":"MATERIALS = (await import(\"https://esm.sh/babylonjs-materials@6\")).default","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":76,"value":"GUI = (await import(\"https://esm.sh/babylonjs-gui@6\")).default","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":13,"value":"function init(id) {\n const canvas = document.getElementById(id);\n const engine = new BABYLON.Engine(canvas, true);\n \n const scene = new BABYLON.Scene(engine);\n scene.useRightHandedSystem = true;\n \n const camera = new BABYLON.ArcRotateCamera(\"cam\", 0,0,1, BABYLON.Vector3.Zero(), scene);\n camera.setPosition( new BABYLON.Vector3(0,-5,25) );\n camera.attachControl(canvas, true);\n \n const light = new BABYLON.HemisphericLight(\"light\", new BABYLON.Vector3(3,3,1), scene);\n return {canvas, engine, scene, camera, light};\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":48,"value":"function twodgrid(scene, width=20, height=20, name=\"box\") {\n const box = BABYLON.MeshBuilder.CreateBox(\n name, \n {width:width, height:height, depth:.2},\n scene);\n const boxmat = new MATERIALS.GridMaterial(`${name}_mat`, scene);\n boxmat.majorUnitFrequency = 2;\n boxmat.useMaxLine = false;\n\n box.material = boxmat;\n\n return {box, boxmat};\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":69,"value":"function spinsphere(scene, x,y,z=0, \n red=1,green=0,blue=0, radius=.2, \n whiteLines=false, spin=true) {\n const sphere = BABYLON.MeshBuilder.CreateSphere(\"sphere\", {diameter:radius*2});\n \n const spheremat = new MATERIALS.GridMaterial(\"spheremat\", scene);\n spheremat.mainColor = new BABYLON.Color3(red,green,blue);\n \n sphere.material = spheremat;\n sphere.position.set(x,y,z);\n\n if (whiteLines) { spheremat.lineColor = new BABYLON.Color3(1,1,1); }\n\n if (spin) {\n scene.registerBeforeRender( function() {\n sphere.rotate(new BABYLON.Vector3(0,1,1), .01);\n });\n }\n\n return {sphere, spheremat};\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":86,"value":"function gui(scene, camera) {\n const ui = GUI.AdvancedDynamicTexture.CreateFullscreenUI(\"UI\", true, scene);\n const panel = new GUI.StackPanel();\n panel.width = \"150px\";\n panel.height = \"100px\";\n panel.horizontalAlignment = GUI.Control.HORIZONTAL_ALIGNMENT_RIGHT;\n panel.verticalAlignment = GUI.Control.VERTICAL_ALIGNMENT_BOTTOM;\n ui.addControl(panel);\n\n const zout = GUI.Button.CreateSimpleButton(\"out\", \"Zoom Out\");\n zout.background = \"green\";\n zout.color = \"black\";\n zout.width = \"150px\";\n zout.height = \"50px\";\n zout.onPointerUpObservable.add(function () {\n camera.radius = camera.radius - 5;\n });\n\n const zin = GUI.Button.CreateSimpleButton(\"in\", \"Zoom In\");\n zin.background = \"green\";\n zin.color = \"black\";\n zin.width = \"150px\";\n zin.height = \"50px\";\n zin.onPointerUpObservable.add(function () {\n camera.radius = camera.radius + 5;\n });\n\n panel.addControl(zout);\n panel.addControl(zin);\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":133,"value":"textbox = function(width,height, \n x=0,y=0,z=0, \n color=\"black\") {\n const plane = BABYLON.MeshBuilder.CreatePlane( \"plane\", {width:width,height:height} );\n plane.position.set(x,y,z);\n\n const texture = BABYLON.AdvancedDynamicTexture.CreateForMesh(plane, 30,50);\n \n const container = new BABYLON.Rectangle();\n container.thickness = .1;\n container.background = color;\n container.alpha = .7;\n\n texture.addControl(container);\n return {plane,texture,container};\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":136,"value":"planeFromPtVec = function(scene, \n ox=0,oy=0,oz=0, \n vx=0,vy=0,vz=1) {\n const plane = BABYLON.MeshBuilder.CreatePlane(\"PLANE\", {size:10, sideOrientation:BABYLON.Mesh.DOUBLESIDE}, scene);\n \n // The normal to the plane is <0,0,1>. Rotate it to the desired normal by \n // first finding their cross: <0,0,1> x = <-vy, vx, 0>.\n const axis = new BABYLON.Vector3(-vy, vx, 0);\n // Use this to rotate through the appropriate angle.\n const angle = Math.acos( vz/Math.sqrt(vx*vx+vy*vy+vz*vz) );\n plane.rotate(axis, angle, BABYLON.Space.WORLD);\n\n plane.position.set(ox,oy,oz);\n\n const planemat = new BABYLON.GridMaterial(\"planemat\", scene);\n planemat.lineColor = new BABYLON.Color3(1,1,1);\n planemat.mainColor = new BABYLON.Color3(1,1,1);\n planemat.opacity = .9;\n plane.material = planemat;\n\n return {plane,planemat}\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":143,"value":"getAngleBetween = function(v1, v2) {\n const ctheta = (v1.x*v2.x + v1.y*v2.y + v1.z*v2.z)/(v1.length()*v2.length());\n return ( Math.acos(ctheta) );\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":151,"value":"function arrowBuilder(scene, length, thickness) {\n // Build an arrow, returns the mesh, material, start, and end.\n // This is intented to be used to build an arrow and \n const shaft = BABYLON.MeshBuilder.CreateCylinder(\"shaft\", {height:length*4/5, diameter:thickness}, scene);\n const head = BABYLON.MeshBuilder.CreateCylinder(\"head\", {height:length/5, diameterBottom:1.5*thickness, diameterTop:0}, scene);\n head.position.set(0, length/2 , 0);\n const arrow = BABYLON.Mesh.MergeMeshes([shaft,head]);\n if (arrow == null) { throw new Error(\"Arrow null. \"); }\n const arrowmat = new BABYLON.StandardMaterial(\"arrowmat\", scene);\n arrowmat.ambientColor = new BABYLON.Color3(1, 0, 0);\n arrow.material = arrowmat;\n return {arrow,arrowmat};\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":156,"value":"function arrowStartEnd(arrow) {\n \n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":153,"value":"function setArrowStart(arrow, svec) { \n // Keep the arrow direct constant, but set the start position\n \n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":137,"value":"$32","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":41,"value":"{\n const bag = init(\"demo\");\n const scene = bag.scene;\n \n twodgrid(scene);\n spinsphere(scene, 0, 0, 0, 1, 1, 0, 1);\n spinsphere(scene, 3, 0, 0.1, 0, 0, 1, 0.2);\n gui(scene, bag.camera);\n const rotax = new BABYLON.Vector3(0,0,1);\n const pivot = new BABYLON.TransformNode(\"root\");\n const arrow = arrowBuilder(scene, 3,1);\n\n bag.engine.runRenderLoop(() => {\n scene.render();\n });\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W33","stdlib":"1"}} 31:"$30:body"