## A Brief Tour of dyna3 When you load dyna3, you should initially see a three-dimensional coordinate system with labeled axes. ```javascript import {threeLoaded, three as J3, TrackballControls as J3x} from './externals.js' LTx = { dashed: true, plain: false } buildAxis = (to, color, tx) -> geom = new J3.Geometry() if tx then mat = new J3.LineDashedMaterial( {linewidth: 3, color, dashSize: 0.5, gapSize: 0.5}) else mat = new J3.LineBasicMaterial {linewidth:3, color} geom.vertices.push(new J3.Vector3(0,0,0)) geom.vertices.push to.clone() axis = new J3.Line geom, mat, J3.LineSegments axis.computeLineDistances() axis axes = (length) -> ax = new J3.Object3D() dirs = [ new J3.Vector3(length, 0, 0), new J3.Vector3(0, length, 0), new J3.Vector3(0, 0, length) ] cols = [ 0xFF0000, 0x00FF00, 0x0000FF ] for i in [0, 1, 2] ax.add buildAxis dirs[i], cols[i], LTx.plain dirs[i].multiplyScalar(-1) ax.add buildAxis dirs[i], cols[i], LTx.dashed ax main = -> renderer = new J3.WebGLRenderer() rwd = window.innerWidth rht = window.innerHeight renderer.setSize rwd, rht renderer.setClearColor 0xdddddd, 1.0 document.body.appendChild renderer.domElement scene = new J3.Scene() geometry = new J3.IcosahedronBufferGeometry 1 material = new J3.MeshPhongMaterial {color: 0xff00ff} ball = new J3.Mesh geometry, material scene.add ball scene.add axes 10 ambient = new J3.HemisphereLight 0xffffff, 0xaaaaaa, 1 ambient.position.set 0.1, 0.1, 1 scene.add ambient camera = new J3.PerspectiveCamera 75, rwd/rht, 0.1, 1000 camera.up.set 0, 0, 1 camera.position.set 4, -1, 3 controls = new J3x.TrackballControls camera, renderer.domElement renderer.setAnimationLoop -> controls.update() renderer.render scene,camera threeLoaded.then main ```