Text
The Text component renders 2D text in 3D space using SDF (Signed Distance Field) rendering.
This is ideal for:
- Creating labels and annotations
- Building HUD elements
- Displaying readable text from any distance
- Adding captions to 3D objects
Basic Usage
A minimal example that creates 2D text in 3D space:
import asyncio
from vuer import Vuer
from vuer.schemas import DefaultScene, Text, OrbitControls
app = Vuer()
@app.spawn(start=True)
async def main(session):
session.set @ DefaultScene(
Text(
"Hello World!",
key="label",
color="green",
fontSize=0.15,
position=[0, 0.5, 0],
),
bgChildren=[
OrbitControls(key="OrbitControls")
],
)
while True:
await asyncio.sleep(1.0)
Key Parameters
Basic Parameters
| Parameter |
Type |
Default |
Description |
key |
str |
- |
Unique identifier for the text |
children |
str |
- |
The text content to render |
color |
str |
- |
Text color (hex or named color) |
fontSize |
float |
- |
Font size in world units |
position |
list |
[0,0,0] |
Text position in world coordinates |
rotation |
list |
[0,0,0] |
Text rotation (Euler angles) |
scale |
float |
1 |
Text scale multiplier |
Typography Parameters
| Parameter |
Type |
Default |
Description |
font |
str |
- |
Font URL or name |
fontWeight |
int/str |
- |
Font weight (number or 'bold', 'normal', etc.) |
fontStyle |
str |
- |
Font style: 'italic' or 'normal' |
characters |
str |
- |
Restrict character set for glyph generation |
Layout Parameters
| Parameter |
Type |
Default |
Description |
maxWidth |
float |
- |
Maximum width before text wrapping |
lineHeight |
float |
- |
Line height as a multiple of fontSize |
letterSpacing |
float |
- |
Additional spacing between letters |
textAlign |
str |
- |
Text alignment: 'left', 'right', 'center', 'justify' |
anchorX |
float/str |
- |
Horizontal anchor: number or 'left', 'center', 'right' |
anchorY |
float/str |
- |
Vertical anchor: 'top', 'top-baseline', 'middle', 'bottom-baseline', 'bottom' |
direction |
str |
- |
Text direction: 'auto', 'ltr', or 'rtl' |
overflowWrap |
str |
- |
Wrapping behavior: 'normal' or 'break-word' |
whiteSpace |
str |
- |
White space handling: 'normal', 'overflowWrap', 'nowrap' |
Styling Parameters
| Parameter |
Type |
Default |
Description |
fillOpacity |
float |
- |
Fill opacity (0-1) |
clipRect |
list |
- |
Clipping rectangle [minX, minY, maxX, maxY] |
depthOffset |
float |
- |
Z-offset to avoid z-fighting |
Outline Parameters
| Parameter |
Type |
Default |
Description |
outlineWidth |
float/str |
- |
Outline width (number or string like '2px') |
outlineOffsetX |
float/str |
- |
Outline X offset |
outlineOffsetY |
float/str |
- |
Outline Y offset |
outlineBlur |
float/str |
- |
Outline blur radius |
outlineColor |
str |
- |
Outline color |
outlineOpacity |
float |
- |
Outline opacity (0-1) |
Stroke Parameters
| Parameter |
Type |
Default |
Description |
strokeWidth |
float/str |
- |
Stroke width (number or string) |
strokeColor |
str |
- |
Stroke color |
strokeOpacity |
float |
- |
Stroke opacity (0-1) |
Advanced Parameters
| Parameter |
Type |
Default |
Description |
sdfGlyphSize |
int |
- |
SDF glyph size for rendering quality |
debugSDF |
bool |
- |
Show SDF debug overlay |
glyphGeometryDetail |
int |
- |
Level of detail for glyph geometry |
Learn More
For detailed examples of using Text, see: