JSPM

three

0.92.0
  • ESM via JSPM
  • ES Module Entrypoint
  • Export Map
  • Keywords
  • License
  • Repository URL
  • TypeScript Types
  • README
  • Created
  • Published
  • Downloads 2887397
  • Score
    100M100P100Q181620F
  • License MIT

JavaScript 3D library

Package Exports

  • three
  • three/build/three.js
  • three/build/three.min
  • three/build/three.min.js
  • three/build/three.module
  • three/build/three.module.js
  • three/examples/fonts/helvetiker_bold.typeface.json
  • three/examples/fonts/helvetiker_regular.typeface.json
  • three/examples/js/Detector.js
  • three/examples/js/controls/DeviceOrientationControls
  • three/examples/js/controls/DeviceOrientationControls.js
  • three/examples/js/controls/DragControls
  • three/examples/js/controls/FirstPersonControls
  • three/examples/js/controls/OrbitControls
  • three/examples/js/controls/OrbitControls.js
  • three/examples/js/controls/PointerLockControls
  • three/examples/js/controls/TrackballControls
  • three/examples/js/controls/TrackballControls.js
  • three/examples/js/controls/TransformControls.js
  • three/examples/js/controls/VRControls
  • three/examples/js/controls/VRControls.js
  • three/examples/js/effects/StereoEffect
  • three/examples/js/effects/VREffect
  • three/examples/js/effects/VREffect.js
  • three/examples/js/exporters/GLTFExporter
  • three/examples/js/exporters/GLTFExporter.js
  • three/examples/js/exporters/OBJExporter
  • three/examples/js/exporters/PLYExporter
  • three/examples/js/exporters/STLExporter
  • three/examples/js/geometries/TeapotBufferGeometry
  • three/examples/js/libs/dat.gui.min.js
  • three/examples/js/libs/inflate.min
  • three/examples/js/libs/inflate.min.js
  • three/examples/js/libs/stats.min
  • three/examples/js/libs/stats.min.js
  • three/examples/js/loaders/ColladaLoader
  • three/examples/js/loaders/DDSLoader
  • three/examples/js/loaders/DRACOLoader
  • three/examples/js/loaders/FBXLoader
  • three/examples/js/loaders/GLTFLoader
  • three/examples/js/loaders/HDRCubeTextureLoader
  • three/examples/js/loaders/LoaderSupport.js
  • three/examples/js/loaders/MTLLoader
  • three/examples/js/loaders/MTLLoader.js
  • three/examples/js/loaders/OBJLoader
  • three/examples/js/loaders/OBJLoader.js
  • three/examples/js/loaders/OBJLoader2.js
  • three/examples/js/loaders/PLYLoader
  • three/examples/js/loaders/RGBELoader
  • three/examples/js/loaders/STLLoader
  • three/examples/js/loaders/SVGLoader
  • three/examples/js/loaders/VTKLoader
  • three/examples/js/loaders/ctm/ctm.js
  • three/examples/js/loaders/ctm/lzma.js
  • three/examples/js/math/Lut
  • three/examples/js/modifiers/SimplifyModifier
  • three/examples/js/modifiers/SimplifyModifier.js
  • three/examples/js/nodes/AttributeNode.js
  • three/examples/js/nodes/ConstNode.js
  • three/examples/js/nodes/FunctionCallNode.js
  • three/examples/js/nodes/FunctionNode.js
  • three/examples/js/nodes/GLNode.js
  • three/examples/js/nodes/InputNode.js
  • three/examples/js/nodes/NodeBuilder.js
  • three/examples/js/nodes/NodeLib.js
  • three/examples/js/nodes/NodeMaterial.js
  • three/examples/js/nodes/RawNode.js
  • three/examples/js/nodes/TempNode.js
  • three/examples/js/nodes/VarNode.js
  • three/examples/js/nodes/accessors/CameraNode.js
  • three/examples/js/nodes/accessors/ColorsNode.js
  • three/examples/js/nodes/accessors/LightNode.js
  • three/examples/js/nodes/accessors/NormalNode.js
  • three/examples/js/nodes/accessors/PositionNode.js
  • three/examples/js/nodes/accessors/ReflectNode.js
  • three/examples/js/nodes/accessors/ScreenUVNode.js
  • three/examples/js/nodes/accessors/UVNode.js
  • three/examples/js/nodes/inputs/ColorNode.js
  • three/examples/js/nodes/inputs/CubeTextureNode.js
  • three/examples/js/nodes/inputs/FloatNode.js
  • three/examples/js/nodes/inputs/IntNode.js
  • three/examples/js/nodes/inputs/TextureNode.js
  • three/examples/js/nodes/inputs/Vector2Node.js
  • three/examples/js/nodes/inputs/Vector3Node.js
  • three/examples/js/nodes/inputs/Vector4Node.js
  • three/examples/js/nodes/materials/PhongNode.js
  • three/examples/js/nodes/materials/PhongNodeMaterial.js
  • three/examples/js/nodes/materials/StandardNode.js
  • three/examples/js/nodes/materials/StandardNodeMaterial.js
  • three/examples/js/nodes/math/Math1Node.js
  • three/examples/js/nodes/math/Math2Node.js
  • three/examples/js/nodes/math/Math3Node.js
  • three/examples/js/nodes/math/OperatorNode.js
  • three/examples/js/nodes/utils/BlurNode.js
  • three/examples/js/nodes/utils/BumpNode.js
  • three/examples/js/nodes/utils/ColorAdjustmentNode.js
  • three/examples/js/nodes/utils/JoinNode.js
  • three/examples/js/nodes/utils/LuminanceNode.js
  • three/examples/js/nodes/utils/NoiseNode.js
  • three/examples/js/nodes/utils/ResolutionNode.js
  • three/examples/js/nodes/utils/RoughnessToBlinnExponentNode.js
  • three/examples/js/nodes/utils/SwitchNode.js
  • three/examples/js/nodes/utils/TimerNode.js
  • three/examples/js/nodes/utils/VelocityNode.js
  • three/examples/js/pmrem/PMREMCubeUVPacker
  • three/examples/js/pmrem/PMREMGenerator
  • three/examples/js/postprocessing/AdaptiveToneMappingPass
  • three/examples/js/postprocessing/BloomPass
  • three/examples/js/postprocessing/EffectComposer
  • three/examples/js/postprocessing/MaskPass
  • three/examples/js/postprocessing/RenderPass
  • three/examples/js/postprocessing/SSAARenderPass
  • three/examples/js/postprocessing/SSAOPass
  • three/examples/js/postprocessing/ShaderPass
  • three/examples/js/postprocessing/UnrealBloomPass
  • three/examples/js/renderers/CSS3DRenderer
  • three/examples/js/renderers/CSS3DRenderer.js
  • three/examples/js/renderers/CanvasRenderer
  • three/examples/js/renderers/Projector
  • three/examples/js/renderers/SoftwareRenderer
  • three/examples/js/shaders/ConvolutionShader
  • three/examples/js/shaders/CopyShader
  • three/examples/js/shaders/FXAAShader
  • three/examples/js/shaders/GammaCorrectionShader
  • three/examples/js/shaders/LuminosityHighPassShader
  • three/examples/js/shaders/LuminosityShader
  • three/examples/js/shaders/SSAOShader
  • three/examples/js/shaders/ToneMapShader
  • three/examples/js/vr/WebVR
  • three/package.json
  • three/src/Three
  • three/src/animation/AnimationAction
  • three/src/animation/AnimationClip
  • three/src/animation/AnimationClip.js
  • three/src/animation/AnimationMixer
  • three/src/animation/AnimationMixer.js
  • three/src/animation/KeyframeTrack
  • three/src/animation/PropertyBinding
  • three/src/animation/PropertyBinding.js
  • three/src/animation/tracks/NumberKeyframeTrack
  • three/src/animation/tracks/NumberKeyframeTrack.js
  • three/src/animation/tracks/QuaternionKeyframeTrack
  • three/src/animation/tracks/VectorKeyframeTrack
  • three/src/cameras/Camera
  • three/src/cameras/CubeCamera
  • three/src/cameras/OrthographicCamera
  • three/src/cameras/OrthographicCamera.js
  • three/src/cameras/PerspectiveCamera
  • three/src/cameras/PerspectiveCamera.js
  • three/src/cameras/StereoCamera
  • three/src/constants
  • three/src/constants.js
  • three/src/core/BufferAttribute
  • three/src/core/BufferAttribute.js
  • three/src/core/BufferGeometry
  • three/src/core/BufferGeometry.js
  • three/src/core/Clock
  • three/src/core/Clock.js
  • three/src/core/EventDispatcher
  • three/src/core/EventDispatcher.js
  • three/src/core/Face3
  • three/src/core/Geometry
  • three/src/core/Geometry.js
  • three/src/core/InstancedBufferAttribute
  • three/src/core/InstancedBufferGeometry
  • three/src/core/InterleavedBuffer
  • three/src/core/InterleavedBufferAttribute
  • three/src/core/Layers.js
  • three/src/core/Object3D
  • three/src/core/Object3D.js
  • three/src/core/Raycaster
  • three/src/core/Raycaster.js
  • three/src/extras/core/Curve
  • three/src/extras/core/Font.js
  • three/src/extras/core/Path
  • three/src/extras/core/Path.js
  • three/src/extras/core/Shape
  • three/src/extras/core/Shape.js
  • three/src/extras/core/ShapePath
  • three/src/extras/core/ShapePath.js
  • three/src/extras/curves/CatmullRomCurve3.js
  • three/src/geometries/BoxGeometry
  • three/src/geometries/BoxGeometry.js
  • three/src/geometries/CircleGeometry
  • three/src/geometries/CircleGeometry.js
  • three/src/geometries/CylinderGeometry
  • three/src/geometries/DodecahedronGeometry.js
  • three/src/geometries/ExtrudeGeometry
  • three/src/geometries/IcosahedronGeometry.js
  • three/src/geometries/PlaneGeometry
  • three/src/geometries/PlaneGeometry.js
  • three/src/geometries/RingGeometry
  • three/src/geometries/ShapeGeometry.js
  • three/src/geometries/SphereGeometry
  • three/src/geometries/SphereGeometry.js
  • three/src/geometries/TextGeometry
  • three/src/geometries/TextGeometry.js
  • three/src/geometries/TorusKnotGeometry.js
  • three/src/helpers/BoxHelper
  • three/src/helpers/CameraHelper
  • three/src/helpers/GridHelper
  • three/src/helpers/PointLightHelper
  • three/src/lights/AmbientLight
  • three/src/lights/AmbientLight.js
  • three/src/lights/DirectionalLight
  • three/src/lights/Light
  • three/src/lights/PointLight
  • three/src/lights/PointLight.js
  • three/src/lights/RectAreaLight.js
  • three/src/lights/SpotLight
  • three/src/lights/SpotLight.js
  • three/src/loaders/BufferGeometryLoader.js
  • three/src/loaders/CompressedTextureLoader
  • three/src/loaders/CubeTextureLoader
  • three/src/loaders/DataTextureLoader
  • three/src/loaders/FileLoader
  • three/src/loaders/FileLoader.js
  • three/src/loaders/FontLoader
  • three/src/loaders/FontLoader.js
  • three/src/loaders/ImageLoader
  • three/src/loaders/Loader
  • three/src/loaders/Loader.js
  • three/src/loaders/LoaderUtils
  • three/src/loaders/LoaderUtils.js
  • three/src/loaders/LoadingManager
  • three/src/loaders/LoadingManager.js
  • three/src/loaders/MaterialLoader
  • three/src/loaders/ObjectLoader
  • three/src/loaders/TextureLoader
  • three/src/loaders/TextureLoader.js
  • three/src/materials/LineBasicMaterial
  • three/src/materials/LineBasicMaterial.js
  • three/src/materials/Material
  • three/src/materials/Material.js
  • three/src/materials/MeshBasicMaterial
  • three/src/materials/MeshBasicMaterial.js
  • three/src/materials/MeshDepthMaterial
  • three/src/materials/MeshLambertMaterial
  • three/src/materials/MeshLambertMaterial.js
  • three/src/materials/MeshNormalMaterial.js
  • three/src/materials/MeshPhongMaterial
  • three/src/materials/MeshPhongMaterial.js
  • three/src/materials/MeshPhysicalMaterial
  • three/src/materials/MeshPhysicalMaterial.js
  • three/src/materials/MeshStandardMaterial
  • three/src/materials/MeshStandardMaterial.js
  • three/src/materials/PointsMaterial
  • three/src/materials/PointsMaterial.js
  • three/src/materials/ShaderMaterial
  • three/src/materials/ShaderMaterial.js
  • three/src/materials/ShadowMaterial
  • three/src/materials/SpriteMaterial.js
  • three/src/math/Box3
  • three/src/math/Box3.js
  • three/src/math/Color
  • three/src/math/Color.js
  • three/src/math/Euler
  • three/src/math/Frustum
  • three/src/math/Interpolant
  • three/src/math/Interpolant.js
  • three/src/math/Math
  • three/src/math/Math.js
  • three/src/math/Matrix3
  • three/src/math/Matrix3.js
  • three/src/math/Matrix4
  • three/src/math/Matrix4.js
  • three/src/math/Plane.js
  • three/src/math/Quaternion
  • three/src/math/Quaternion.js
  • three/src/math/Ray.js
  • three/src/math/Sphere
  • three/src/math/Sphere.js
  • three/src/math/Spherical
  • three/src/math/Spherical.js
  • three/src/math/Triangle
  • three/src/math/Vector2
  • three/src/math/Vector2.js
  • three/src/math/Vector3
  • three/src/math/Vector3.js
  • three/src/math/Vector4
  • three/src/math/Vector4.js
  • three/src/math/interpolants/DiscreteInterpolant
  • three/src/math/interpolants/LinearInterpolant
  • three/src/objects/Bone
  • three/src/objects/Group
  • three/src/objects/Group.js
  • three/src/objects/Line
  • three/src/objects/Line.js
  • three/src/objects/LineLoop
  • three/src/objects/LineSegments
  • three/src/objects/LineSegments.js
  • three/src/objects/Mesh
  • three/src/objects/Mesh.js
  • three/src/objects/Points
  • three/src/objects/Points.js
  • three/src/objects/Skeleton
  • three/src/objects/SkinnedMesh
  • three/src/objects/Sprite.js
  • three/src/polyfills.js
  • three/src/renderers/WebGL2Renderer
  • three/src/renderers/WebGLRenderTarget
  • three/src/renderers/WebGLRenderTarget.js
  • three/src/renderers/WebGLRenderTargetCube
  • three/src/renderers/WebGLRenderer
  • three/src/renderers/WebGLRenderer.js
  • three/src/renderers/shaders/ShaderChunk
  • three/src/renderers/shaders/ShaderChunk.js
  • three/src/renderers/shaders/ShaderLib
  • three/src/renderers/shaders/ShaderLib.js
  • three/src/renderers/shaders/UniformsLib
  • three/src/renderers/shaders/UniformsLib.js
  • three/src/renderers/shaders/UniformsUtils
  • three/src/renderers/shaders/UniformsUtils.js
  • three/src/renderers/webgl/WebGLShadowMap
  • three/src/scenes/Fog.js
  • three/src/scenes/FogExp2
  • three/src/scenes/Scene
  • three/src/scenes/Scene.js
  • three/src/textures/CanvasTexture
  • three/src/textures/CanvasTexture.js
  • three/src/textures/CompressedTexture
  • three/src/textures/CubeTexture
  • three/src/textures/DataTexture
  • three/src/textures/DataTexture.js
  • three/src/textures/Texture
  • three/src/textures/Texture.js

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (three) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

