Three.js is a cross-browser

JavaScript library A JavaScript library is a library of pre-written JavaScript code that allows for easier development of JavaScript-based applications, especially for AJAX and other web-centric technologies. They can be included in a website by embedding it directl ...

and

application programming interface An application programming interface (API) is a connection between computers or between computer programs. It is a type of software Interface (computing), interface, offering a service to other pieces of software. A document or standard that des ...

(API) used to create and display animated

3D computer graphics 3D computer graphics, sometimes called Computer-generated imagery, CGI, 3D-CGI or three-dimensional Computer-generated imagery, computer graphics, are graphics that use a three-dimensional representation of geometric data (often Cartesian coor ...

in a

web browser A web browser, often shortened to browser, is an application for accessing websites. When a user requests a web page from a particular website, the browser retrieves its files from a web server and then displays the page on the user's scr ...

using

WebGL WebGL (short for Web Graphics Library) is a JavaScript Application programming interface, API for rendering interactive 2D and 3D graphics within any compatible web browser without the use of plug-in (computing), plug-ins. WebGL is fully integra ...

. The source code is hosted in a repository on

GitHub GitHub () is a Proprietary software, proprietary developer platform that allows developers to create, store, manage, and share their code. It uses Git to provide distributed version control and GitHub itself provides access control, bug trackin ...

Overview

Three.js allows the creation of

graphical processing unit A graphics processing unit (GPU) is a specialized electronic circuit designed for digital image processing and to accelerate computer graphics, being present either as a discrete video card or embedded on motherboards, mobile phones, personal co ...

(GPU)-accelerated 3D animations using the

JavaScript JavaScript (), often abbreviated as JS, is a programming language and core technology of the World Wide Web, alongside HTML and CSS. Ninety-nine percent of websites use JavaScript on the client side for webpage behavior. Web browsers have ...

language as part of a

website A website (also written as a web site) is any web page whose content is identified by a common domain name and is published on at least one web server. Websites are typically dedicated to a particular topic or purpose, such as news, educatio ...

without relying on proprietary browser plugins. This is possible due to the advent of

, a low-level graphics API created specifically for the web. High-level libraries such as Three.js, Babylon.js, Verge3D and many more make it possible to author complex 3D computer animations for display in the browser without the effort required for a traditional standalone application or a plugin.

History

Three.js was first released by Ricardo Cabello on GitHub in April 2010. The origins of the library can be traced back to his involvement with the

demoscene The demoscene () is an international computer art subculture focused on producing demos: self-contained, sometimes extremely small, computer programs that produce audiovisual presentations. The purpose of a demo is to show off computer programmi ...

in the early 2000s. The code was originally developed in the

ActionScript ActionScript is an object-oriented programming language originally developed by Macromedia Inc. (later acquired by Adobe). It is influenced by HyperTalk, the scripting language for HyperCard. It is now an implementation of ECMAScript (mean ...

language used by

Adobe Flash Adobe Flash (formerly Macromedia Flash and FutureSplash) is a mostly discontinuedAlthough it is discontinued by Adobe Inc., for the Chinese market it is developed by Zhongcheng and for the international enterprise market it is developed by Ha ...

, later being ported to JavaScript in 2009. In Cabello's mind, there were two strong points that justified the shift away from ActionScript: Firstly, JavaScript provided greater platform independence. Secondly, applications written in JavaScript would not need to be compiled by the developer beforehand, unlike Flash applications. Additional contributions by Cabello include API design, CanvasRenderer, SVGRenderer, and being responsible for merging the commits by the various contributors into the project. With the advent of

, Paul Brunt was able to implement the new rendering technology quite easily as Three.js was designed with the rendering code as a module rather than in the core itself. Branislav Uličný, an early contributor, started with Three.js in 2010 after having posted a number of

demos on his own site. He wanted

renderer capabilities in Three.js to exceed those of CanvasRenderer or SVGRenderer. His major contributions generally involve materials, shaders, and post-processing. Soon after the introduction of WebGL 1.0 on Firefox 4 in March 2011, Joshua Koo came on board. He built his first Three.js demo for 3D text in September 2011. His contributions frequently relate to geometry generation. Starting from version 118, Three.js uses WebGL 2.0 by default. Older version of the standard is still available via WebGL1Renderer class. Three.js has over 1950 contributors on GitHub.

Features

Three.js includes the following features: * Effects: Anaglyph, cross-eyed, and parallax barrier. * Scenes: add and remove objects at run-time; fog * Cameras: perspective and orthographic; controllers: trackball, FPS, path and more * Animation: armatures,

forward kinematics In robot kinematics, forward kinematics refers to the use of the kinematic equations of a robot to compute the position of the Robot end effector, end-effector from specified values for the Kinematic pair, joint parameters. The kinematics equat ...

, inverse kinematics, morph, and keyframe * Lights: ambient, direction, point, and spot lights; shadows: cast and receive * Materials: Lambert, Phong, smooth shading, textures, and more * Shaders: access to full OpenGL Shading Language ( GLSL) capabilities: lens flare, depth pass, and extensive post-processing library * Objects: meshes, particles, sprites, lines, ribbons, bones, and more - all with Level of detail * Geometry: plane, cube, sphere, torus, 3D text, and more; modifiers: lathe, extrude, and tube * Import/export: native serialization/deserialization via

JSON JSON (JavaScript Object Notation, pronounced or ) is an open standard file format and electronic data interchange, data interchange format that uses Human-readable medium and data, human-readable text to store and transmit data objects consi ...

glTF glTF (Graphics Library Transmission Format or GL Transmission Format and formerly known as WebGL Transmissions Format or WebGL TF) is a standard file format for three-dimensional scenes and models. A glTF file uses one of two possible file exte ...

, OBJ, USDZ, and more. * Utilities: full set of time and 3D math functions including Viewing frustum,

matrix Matrix (: matrices or matrixes) or MATRIX may refer to: Science and mathematics * Matrix (mathematics), a rectangular array of numbers, symbols or expressions * Matrix (logic), part of a formula in prenex normal form * Matrix (biology), the m ...

quaternion In mathematics, the quaternion number system extends the complex numbers. Quaternions were first described by the Irish mathematician William Rowan Hamilton in 1843 and applied to mechanics in three-dimensional space. The algebra of quater ...

, UVs, and more * Support: API documentation is under construction. A public forum and wiki is in full operation. * Examples: Over 150 files of coding examples plus fonts, models, textures, sounds, and other support files * Debugging: Stats.js, WebGL Inspector, Three.js Inspector * Virtual and Augmented Reality via WebXR Three.js runs in all browsers with support for WebGL 1.0 or WebGL 2.0. Three.js is made available under the

MIT License The MIT License is a permissive software license originating at the Massachusetts Institute of Technology (MIT) in the late 1980s. As a permissive license, it puts very few restrictions on reuse and therefore has high license compatibility. Unl ...

References

External links

* 2010 software 3D scenegraph APIs Cross-platform software Free 3D graphics software Graphics libraries JavaScript libraries Software using the MIT license WebGL {{compu-prog-stub

Overview

History

Features

See also

References

Further reading

External links