Maak 3D-webapps & -graphics met Whitestorm.js

Web games hebben een lange weg afgelegd dankzij WebGL en gerelateerde HTML5-API's. De meest prominente open source bibliotheek voor 3D is Three.js.

Hoewel Three.js krachtig is, is het dat ook complex om van nul te leren. In plaats daarvan kunt u neem Whitestorm.js op, een open source framework gemaakt voor 3D webafbeeldingen. Het gebruikt Three.js als een onderliggende technologie om je te helpen sneller te bouwen en realistische 3D-effecten te creëren in de browser.

Whitestorm wordt geleverd met zijn een eigen physics-engine bovenop de rendering Three.js gebouwd. Hiermee kunt u realistische objecten maken met zwaartekracht en andere vergelijkbare effecten interactie en reageren op elkaar.

En Whitestorm is volledig modulair, dus je hebt volledige controle over welke functies op de pagina worden geladen. Het gebruikt de Bullet Physics-bibliotheek geport in JavaScript voor volledige ondersteuning op internet.

Hier is een basisfragment van code dat creëert een nieuwe Three.js-omgeving met behulp van Whitestorm.

 const app = new WHS.App ([new WHS.app.ElementModule (), // attach to DOM new WHS.app.SceneModule (), // create THREE.Scene instantie new WHS.app.CameraModule (), // maakt PerspectiveCamera-instantie nieuw WHS.app.RenderingModule () // maakt WebGLRenderer-instantie]); app.start (); // animatie uitvoeren 

Dat kun je natuurlijk doen voeg je eigen modules toe en zelfs maak plug-ins / componenten gebouwd van de standaardbibliotheek. De JS-code ondersteunt ECMAScript 6 en moet alle aankomende wijzigingen in de taal ondersteunen.

Geometrie, fysica, en beweging allemaal in één bibliotheek gerold. Whitestorm is echt de toekomst van 3D-animatie voor het web.

Je kunt vinden veel voorbeeldcodes in de GitHub repo samen met Download links en een bestandsbrowser. Wees gewaarschuwd dat de bibliotheek dat is reusachtig dus er is veel om door te maken. Zelfs de documentatie heeft lange tutorials voor beginners.

Maar met die documenten kun je alles van leren 3D-transformaties naar debugging en gedetailleerde 3D-animatie.

Ga voor meer informatie naar de hoofdpagina en blader door enkele live voorbeelden voor zie Whitestorm in actie. Als je genoeg durft om in te duiken, download dan een kopie van de bibliotheek van GitHub of via npm en begin met het maken van een aantal leuke 3D web-apps.