Skip to content
GitLab
    • Explore Projects Groups Snippets
Projects Groups Snippets
  • /
  • Help
    • Help
    • Support
    • Community forum
    • Submit feedback
  • Sign in
  • V Visualization
  • Project information
    • Project information
    • Activity
    • Labels
    • Members
  • Repository
    • Repository
    • Files
    • Commits
    • Branches
    • Tags
    • Contributors
    • Graph
    • Compare
    • Locked Files
  • Merge requests 0
    • Merge requests 0
  • CI/CD
    • CI/CD
    • Pipelines
    • Jobs
    • Schedules
  • Deployments
    • Deployments
    • Environments
    • Releases
  • Packages and registries
    • Packages and registries
    • Package Registry
    • Infrastructure Registry
  • Analytics
    • Analytics
    • Value stream
    • CI/CD
    • Code review
    • Insights
    • Issue
    • Repository
  • Wiki
    • Wiki
  • Snippets
    • Snippets
  • Activity
  • Graph
  • Jobs
  • Commits
Collapse sidebar
  • Volker Coors
  • Visualization
  • Wiki
  • Three.js 101 : Hello World!

Three.js 101 : Hello World! · Changes

Page history
Update Three.js 101 : Hello World! authored 2 years ago by Alfakhori's avatar Alfakhori
Hide whitespace changes
Inline Side-by-side
Showing
with 27 additions and 0 deletions
+27 -0
Three.js-101-:-Hello-World!.md
View page @ c08452fd
...@@ -74,5 +74,32 @@ renderer.setSize( window.innerWidth, window.innerHeight ); ...@@ -74,5 +74,32 @@ renderer.setSize( window.innerWidth, window.innerHeight );
document.body.appendChild( renderer.domElement ); document.body.appendChild( renderer.domElement );
``` ```
## Geometry, Material and Mesh
The second common pattern is adding objects to the scene:
1. Create a Geometry
1. Create a Material
1. Create a Mesh.
1. Add mesh to scene.
In Three.js a Mesh is the composition of a Geometry with a Material.
![image](uploads/110e6ace72c423b82cf46fe462b09156/image.png)
A Geometry is the mathematical formula of an object, in Three.js we have many geometries, we’ll explore it in future chapters. A Geometry give us the vertices of the object we want to add to the scene.
![image](uploads/dbf51acda0ecdf67902f8dd00aba08d2/image.png)
A Material can be defined as the properties of an object and its behavior with the light sources of the scene. As you can see in the following image there are different types of materials.
![image](uploads/547e9738ef6555b4d6982e5d41910355/image.png)
Now that we know what a mesh, a geometry and a material are, we are going to add them to the scene. In this case we are creating a cube with basic Material.
Clone repository
  • Create a simple web AR application [De]
  • Create a simple web AR application
  • Exercise for Multiresolution Models
    • Feature manipulation engine (FME)
    • Introduction
    • Open source datasets
    • Visualization with ArcGIS
    • Visualization with CesiumJS
    • Visualization with Deck.gl
  • FME
  • OGC API 3D GeoVolume
  • Project_1
  • Styling of 3D building models by Attributes
  • Three.js 101 : Hello World!
  • Useful tools
  • Visualization of Bike Sharing Data
View All Pages

Menu

Explore Projects Groups Snippets

Dies ist die Gitlab-Instanz des Transferportals der Hochschule für Technik Stuttgart. Hier geht es zurück zum Portal