(Essentially this is a 2D drawing APIĮmbedded in a 3D drawing library.) Why do this? Well, once you have yourĢD shape, you can use it to create a flat mesh that lives in 3D space: Import that data into Three.js by using the Path class, which includes path-generation Geopolitical boundaries or vector clip art). Say you have an existing library of 2D polygon data (for example, Used to create flat 2D shapes or 3D extrusions of those shapes. The scene is lit with a directional light to show theįigure 4-2. Spline-based extrusions in Three.js The textureĬomes courtesy of PixelCG Tips and Tricks, a great computer graphics how-to Object contains a different geometry type, with a reference texture mapĭisplaying how texture coordinates are generated for each. Located in the Three.js project at examples/webgl_geometries.html, depicted in To see Three.js prebuilt geometry in action, run the sample Though some require slightly more complex parameters and a little more YouĬan easily create most of these objects using a one-line constructor, Three.js also supports drawing 3D points and lines. Toruses, and knots flat 2D shapes rendered in 3D space, such asĬircles, squares, and rings and even 3D extruded text generated from This includes simple solids such as cubes, spheres, and cylinders moreĬomplex parametric shapes like extrusions and path-based shapes, Three.js comes with many prebuilt geometry types that represent common shapes.