{"id":20649525,"url":"https://github.com/leapmotion/leap-three-camera-controls","last_synced_at":"2025-09-14T20:50:34.911Z","repository":{"id":16147498,"uuid":"18893092","full_name":"leapmotion/Leap-Three-Camera-Controls","owner":"leapmotion","description":"Camera Controls for Three.js using Leap Motion","archived":false,"fork":false,"pushed_at":"2016-03-16T19:58:35.000Z","size":3380,"stargazers_count":63,"open_issues_count":2,"forks_count":19,"subscribers_count":72,"default_branch":"master","last_synced_at":"2025-03-29T05:51:14.479Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"apache-2.0","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/leapmotion.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2014-04-17T20:50:23.000Z","updated_at":"2023-12-23T17:23:59.000Z","dependencies_parsed_at":"2022-08-04T08:00:14.796Z","dependency_job_id":null,"html_url":"https://github.com/leapmotion/Leap-Three-Camera-Controls","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/leapmotion%2FLeap-Three-Camera-Controls","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/leapmotion%2FLeap-Three-Camera-Controls/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/leapmotion%2FLeap-Three-Camera-Controls/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/leapmotion%2FLeap-Three-Camera-Controls/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/leapmotion","download_url":"https://codeload.github.com/leapmotion/Leap-Three-Camera-Controls/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":249296079,"owners_count":21246244,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-11-16T17:14:41.663Z","updated_at":"2025-04-17T00:59:58.469Z","avatar_url":"https://github.com/leapmotion.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"Three.js Camera Controls using Leap Motion\n=====\n\nHey Friends!\n\nI hope you are here to use the Leap.js / Three.js Camera controls. \nIf you aren't, the following might not make since, but since you are here,\nyou should try using them anyway!\n\nThis Repo is most definitly still a work in progress, so if you see any \nerrors, have any questions, think all the controls are horrendous, think the\ncode is ugly, have your own controls that are way better than all of these,\nPLEASE, PLEASE, PLEASE let me know at icohen@leapmotion.com || @cabbibo .\n\nThe Realm we have entered with gesture controlled devices is a wild frontier,\nan unexplored landscape. We will make mistakes, and the more we know about these \nmistakes, the better we can survive in this new magical space. So let me know \nyour opinions, my fellow Motion Pioneers!\n\nWhats in this Readme?\n-----\n\n  - Links to Useful Resources\n  - Basic Implementation\n  - A full example from start to finish!\n  - Further explanations of each individual camera controls\n  - How you can help!\n\nUseful Resources\n=====\n\n\n- [ The github page for this repo ]( http://leapmotion.github.io/Leap-Three-Camera-Controls/ )\n- [ three.js library ]( http://threejs.org/ )\n- [ Example of three.js Camera Control ]( http://threejs.org/examples/#misc_controls_trackball )\n- [ TODO: Really Pretty Tech Demo of Nvidias Open Source Driver Call Graph ]()\n\n\nBasic Implementation\n=====\n\nLike Any other javascript program, the first thing we need to \ndo is include the proper files. In our case we use three.js\nleap.js and which ever camera control we decide to use \n( For our demo use case, we will use 'LeapSpringControls.js\", so we\nstart of our program like so:\n\nInclude Scripts\n------\n\n```\n\u003cscript src=\"path/to/three.js\"\u003e\u003c/script\u003e\n\u003cscript src=\"path/to/leap.js\"\u003e\u003c/script\u003e\n\u003cscript src=\"path/to/LeapSpringControls.js\"\u003e\u003c/script\u003e\n```\n\nThe next thing we will do is set up our controls. We are going to \nskip over all of the three.js initialization, but if you want, you can\njust grab that from the next section.\n\nWhichever camera controls we use, we initialize them the same way we would\na three.js camera control. The only difference is that instead of just\npassing through which camera we want the controls to apply to, in this case\nwe also need to tell the camera controls which leap controller we want to use.\n\nIf this seems convoluted, I promise its only because I suck at the English \nlanguage. Lets talk in javascript instead:\n\n\nInitializing Controls\n-----\n\n```\n// our leap controller\nvar controller;\n\n// our leap camera controls\nvar controls;\n\n// our three.js variables\nvar scene , camera;\n\n\n// Whatever function you use to initialize \n// your three.js scene, add your code here\nfunction init(){\n  \n\n  // Three.js initialization\n  var scene = new THREE.Scene();\n  var camera = new THREE.PerspectiveCamera( \n    50 ,\n    window.innerWidth / window.innerHeight,\n    1,\n    1000\n  );\n\n  // Our Leap Controller\n  var controller = new Leap.controller();\n  controller.connect();\n \n  // The long awaited camera controls!\n  var controls = new THREE.LeapSpringControls( camera , controller , scene );\n\n}\n```\n\nIt is important to note that the LeapSpringControls take in a camera , a controller ,\nAND a scene as input. This is because this specific control places a marker on the page\nas a helper.\n\nThe last thing we need to do is to make sure the controls are constantly being updated,\nso we include a few more lines in whatever function we are using to render the three.js\nscene.\n\nUpdating Controls\n-----\n\n```\nfunction animate(){\n\n  //THREE.js rendering goes here\n  \n\n  // This is the only thing we need!\n  controls.update();\n\n\n  // Make sure animate gets called again\n  requestAnimationFrame( animate );\n\n\n}\n```\n\nIf any of this doesn't make sense, check out the full example below. Also email\nicohen@leapmotion.com || @cabbibo with any questions / comments!\n\n\nFull Code Example\n=====\n\n```\n\u003chtml\u003e\n  \u003chead\u003e\n    \u003cstyle\u003e\n\n      #container{\n\n        background:#000;\n        position:absolute;\n        top:0px;\n        left:0px;\n\n      }\n\n    \u003c/style\u003e\n  \u003c/head\u003e\n  \u003cbody\u003e    \n\n    \u003cdiv id=\"container\"\u003e\u003c/div\u003e\n\n    \u003cscript src=\"../lib/leap.min.js\"\u003e\u003c/script\u003e\n    \u003cscript src=\"../lib/three.js\"\u003e\u003c/script\u003e\n\n    \u003cscript src=\"../controls/LeapSpringControls.js\"\u003e\u003c/script\u003e\n    \n    \u003cscript\u003e\n\n      var container , camera , scener, renderer , stats;\n\n      var controller , controls;\n\n      init();\n      animate();\n\n      function init(){\n\n        controller = new Leap.Controller();\n     \n        scene = new THREE.Scene();\n\n        camera = new THREE.PerspectiveCamera(\n          50 ,\n          window.innerWidth / window.innerHeight,\n          1 ,\n          5000\n        );\n\n        camera.position.z = 100;\n        controls = new THREE.LeapSpringControls( camera , controller , scene );\n\n        var material = new THREE.MeshNormalMaterial();\n        var geometry = new THREE.CubeGeometry( 20 , 20 , 20 );\n        for( var i = 0; i \u003c 100; i ++ ){\n\n          var mesh = new THREE.Mesh( geometry , material );\n          mesh.position.x = ( Math.random() - .5 ) * 500;\n          mesh.position.y = ( Math.random() - .5 ) * 500;\n          mesh.position.z = ( Math.random() - .5 ) * 500;\n\n          mesh.rotation.x = Math.random() * Math.PI;\n          mesh.rotation.y = Math.random() * Math.PI;\n          mesh.rotation.z = Math.random() * Math.PI;\n\n          scene.add( mesh );\n\n        }\n        \n        container = document.getElementById( 'container' );\n        renderer = new THREE.WebGLRenderer();\n        renderer.setSize( window.innerWidth, window.innerHeight );\n        container.appendChild( renderer.domElement );      \n\n        controller.connect();\n\n\n      }\n\n\n      function animate(){\n\n        controls.update();\n        renderer.render( scene , camera );\n\n        requestAnimationFrame( animate );\n\n      }\n\n    \u003c/script\u003e\n  \u003c/body\u003e\n\u003c/html\u003e\n```\n\nMore Information About Controls\n=====\n\nThis section is about what each of the controls are the most useful\nfor. It will also try to include descriptions of what works, what\ndoesn't work, and what will hopefully one day work.\n\nPointer Controls\n-----\n\nThe pointer controls basically has the camera always pointing at a \n'target', when you pinch, you begin moving the camera around the object,\nand when you release, the camera will stop moving.\n\nPros:\n\n  - Always looking at the same place, so its hard to get out of control\n  - movements feel smoothish\n  - Absolute positioning means that when comparing to the leap, \n    the position will always make sense\n\nCons:\n\n  - Moving camera near poles results in some weirdness\n  - Because there is only a single target, hard to move around scene\n    unless the target is dynamically updated\n  - Uses pinch, which removes the ability to use it for other gestures\n\n\nPairings:\n  \n  - Pointer controls work well with a single examined object\n  - 3D Modeling camera controls\n  - A Game with a single scene that we are always looking at\n  - A quick addition to visual experiments\n\nCalled using: \n\n```\n\u003c!-- Include Script --\u003e\n\u003cscript src=\"path/to/controls/LeapPointerControls.js\"\u003e\u003c/script\u003e\n\n// Inside Init Function\nvar controls = THREE.LeapPointerControls( camera , controller );\n\ncontrols.size       = 100;\ncontrols.speed      = .01;\ncontrols.dampening  = .99;\ncontrols.target     = new THREE.Vector3( 0 , 100 , 0 );\n\n// Inside Animate Function\ncontrols.update();\n```\n\nUsing the following parameters:\n\n  - size:       Tells us how big the motions will be, basically the spherical\n                distance from the target\n\n  - dampening:  Tells us how fast the camera will slow down once we release\n                it. also how 'smoothed' the movement will be\n\n  - speed:      Tells us how fast the camera will follow our hand movements.\n                This number should be between 0 and 1\n\n  - target:     Tells us where the camera is looking. A THREE.Vector3(), \n                target basically defines the center of the scene\n\n\nEye Look Controls\n-----\n\nEye Look Controls are very similar to the Pointer controls. Infact when \nyou use your right hand, they are exactly the same. The biggest difference\nis that when you use your left hand, you dynamically move the target.\nThis leads to the ability to easily move around a scene, but always have a \nspecific point you are focused on. Also, all movements are relative,\nrather than absolute.\n\n\nPros:\n\n  - Always looking at the same place, so its hard to get out of control\n  - movements feel smoothish\n  - Relative movements allow for the exploration of the entire scene \n\nCons:\n\n  - Moving camera near poles results in some weirdness\n  - Uses pinch, which removes the ability to use it for other gestures\n  - Relative movement means that you can get very far away from yourr\n    target, leading to depth being difficult to judge\n  - Difficult to move through an entire scene quickly\n\n\nPairings:\n  \n  - Slowly examining a full scene\n  - 3D Modeling camera controls\n  - A quick addition to visual experiments\n\n\nCalled using: \n\n```\n\u003c!-- Include Script --\u003e\n\u003cscript src=\"path/to/controls/LeapEyeLookControls.js\"\u003e\u003c/script\u003e\n\n// Inside Init Function\nvar controls = THREE.LeapEyeLookControls( camera , controller , scene );\n\ncontrols.lookSize       = 10;\ncontrols.lookMass       = 10;\ncontrols.lookSpeed      = 10;\ncontrols.lookDampening  = .9;\n\ncontrols.eyeSize        = 10;\ncontrols.eyeMass        = 10;\ncontrols.eyeSpeed       = 10;\ncontrols.eyeDampening   = .9;\n\n// If you want to have a marker for your eye\n// Which you probably do...\n\nvar geo   = new THREE.CubeGeometry( 1 , 1 , 1 );\nvar mat   = new THREE.MeshNormalMaterial();\nvar mesh  = new THREE.Mesh( geo , mat );\n\ncontrols.addLookMarker( mesh );\n\n// Inside Animate Function\ncontrols.update();\n```\n\nUsing the following parameters:\n\n  - lookSize:       Tells us how big the movements will be for the look object\n                    by adding bigger or smaller numbers to the force\n\n  - lookMass:       Tells us more about how the look object will move by giving\n                    it different mass. A smaller mass with fling around the field\n                    while a larger mass will be slower / harder to move\n\n  - lookSpeed:      Tells us how much the speed will be multiplied by when we \n                    determine the final speed to be added to the position\n\n  - lookDampening:  Tells us how quickly the look object will slow down\n\n  - eyeSize:        Tells us how big the movements will be for the eye object\n                    by adding bigger or smaller numbers to the force\n\n  - eyeMass:        Tells us more about how the eye object will move by giving\n                    it different mass. A smaller mass with fling around the field\n                    while a larger mass will be slower / harder to move\n\n  - eyeSpeed:       Tells us how much the speed will be multiplied by when we \n                    determine the final speed to be added to the position\n\n  - eyeDampening:   Tells us how quickly the eye object will slow down\n\n\nSpring Controls\n-----\n\nSpring controls Attatch a spring from your camera to a target, which it\nis always looking at. When you pinch, it places a new anchor that the \ntarget will tween to, always giving you a smooth movement. To see exactly\nwhat this means, try adding markers to the anchor , hand , and target\nas described in the below code snippet\n\nPros:\n\n  - Smooth like butter\n  - Lets you fly to anywhere you want in the scene with relative ease\n  - Once you let go, gives slowly brings you to a final resting point\n  \n\nCons:\n\n  - Moving camera near poles results in some weirdness...\n  - Uses pinch, which removes the ability to use it for other gestures\n  - Easy to get lost in space if you have no reference points\n\nPairings:\n  \n  - Space Flying Games \n  - Plane Flying Games\n  - A quick addition to visual experiments\n\n\nCalled using: \n\n```\n\u003c!-- Include Script --\u003e\n\u003cscript src=\"path/to/controls/LeapEyeLookControls.js\"\u003e\u003c/script\u003e\n\n// Inside Init Function\ncontrols = new THREE.LeapSpringControls( camera , controller , scene );\n\ncontrols.dampening      = .75;\ncontrols.size           = 120;\ncontrols.springConstant =   1;\ncontrols.mass           = 100;\ncontrols.anchorSpeed    =  .1;\ncontrols.staticLength   = 100;\n\n\n// Adding meshes to the Anchor , Target and Hand\nvar geo = new THREE.IcosahedronGeometry( 5, 2 ); \nvar mat = new THREE.MeshNormalMaterial(); \n\nvar targetMesh  = new THREE.Mesh( geo , mat );\nvar anchorMesh  = new THREE.Mesh( geo , mat );\nvar handMesh    = new THREE.Mesh( geo , mat );\n\ncontrols.addTargetMarker( targetMesh );\ncontrols.addAnchorMarker( anchorMesh );\ncontrols.addHandMarker(     handMesh );\n\n// Inside Animate Function\ncontrols.update();\n```\n\nUsing the following parameters:\n\n  - dampening:      Tells us how quickly movement slows down \n  - size:           Tells us size of hand movements\n  - springConstant: Tells us value for Hooke's Law constant k\n  - mass:           Tells us mass of camera\n  - anchorSpeed:    Tells us how fast Anchor tweens to target \n                    ( .5 and higher gets weird. but it shouldn't,\n                      I just forgot how to do physics. Pull request maybe ?!!???!? )\n  - staticLength:   Tells us how far away camera comes to rest from target\n\n\nTrackball Controls\n-----\n\nTrackball Controls let you swipe the camera around a target, as if you\nwere pushing a giant bowling ball around ( your hand is always behind the ball )\nAlso , if you turn your hand straight up, and zoom is enabled, you will\nstop spinning and start zooming, based on moving your hand forward and backwards\n\n\nPros:\n\n  - Supersmooth. \n  - No Gimbal Lock!\n  - No use of Pinch! \n\nCons:\n\n  - Only moves around single point\n  - Controls take some getting used to for some people\n  - No clear up vector, which leads to possible deorientation\n\nPairings:\n  \n  - 3D Modeling camera controls\n  - A quick addition to visual experiments\n\n\nCalled using: \n\n```\n\u003c!-- Include Script --\u003e\n\u003cscript src=\"path/to/controls/LeapTrackballControls.js\"\u003e\u003c/script\u003e\n\n// Inside Init Function\nvar controls = THREE.LeapTrackballControls( camera , controller );\n\ncontrols.rotationSpeed            =   10;\ncontrols.rotationLowDampening     =  .98;\ncontrols.rotationHighDampening    =   .7;\ncontrols.zoom                     =   40;\ncontrols.zoomDampening            =   .6;\ncontrols.zoomSpeedRatio           =   10;\ncontrols.zoomCutoff               =   .9;\ncontrols.zoomEnabled              = true;\ncontrols.minZoom                  =   20;\ncontrols.maxZoom                  =   80;\n \n// Inside Animate Function\ncontrols.update();\n```\n\nUsing the following parameters:\n\n  - rotationSpeed:          Tells us the speed of the rotation\n  - rotationLowDampening:   Tells us how quickly the rotation will slow down when in moving state\n  - rotationHighDampening:  Tells us how quickly the rotation will slow down when in stopping state\n  - zoomEnabled:            Tells us if zooming is enabled\n  - zoom:                   Tells us how close we are to the center\n  - zoomDampening:          Tells us how quickly the zoom will slow down\n  - zoomSpeedRatio:         Tells us how quickly the zoom moves compared to palm\n  - zoomCutoff:             Tells us how forward facing our palm needs to be to zoom\n  - minZoom:                Tells us the closest we can be\n  - maxZoom:                Tells us the farthest we can be\n  \n\nPinch Rotate Controls\n-----\n\nPinch Rotate Controls are nearly Identical to the Trackball controls, except that they use pinch in order to move the camera. As well, they have the ability to zoom in and out, by simply pinching and moving inwards or outwards. In order to define when this happens, it looks at the movement in Z vs the movement in X and Y, and compares the too to see if there is more movement in Z than XY or vis versa\n\nPros:\n\n  - Supersmooth. \n  - No Gimbal Lock!\n\nCons:\n\n  - Only moves around single point\n  - Controls take some getting used to for some people\n  - No clear up vector, which leads to possible deorientation\n  - Uses Pinch :-( \n\nPairings:\n  \n  - 3D Modeling camera controls\n  - A quick addition to visual experiments\n\n\nCalled using: \n\n```\n\u003c!-- Include Script --\u003e\n\u003cscript src=\"path/to/controls/LeapPinchRotateControls.js\"\u003e\u003c/script\u003e\n\n// Inside Init Function\nvar controls = THREE.LeapPinchRotateControls( camera , controller );\n\ncontrols.rotationSpeed            =   10;\ncontrols.rotationLowDampening     =  .98;\ncontrols.rotationHighDampening    =   .7;\ncontrols.zoom                     =   40;\ncontrols.zoomDampening            =   .6;\ncontrols.zoomSpeedRatio           =   10;\ncontrols.zoomCutoff               =   .9;\ncontrols.zoomEnabled              = true;\ncontrols.zoomVsRotate             =    1;\ncontrols.minZoom                  =   20;\ncontrols.maxZoom                  =   80;\n \n// Inside Animate Function\ncontrols.update();\n```\n\nUsing the following parameters:\n\n  - rotationSpeed:          Tells us the speed of the rotation\n  - rotationLowDampening:   Tells us how quickly the rotation will slow down when in moving state\n  - rotationHighDampening:  Tells us how quickly the rotation will slow down when in stopping state\n  - zoomEnabled:            Tells us if zooming is enabled\n  - zoom:                   Tells us how close we are to the center\n  - zoomDampening:          Tells us how quickly the zoom will slow down\n  - zoomSpeedRatio:         Tells us how quickly the zoom moves compared to palm\n  - zoomCutoff:             Tells us how forward facing our palm needs to be to zoom\n  - zoomVsRotate:           Tells us how much more we need to be moving in Z than XY to start zooming, vs rotating\n  - minZoom:                Tells us the closest we can be\n  - maxZoom:                Tells us the farthest we can be\n\n\n\nPaddle Controls\n-----\n\nPaddle Controls Let you 'Paddle' Around a scene, the way that you would paddle \nthrough water. Pretty cool huh?\n\nPros:\n\n  - Supersmooth. \n  - Makes you feel a bit like a god\n  - No Gimbal Lock!\n  - No Pinch!\n\nCons:\n\n  - No Rotate...\n  - Controls take some getting used to for some people\n  \n\nPairings:\n  \n  - Great for moving a scene where you want don't want to rotate\n  - Great for 'infinite' terrains\n  - Great to combine with other methods of control!\n\nCalled using: \n\n```\n\u003c!-- Include Script --\u003e\n\u003cscript src=\"path/to/controls/LeapPaddleControls.js\"\u003e\u003c/script\u003e\n\n// Inside Init Function\nvar controls = THREE.LeapPaddleControls( camera , controller );\n\ncontrols.weakDampening        = .99;\ncontrols.strongDampening      = .9;\ncontrols.fingerMatchCutoff    = .5;\ncontrols.velocityMatchCutoff  =.5;\ncontrols.fingerMatchPower     = 5;\ncontrols.velocityMatchPower   = 5;\ncontrols.movementSpeed        = 1;\ncontrols.maxSpeed             = 10; \n\n\n// Inside Animate Function\ncontrols.update();\n```\n\nUsing the following parameters:\n\n  - weakDampening:          Tells us dampening when there is a hand in field\n  - strongDampening:        Tells us dampening when there is no hand in field\n  - fingerMatchCutoff:      Tells us the number at which we will stop moving if the finger direction does not match the hand direction\n  - velocityMatchCutoff:    Tells us the number at which we will stop moving if the finger velocity does not match the hand normal\n  - fingerMatchPower:       Tells us the amount that the fingerMatch will be raised to to give a higher or lower turn on for movement\n  - velocityMatchPower:     Tells us the amount that the velocityMatch will be raised to to give a higher or lower turn on for movement\n  - movementSpeed:          Tells us how fast we are moving, by multiplying the force\n  - maxSpeed:               Tells us what we will limit the cameras speed to\n\n\nTwo Hand Controls\n-----\n\nTwo Hand controls let you translate around a scene by pinching with a single\nhand, and rotate scene when you pinch with two hands\n\nPros:\n\n  - You feel a bit like iron man\n  - You don't accidentally rotate the scene when you don't want to \n  - Once you let go, gives slowly brings you to a final resting point\n  \n\nCons:\n\n  - Sometimes difficult for tracking to pick up with two hands in the field\n  - Uses pinch, which removes the ability to use it for other gestures\n  - Using two hands might be more tiring\n\n\nPairings:\n  \n  - Quickly exploring large swatches of land\n  - Manipulating large scenes\n  - A quick addition to visual experiments\n\n\nCalled using: \n\n```\n\u003c!-- Include Script --\u003e\n\u003cscript src=\"path/to/controls/LeapEyeLookControls.js\"\u003e\u003c/script\u003e\n\n// Inside Init Function\ncontrols = new THREE.LeapTwoHandControls( camera , controller , scene );\n\ncontrols.translationSpeed   = 20;\ncontrols.translationDecay   = 0.3;\ncontrols.scaleDecay         = 0.5;\ncontrols.rotationSlerp      = 0.8;\ncontrols.rotationSpeed      = 4;\ncontrols.pinchThreshold     = 0.5;\ncontrols.transSmoothing     = 0.5;\ncontrols.rotationSmoothing  = 0.2;\n\n// Inside Animate Function\ncontrols.update();\n```\n\nTODO: Description of Parameters\n\n\n\nFirst Person Controls\n-----\n\nTODO\n\n\nWhat You can Do To Help\n=======\n\n  - Let me know about comments / suggestions / complaints etc via issues\n  - Contribute your own controls via a pull request\n  - Tell your friends, and get more people user testing / involved!\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fleapmotion%2Fleap-three-camera-controls","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fleapmotion%2Fleap-three-camera-controls","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fleapmotion%2Fleap-three-camera-controls/lists"}