ViroVPSAnchor

Introduced in ViroReact 3.1.0

ViroVPSAnchor places its children in a VPS map's frame. Inside a ViroARScene with a ViroVPS tracking a location, the renderer moves this node every frame with the map-to-world transform that VPS localisation converges on, the same one the location's mesh follows.

So a child at position={[1, 0, -2]} sits 1 m along the map's X axis and 2 m along its -Z axis, wherever the device started its session, and in the same spot for every device and every session. Map coordinates are metres with Y up.

<ViroARScene>
  <ViroVPS ref={vpsRef} arSceneNavigator={props.arSceneNavigator} />
  <ViroVPSAnchor onAnchorStateChange={(e) => setPlaced(e.state === "tracking")}>
    <Viro3DObject source={require("./statue.glb")} type="GLB" position={[1, 0, -2]} />
  </ViroVPSAnchor>
</ViroARScene>

The anchor stays hidden (children not rendered, their physics not simulated) until localisation converges, and hides again when tracking is lost or stops, or its map is unloaded. It has no transform props of its own, because the renderer owns its transform.

Platform support

Platform	Supported	Notes
iOS	✅
Android	✅
Meta Quest	❌	No VPS.
Apple Vision Pro	❌	Warns once and renders nothing. VPS needs an ARKit or ARCore session.
Web	❌	Warns once and renders nothing. `ViroVPS` reports `unsupported`.

Props

Prop	Type	Default	Description
`children`	`React.ReactNode`		Content in the VPS map's frame.
`visible`	`boolean`	`true`	Your own visibility. The anchor also stays hidden until it is placed.
`renderingOrder`	`number`		As on other nodes.
`viroTag`	`string`		As on other nodes.
`onAnchorStateChange`	`(event: ViroVPSAnchorStateEvent) => void`		`{ state: "tracking" }` once localisation has placed the map, `{ state: "hidden" }` before that and after it is lost or stopped.

ViroVPSAnchorProps, ViroVPSAnchorState ("hidden" | "tracking") and ViroVPSAnchorStateEvent are exported from @reactvision/react-viro.

Placing content at scanned objects

ViroVPS's getSemanticObjects() returns the objects found in the tracked location's scan, in the map's frame. Use their positions for children of the anchor.

Platform support

Props

Placing content at scanned objects

See also