sprite
Full Screen
Circular sprites
The demo uses:
- CanvasRenderingContext2D.arc() to create a sprite from a filled disc
- CanvasRenderingContext2D.createRadialGradient() to create a sprite from a radial gradient
- Arguments: the coordinates and radii of two circles (start circle & end circle)
- Returns a CanvasGradient
- CanvasGradient.addColorStop(stop, color) determines color of gradient
- “stop” determines where in the gradient (a value between 0 & 1) the “color” begins to apply
- THREE.Group() – convenient way to group a collection of objects
- THREE.SpriteMaterial() – material used with a sprite
- THREE.Material() – provides a renderer-independent description of an object
- material.color – optional material color (default is white = 0xffffff)
- material.map – optional texture map (default is null)
- Note: The .map is multiplied by the color
- THREE.Texture()
- THREE.Texture(canvas) creates a texture from an HTML canvas
- remember to set .needsUpdate to “true”
- THREE.CanvasTexture(canvas) also creates a texture from an HTML canvas
- API docs: “This is almost the same as the base Texture class, except that it sets needsUpdate to true immediately.