groep van 8 kubussen en 3 cylinders

Three.js                          terug naar de startpagina

Three.js is een javascript framework om 3D animaties te maken en middels WebGL (Web Graphic Library) te renderen
Three.js is in 2010 ontwikkeld door Ricardo Cabello.  Ga naar de website van Three.js voor de documentatie en de voorbeelden
De voorbeelden, documentatie en javascripts zijn te downloaden van github. De map build bevat het three.js script.
In de map examples/controls/ staat  het OrbitControls.js script
 
Om verwarring te voorkomen. De zelf gemaakte java bestanden noem ik schetsen en de bestanden van Three.js noem ik scripts.
 
Voor het editen van de schetsen maak ik gebruik van Atom.
De animaties zijn te bekijken via de in Atom geinstalleerde live server van jas-chen
via firefox --> webontwikkelaar --> webconsole kan je de code controleren op fouten en debuggen
 

In de start schets worden de basisprincipes van three.js uiteengezet

De schetsen 1  t/m 5 maken gebruik van een HTML en CSS bestand, zie:   benodigde HTML en CSS bestanden

 

 1  start schets   maakt alleen gebruik van het three.js script
 2 torus, bol en kubus animatie    
 3 groep van 8 kubussen en 3 cylinders                                                                  
 4 wereldbeeld   animatie met een equirectangulair image en wolken als achtergrond
 5 spiegelbal   in een 3D omgeving met de muis te manipuleren
 6 shaders in three.js   animatie met ShaderMaterial en GLSL (Open GL Shading Language) functies
 7 low poly car gemaakt in Blender   de car is als glTF bestand geimporteerd mbv de GLTFLoader module
 8 drie kubussen   met transparante afbeeldingen
 9  rollercoaster    VR effect met cardboard in telefoon
10 virtual reality met cardboard    met 12 animaties
       

 

de in firefox geopende webconsole

De, in firefox, geopende webconsole

 

foutmeldingen als javascripts niet worden gevonden

foutmeldingen als javascripts niet worden gevonden

 

syntax fout, als je op  .js klik kom je in de debugger
 
syntax fout, als je op  .js klik kom je in de debugger
 
 
 
onbegrepen waarschuwing
onbegrepen waarschuwing, ontstaat soms
na het herstellen van een fout
die verdijnt na het opnieuw opstarten van Atom