How to use the @microsoft/mixed-reality-extension-sdk.TextAnchorLocation.MiddleCenter function in @microsoft/mixed-reality-extension-sdk

private started() {
        // Create a new actor with no mesh, but some text. This operation is asynchronous, so
        // it returns a "forward" promise (a special promise, as we'll see later).
        const textPromise = Actor.CreateEmpty(this.context, {
            actor: {
                name: 'Text',
                transform: {
                    position: { x: 0, y: 0.5, z: 0 }
                },
                text: {
                    contents: "Hello World!",
                    anchor: TextAnchorLocation.MiddleCenter,
                    color: { r: 30 / 255, g: 206 / 255, b: 213 / 255 },
                    height: 0.3
                }
            }
        });

        // Even though the actor is not yet created in Altspace (because we didn't wait for the promise),
        // we can still get a reference to it by grabbing the `value` field from the forward promise.
        this.text = textPromise.value;

        // Here we create an animation on our text actor. Animations have three mandatory arguments:
        // a name, an array of keyframes, and an array of events.
        this.text.createAnimation(
            // The name is a unique identifier for this animation. We'll pass it to "startAnimation" later.
            "Spin", {
                // Keyframes define the timeline for the animation: where the actor should be, and when.

private started() {
        // Create a new actor with no mesh, but some text. This operation is asynchronous, so
        // it returns a "forward" promise (a special promise, as we'll see later).
        const textPromise = Actor.CreateEmpty(this.context, {
            actor: {
                name: 'Text',
                transform: {
                    app: { position: { x: 0, y: 0.5, z: 0 } }
                },
                text: {
                    contents: "Hello World!",
                    anchor: TextAnchorLocation.MiddleCenter,
                    color: { r: 30 / 255, g: 206 / 255, b: 213 / 255 },
                    height: 0.3
                }
            }
        });

        // Even though the actor is not yet created in Altspace (because we didn't wait for the promise),
        // we can still get a reference to it by grabbing the `value` field from the forward promise.
        this.text = textPromise.value;

        // Here we create an animation on our text actor. Animations have three mandatory arguments:
        // a name, an array of keyframes, and an array of events.
        this.text.createAnimation(
            // The name is a unique identifier for this animation. We'll pass it to "startAnimation" later.
            "Spin", {
                // Keyframes define the timeline for the animation: where the actor should be, and when.

app: { position: { x: 0, y: 1.2, z: 0 } }
                },
            }
        });
        this.textAnchor = textAnchorPromise.value;

        const textPromise = Actor.CreateEmpty(this.context, {
            actor: {
                parentId: this.textAnchor.id,
                name: 'Text',
                transform: {
                    local: { position: { x: 0, y: 0.0, z: -1.5 } }
                },
                text: {
                    contents: "Tic-Tac-Toe!",
                    anchor: TextAnchorLocation.MiddleCenter,
                    color: { r: 30 / 255, g: 206 / 255, b: 213 / 255 },
                    height: 0.3
                },
            }
        });
        const lightPromise = Actor.CreateEmpty(this.context, {
            actor: {
                parentId: textPromise.value.id,
                name: 'Light',
                transform: {
                    local: {
                        position: { x: 0, y: 1.0, z: -0.5 },
                        rotation: Quaternion.RotationAxis(Vector3.Left(), -45.0 * DegreesToRadians),
                    }
                },
                light: {