Threejs3D Code Play

Threejs3D Code Play helpt je Three.js te leren door code te bewerken en het resultaat te zien als een interactieve 3D-scène. Begin met een voorbeeld, wijzig de HTML en JavaScript en voer je eigen versie uit in de app.

LEER DOOR MIDDEL VAN WERKENDE SCÈNES

Ontdek 99 voorbeelden in leerexperimenten en vooraf gedefinieerde geanimeerde scènes. Begin met vormen, materialen, belichting en camera's en onderzoek vervolgens deeltjes, shaders en interactie. Probeer een zonnestelsel, oceaan golven of een geanimeerde abstracte scène als je een groter startpunt wilt.

Vijf leerpaden organiseren voorbeelden in basisprincipes, geometrie, kleur en licht, beweging en een creatieve workshop. Markeer lessen als voltooid, ga verder met een pad, voeg nuttige voorbeelden toe aan je favorieten en keer terug naar recent geopende scènes.

BEWERK, VOER UIT EN ONDERZOEK

Open een voorbeeld in de code-editor of start een nieuw project met een reeds aanwezige Three.js-import. Gebruik syntaxmarkering, ongedaan maken en opnieuw uitvoeren, zoeken en vervangen en ga naar een specifieke regel terwijl je werkt. Schakel over naar de voorbeeldweergave om de huidige code te bekijken en consoleberichten of fouten te inspecteren.

Sleep om te roteren en knijp om in te zoomen in de meegeleverde scènevoorbeelden. Voor scènes die dit ondersteunen, kunt u met live controls de kleur, animatiesnelheid, belichting, geometrie en effen of verlopende achtergronden verkennen. De beschikbare controls zijn afhankelijk van de scène.

BEWAAR UW EXPERIMENTEN

Sla projecten met een naam op en heropen ze vanuit 'Uw projecten'. Open HTML-bestanden om verder te werken aan bestaand werk, of gebruik 'Opslaan als' om een ​​aparte kopie te bewaren.

Exporteer of deel een project als HTML of ZIP. Exports bevatten de herkende meegeleverde Three.js-bibliotheken; aangepaste externe assets blijven extern. Pak een ZIP-bestand uit en deel de map via HTTP om het project buiten de app te openen.

ANIMEER UW ACHTERGROND

Op compatibele Android-apparaten met de vereiste native ondersteuning kunt u een geanimeerde scène naar de live wallpaper-preview van het systeem sturen en uw keuze daar bevestigen. Beschikbare bestemmingen voor achtergronden zijn afhankelijk van het apparaat.

Ontwikkeld voor studenten, hobbyisten en webontwikkelaars die 3D-programmering willen oefenen door middel van kleine experimenten. De meegeleverde voorbeelden gebruiken lokale bibliotheken; aangepaste externe bronnen en advertenties vereisen mogelijk internettoegang. De app bevat advertenties.