Nonlinear Performance Magnification
    Have ideas to improve npm?Join in the discussion! »

    ng-three

    0.87.2 • Public • Published

    three.js

    [![Gitter][gitter-badge]][gitter-badge-url] [![Latest NPM release][npm-badge]][npm-badge-url] [![License][license-badge]][license-badge-url] [![Dependencies][dependencies-badge]][dependencies-badge-url] [![Dev Dependencies][devDependencies-badge]][devDependencies-badge-url]

    Angular 3D library

    The Three.js 3D library has beed adapted for use with Angular >2.0!

    Official Website

    Usage

    Import Three.js into your module / component.

     
     
    // TODO: Write Typescript Example
     
    //Plain Javascript
     
    var scene, camera, renderer;
    var geometry, material, mesh;
     
    init();
    animate();
     
    function init() {
     
        scene = new THREE.Scene();
     
        camera = new THREE.PerspectiveCamera( 75, window.innerWidth / window.innerHeight, 1, 10000 );
        camera.position.z = 1000;
     
        geometry = new THREE.BoxGeometry( 200, 200, 200 );
        material = new THREE.MeshBasicMaterial( { color: 0xff0000, wireframe: true } );
     
        mesh = new THREE.Mesh( geometry, material );
        scene.add( mesh );
     
        renderer = new THREE.WebGLRenderer();
        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 );
     
    }

    Change log

    1. First Angular conversion.

    Official THREE releases

    Install

    npm i ng-three

    DownloadsWeekly Downloads

    348

    Version

    0.87.2

    License

    MIT

    Last publish

    Collaborators

    • avatar