three.js

Latest NPM release License Dependencies Dev Dependencies Build Status

JavaScript 3D library

The aim of the project is to create an easy to use, lightweight, 3D library. The library provides <canvas>, <svg>, CSS3D and WebGL renderers.

ExamplesDocumentationWikiMigratingQuestionsForumGitterSlack

Usage

Download the minified library and include it in your HTML, or install and import it as a module, Alternatively see how to build the library yourself.

<script src="js/three.min.js"></script>

This code creates a scene, a camera, and a geometric cube, and it adds the cube to the scene. It then creates a WebGL renderer for the scene and camera, and it adds that viewport to the document.body element. Finally, it animates the cube within the scene for the camera.

var camera, scene, renderer;
var geometry, material, mesh;

init();
animate();

function init() {

    camera = new THREE.PerspectiveCamera( 70, window.innerWidth / window.innerHeight, 0.01, 10 );
    camera.position.z = 1;

    scene = new THREE.Scene();

    geometry = new THREE.BoxGeometry( 0.2, 0.2, 0.2 );
    material = new THREE.MeshNormalMaterial();

    mesh = new THREE.Mesh( geometry, material );
    scene.add( mesh );

    renderer = new THREE.WebGLRenderer( { antialias: true } );
    renderer.setSize( window.innerWidth, window.innerHeight );
    document.body.appendChild( renderer.domElement );

}

function animate() {

    requestAnimationFrame( animate );

    mesh.rotation.x += 0.01;
    mesh.rotation.y += 0.02;

    renderer.render( scene, camera );

}

If everything went well you should see this.

Change log

releases