2.4 KiB
2.4 KiB
3D模型展示SDK - 纯JavaScript版
基于 BabylonJS 的轻量模型展示 SDK,支持加载 GLB/GLTF、播放动画、控制相机/灯光,并附带截图、录制与 ARKit 调试能力。数字人和翻译/字幕相关逻辑已移除,仅保留通用的模型展示能力。
项目结构
index.html:开发示例页(直接引用src/main.ts)dist/test.html:构建后的示例页(引用dist/assets/index.js)src/main.ts:SDK 对外入口,挂载到window.faceSDK.kernelsrc/babylonjs、src/managers:引擎、场景、动画等核心模块
快速开始
- 安装依赖:
npm install - 启动本地预览(任选其一):
npm run dev- 或
python -m http.server 8080后访问http://localhost:8080
- 打开
index.html(开发)或dist/test.html(构建产物)查看示例控制面板。
初始化示例
await faceSDK.kernel.init({
container: 'renderDom',
modelUrlList: [
'/1104_01_Exp/head_a01/head_a01.gltf',
'/1104_01_Exp/shoes_e01/shoes_e01.gltf',
'/1104_01_Exp/bottom_a01/bottom_a01.gltf',
'/1104_01_Exp/hair_a01/hair_a01.gltf',
'/1104_01_Exp/top_f01/top_f01.gltf'
],
animationUrlList: ['/idle/G001@Idle.glb'],
apiConfig: { name: '你的用户名', readLocalResource: true },
enableExpression: false,
onSuccess: () => console.log('加载完成'),
onError: (err) => console.error('加载失败', err)
});
常用 API
playAnimation(url)/stopAnimation():加载并播放/停止动画setAnimationSpeed(speed):调整播放速度setCameraPreset('full' | 'head' | 'upper')/resetCamera():相机预设与重置setLightIntensity(value)、setHDRIntensity(value)、rotateHDR(angle)、loadHDR(path):灯光与环境控制captureScreenshot(type, quality)/downloadScreenshot(filename, type, quality):截图startRecording(options)/stopRecording()/downloadRecording(filename):录屏enableARKit()、showARKitPanel()、connectARKitServer(url):ARKit 表情调试(可选)
更多接口可查看 src/main.ts 注释。
示例控制面板
- 动画 URL:输入 GLB/GLTF 动画地址并播放
- 播放速度:0.5x - 3x
- 相机预设:全身 / 头部 / 上半身 / 重置
- 灯光强度:调整场景亮度
- ARKit 调试:连接、显示面板、断开(需要本地 ARKit 数据)
许可证
MIT License