Signatur
Beschreibung
Mit delete() sagst du dem XR-System, dass ein Anker nicht mehr gebraucht wird. Ein Anker (XRAnchor) markiert eine feste Position und Ausrichtung in der realen Umgebung, zum Beispiel die Stelle, an der ein virtuelles Möbelstück auf dem Boden steht. Das System korrigiert diese Pose ständig, damit der Inhalt auch dann an seinem Platz bleibt, wenn es sein Bild der Umgebung nachbessert.
Das Verfolgen jedes Ankers kostet Rechenzeit und Speicher auf dem Gerät. Deshalb solltest du Anker löschen, sobald der zugehörige virtuelle Inhalt entfernt wird, der Nutzer ein Objekt neu platziert oder du nur eine begrenzte Zahl von Ankern behalten willst. Nach dem Aufruf ist der Anker nicht mehr in XRFrame.trackedAnchors enthalten. Sein anchorSpace liefert dann keine sinnvolle Pose mehr.
Die Methode arbeitet synchron, erwartet keine Argumente und gibt nichts zurück. Einen gelöschten Anker kannst du nicht zurückholen. Dafür musst du mit XRFrame.createAnchor() oder XRHitTestResult.createAnchor() einen neuen anlegen. Bei dauerhaft gespeicherten Ankern (requestPersistentHandle()) entfernt delete() nur den Anker in der laufenden Sitzung. Den gespeicherten Datensatz löschst du mit XRSession.deletePersistentAnchor().
Rückgabewert
undefined).Beispiele
Anker anlegen und wieder löschen
// Voraussetzung: Die Sitzung wurde mit dem Feature 'anchors' angefordert
const session = await navigator.xr.requestSession('immersive-ar', {
requiredFeatures: ['anchors']
});
const refSpace = await session.requestReferenceSpace('local');
let anchor = null;
session.requestAnimationFrame(async (time, frame) => {
// Anker 1 m vor dem Ursprung anlegen
const pose = new XRRigidTransform({ x: 0, y: 0, z: -1 });
anchor = await frame.createAnchor(pose, refSpace);
console.log('Anker angelegt');
// Später: Anker wieder entfernen
anchor.delete();
anchor = null;
console.log('Anker gelöscht');
});Höchstens N Anker gleichzeitig behalten
const MAX_ANCHORS = 5;
const anchors = [];
// Wird beim Tippen des Nutzers mit einem Hit-Test-Ergebnis aufgerufen
const placeObject = async (hitTestResult) => {
const anchor = await hitTestResult.createAnchor();
anchors.push(anchor);
// Den ältesten Anker entfernen, wenn das Limit überschritten ist
if (anchors.length > MAX_ANCHORS) {
const oldest = anchors.shift();
oldest.delete();
console.log(`Alter Anker entfernt, aktiv: ${anchors.length}`);
}
};Anker und 3D-Objekt gemeinsam aufräumen
// Zuordnung: Anker -> 3D-Objekt (z. B. aus three.js)
const anchoredObjects = new Map();
const removeObject = (anchor, scene) => {
const object = anchoredObjects.get(anchor);
if (object) scene.remove(object);
anchoredObjects.delete(anchor);
anchor.delete();
};
// Im Render-Loop nur Anker aktualisieren, die noch verfolgt werden
const onXRFrame = (time, frame, refSpace) => {
for (const [anchor, object] of anchoredObjects) {
if (!frame.trackedAnchors.has(anchor)) continue;
const pose = frame.getPose(anchor.anchorSpace, refSpace);
if (pose) object.matrix.fromArray(pose.transform.matrix);
}
};// Wichtig · Fallstricke
- Experimentell: Das WebXR Anchors Module ist noch kein fertiger Standard. Unterstützt wird es vor allem von Chromium-Browsern auf Android mit ARCore und vom Meta Quest Browser. Firefox und Safari unterstützen es nicht. Prüfe die Unterstützung vorher mit
'XRAnchor' in window. - Anker gibt es nur in Sitzungen, die mit
requiredFeaturesoderoptionalFeatures: ['anchors']angefordert wurden. Außerdem braucht die Seite einen sicheren Kontext (HTTPS). - Nach
delete()solltest du den Anker nicht mehr verwenden.frame.getPose(anchor.anchorSpace, …)liefert dann in der Regelnull. Entferne deshalb auch alle eigenen Verweise darauf, etwa in Arrays oder Maps. - Wenn die Sitzung endet, werden alle Anker automatisch ungültig. Ein ausdrückliches
delete()ist dann nicht nötig. - Dauerhaft gespeicherte Anker bleiben nach
delete()erhalten. Um sie endgültig zu entfernen, rufst dusession.deletePersistentAnchor(uuid)auf. - Viele gleichzeitig verfolgte Anker belasten das Tracking und den Akku. Lösche deshalb nicht mehr benötigte Anker zeitnah.