Cargar GLTF/GLB en Tiempo de Ejecución

Para construir proyectos grandes en Wonderland Engine, puedes querer cargar activos solo cuando los necesites. Cargar activos en tiempo de ejecución reduce el desorden en tu editor y permite soluciones de carga dinámica para escenas grandes y complejas.

Wonderland Engine ofrece dos opciones para cargar activos en tiempo de ejecución: Cargar desde archivos .glb/.gltf o transmitir archivos .bin.

Habilitar la Carga de GLTF en Tiempo de Ejecución 

La carga de GLTF en tiempo de ejecución es una función opcional que debe habilitarse en el Editor de Wonderland. Abre tu proyecto y navega a Views > Project Settings > Runtime y selecciona la casilla enableRuntimeGltf.

Añadir un Archivo para Carga en Tiempo de Ejecución 

La forma más sencilla de preparar archivos para carga en tiempo de ejecución es agregarlos a la carpeta static de tu proyecto, cuyo contenido se copiará en la carpeta deploy de tu proyecto cuando empaquetes tu proyecto.

La carpeta deploy es la raíz del servidor web del Editor de Wonderland y, por lo tanto, cualquier URL que haga referencia a un activo allí debe especificarse en relación a ella.

Ejemplo: static/my-folder/my-model.glb se copiará en deploy/my-folder/my-model.glb y se puede acceder a través de /my-folder/my-model.glb (si el proyecto se despliega en una ruta raíz en tu servidor web más adelante) o my-folder/my-model.glb.

Carga desde JavaScript 

Usa WonderlandEngine.loadGLTF() para descargar y analizar un glTF/GLB en un PrefabGLTF. Luego instancialo en la escena actual con Scene.instantiate(). Esto proporciona un contenedor estructurado y evita APIs obsoletas.

Ejemplo 

Un componente que carga un archivo .glb y lo escala cuando tu aplicación se lanza puede verse así:

import {Component, Property} from '@wonderlandengine/api';

export class LoadGlbAndScale extends Component {
    static TypeName = 'load-glb-and-scale';

    static Properties = {
        glbFile: Property.string('exampleGLB.glb'),
        scale: Property.float(1.0),
    };

    async start() {
        try {
            const prefab = await this.engine.loadGLTF({file: this.glbFile});
            const {root} = this.engine.scene.instantiate(prefab);
            root.setScalingWorld([this.scale, this.scale, this.scale]);
        } catch (error) {
            console.error('No se pudo cargar el archivo GLB:', error);
        }
    }
}

Cargar Animaciones 

Si tu archivo .glb contiene animaciones, puedes acceder a ellas a través de la jerarquía instanciada y adjuntar un AnimationComponent según sea necesario. Para configuraciones complejas, prefiere crear las animaciones en el editor y empaquetarlas en tu .bin principal, o usa archivos .bin transmisibles para cargarlos cuando sea necesario.