Sign Up for Free

RunKit +

Try any Node.js package right in your browser

This is a playground to test code. It runs a full Node.js environment and already has all of npm’s 400,000 packages pre-installed, including aframe-no-click-look-controls with all npm packages installed. Try it out:

var aframeNoClickLookControls = require("aframe-no-click-look-controls")

This service is provided by RunKit and is not affiliated with npm, Inc or the package authors.

aframe-no-click-look-controls v1.0.4

Intuitive controls for desktop A-frame experiences

A-Frame no-click-look-controls Component

##Overview Intuitive camera controls for desktop 3D experiences with A-Frame.


  • :no_entry_sign:<--->:no_entry_sign: Dynamically set maximum yaw and pitch (see options) to control sensitivity and max turn angles.
  • :computer: Provides intuitive desktop view controls without requiring mousedown+drag.
  • :sunglasses::iphone::100: Includes the core touch and HMD view controls for drop-in replacement of core look-controls component.


Panorama with plenty of space to explore the whole scene without anxiety of moving cursor off the canvas

User interface with restricted view angles to focus user on content.

##Usage ####Script

    <!-- A-Frame standard library if needed -->
    <script src=""></script>

    <!-- Component (includes A-Frame core) -->
    <script src="dist/aframe-no-click-look-controls.min.js"></script>
      <!-- ... -->
      <a-entity camera no-click-look-controls="[options]"></a-entity>



$ npm install aframe-no-click-look-controls


var AFRAME = require('aframe-core');
var NoClickLookControls = require('aframe-no-click-look-controls');
AFRAME.registerComponent('no-click-look-controls', NoClickLookControls);



(units are radians)

maxyawControls the max y-axis rotation. Actual max viewing angle is twice the parameter, ie 3π is 3π to the right and 3π to the left.
maxpitchπ/2Controls the max x-axis rotation. Actual max viewing angle is twice the parameter, ie π/2 is π/2 up and π/2 down.
enabledtrueEnables controls

##TODOS (PRs welcome)

  • allow asymmetrical yaw and pitch values rather than forcing symmetrical distances from original camera position

  • add option to slow down camera rotation as the mouse gets closer to the edge of the canvas

  • write tests

RunKit is a free, in-browser JavaScript dev environment for prototyping Node.js code, with every npm package installed. Sign up to share your code.
Sign Up for Free