在 h5页面中用js导入 fbx cfg tga MP4 组成一个ar动画

要在h5页面中使用js导入fbx、cfg、tga和MP4文件，需要使用以下步骤：

1. 导入Three.js库，这是一个流行的WebGL库，用于创建3D场景和动画。

2. 使用Three.js中的FBXLoader、MTLLoader和TGALoader等加载器，分别加载fbx、cfg和tga文件。例如：

// 加载fbx文件
var loader = new THREE.FBXLoader();
loader.load( 'model.fbx', function ( object ) {
    scene.add( object );
} );

// 加载cfg文件
var mtlLoader = new THREE.MTLLoader();
mtlLoader.load( 'model.mtl', function ( materials ) {
    materials.preload();
    var objLoader = new THREE.OBJLoader();
    objLoader.setMaterials( materials );
    objLoader.load( 'model.obj', function ( object ) {
        scene.add( object );
    } );
} );

// 加载tga文件
var loader = new THREE.TGALoader();
loader.load( 'texture.tga', function ( texture ) {
    // 使用纹理创建材质
    var material = new THREE.MeshBasicMaterial( { map: texture } );
    // 创建一个立方体网格
    var geometry = new THREE.BoxGeometry( 1, 1, 1 );
    var mesh = new THREE.Mesh( geometry, material );
    scene.add( mesh );
} );

3. 加载MP4文件并将其添加到HTML页面中。例如：

// 创建视频元素
var video = document.createElement('video');
video.src = 'video.mp4';
video.loop = true;
video.autoplay = true;

// 将视频元素添加到HTML页面中
var videoContainer = document.getElementById('video-container');
videoContainer.appendChild(video);

4. 使用Three.js中的CSS3DRenderer创建一个CSS3D对象，并将它添加到场景中。

5. 在CSS3D对象中创建一个DOM元素，并将视频元素添加到该元素中。例如：

// 创建CSS3D对象和DOM元素
var css3DObject = new THREE.CSS3DObject( document.createElement('div') );
var videoElement = document.createElement('video');
videoElement.src = 'video.mp4';
videoElement.loop = true;
videoElement.autoplay = true;
css3DObject.element.appendChild( videoElement );

// 将CSS3D对象添加到场景中
var css3DRenderer = new THREE.CSS3DRenderer();
css3DRenderer.setSize( window.innerWidth, window.innerHeight );
document.body.appendChild( css3DRenderer.domElement );
scene.add( css3DObject );

6. 使用Three.js中的AnimationMixer和Action对象创建动画，并启动它。例如：

// 加载fbx文件
var loader = new THREE.FBXLoader();
loader.load( 'model.fbx', function ( object ) {
    // 创建动画混合器
    var mixer = new THREE.AnimationMixer( object );

    // 获取动作序列
    var action = mixer.clipAction( object.animations[ 0 ] );

    // 启动动画
    action.play();

    // 将模型添加到场景中
    scene.add( object );

    // 更新动画
    function update() {
        requestAnimationFrame( update );
        mixer.update( clock.getDelta() );
    }
    update();
} );

通过以上步骤，就可以在h5页面中使用js导入fbx、cfg、tga和MP4文件，组成一个ar动画。