Three js
This presentation is the property of its rightful owner.
Sponsored Links
1 / 11

Three.js PowerPoint PPT Presentation


  • 138 Views
  • Uploaded on
  • Presentation posted in: General

Three.js. Faciliter le WebGL. Three. Framework Comme Jquerry Pour faire de la 3D. Exemple. http://acko.net/ http://inear.se/beanstalk/ http://lab.sehsucht.de/ http://substack.net/projects/voxel-forest/. Exercice 1. Faites appel à three

Download Presentation

Three.js

An Image/Link below is provided (as is) to download presentation

Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author.While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server.


- - - - - - - - - - - - - - - - - - - - - - - - - - E N D - - - - - - - - - - - - - - - - - - - - - - - - - -

Presentation Transcript


Three js

Three.js

Faciliter le WebGL


Three

Three

  • Framework

    • Comme Jquerry

    • Pour faire de la 3D


Exemple

Exemple

  • http://acko.net/

  • http://inear.se/beanstalk/

  • http://lab.sehsucht.de/

  • http://substack.net/projects/voxel-forest/


Exercice 1

Exercice 1

  • Faites appel à three

  • "https://rawgithub.com/mrdoob/three.js/master/build/three.js"


Exercice 2

Exercice 2

  • Créer une scène

    • Scène

    • Camera

    • Render


Exercice 3

Exercice 3

  • Créer un cube dans la scène


Exercice 4

Exercice 4

  • Afficher la scène


Exercice 5

Exercice 5

  • Faites tourner le cube


Exercice 6

Exercice 6

  • Se servir du script

    • OrbitControls.js

      Pour faire pivoter la scene


Three js

  • <script src = "OrbitControls.js"></script>

  • controls = new THREE.OrbitControls( camera, renderer.domElement );

  • Dans la fonction render

    • controls.update();


Exercice 7

Exercice 7

  • Ajouter un plan pour que la rotation soit plus visible


  • Login