Compare commits
3 Commits
525abc9512
...
8e65eeb501
| Author | SHA1 | Date | |
|---|---|---|---|
| 8e65eeb501 | |||
| b2dbc415c1 | |||
| 6a3509d623 |
39
examples/global-demo.html
Normal file
39
examples/global-demo.html
Normal file
@ -0,0 +1,39 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="zh-CN">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>SDK 全局挂载加载示例</title>
|
||||
</head>
|
||||
<body>
|
||||
<canvas id="renderDom"></canvas>
|
||||
|
||||
<!-- 非模块化:使用全局构建产物,加载后可通过 window.faceSDK.kernel 调用 -->
|
||||
<!-- 部署后把 src 改成实际访问路径,如 https://doc.zguiy.com/sdk/zt/assets/index.global.js -->
|
||||
<script src="https://sdk.zguiy.com/zt/assets/index.js"></script>
|
||||
<script>
|
||||
const config = {
|
||||
container: 'renderDom',
|
||||
modelUrlList: ['./public/model/model.glb'],
|
||||
env: { hdrPath: '/hdr/my.env', intensity: 1.2, rotationY: 0.3 },
|
||||
onSuccess: () => console.log('SDK initialized (global)'),
|
||||
onError: (err) => console.error('SDK init error', err),
|
||||
};
|
||||
|
||||
function startSdk() {
|
||||
const kernel = window.faceSDK && window.faceSDK.kernel;
|
||||
if (!kernel) {
|
||||
console.error('SDK kernel not loaded');
|
||||
return;
|
||||
}
|
||||
kernel.init(config);
|
||||
}
|
||||
|
||||
if (document.readyState === 'complete') {
|
||||
startSdk();
|
||||
} else {
|
||||
window.addEventListener('load', startSdk);
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
26
examples/module-demo.html
Normal file
26
examples/module-demo.html
Normal file
@ -0,0 +1,26 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="zh-CN">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>SDK 模块化加载示例</title>
|
||||
</head>
|
||||
<body>
|
||||
<canvas id="renderDom"></canvas>
|
||||
|
||||
<!-- 模块化:Dev 使用 /src/main.ts,构建后改为 /assets/index.js -->
|
||||
<script type="module">
|
||||
import { kernel } from 'https://sdk.zguiy.com/zt/assets/index.js';
|
||||
|
||||
const config = {
|
||||
container: 'renderDom',
|
||||
modelUrlList: ['/public/model/model.glb'],
|
||||
env: '/public/model/model.glb',
|
||||
onSuccess: () => console.log('SDK initialized (module)'),
|
||||
onError: (err) => console.error('SDK init error', err),
|
||||
};
|
||||
|
||||
kernel.init(config);
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
5
examples/public/config/animator.json
Normal file
5
examples/public/config/animator.json
Normal file
@ -0,0 +1,5 @@
|
||||
[
|
||||
{}
|
||||
|
||||
|
||||
]
|
||||
BIN
examples/public/favicon.ico
Normal file
BIN
examples/public/favicon.ico
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 15 KiB |
BIN
examples/public/hdr/hdr.env
Normal file
BIN
examples/public/hdr/hdr.env
Normal file
Binary file not shown.
BIN
examples/public/hdr/sanGiuseppeBridge.env
Normal file
BIN
examples/public/hdr/sanGiuseppeBridge.env
Normal file
Binary file not shown.
BIN
examples/public/model/model.glb
Normal file
BIN
examples/public/model/model.glb
Normal file
Binary file not shown.
BIN
examples/public/shuziren.png
Normal file
BIN
examples/public/shuziren.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 65 KiB |
@ -33,6 +33,8 @@
|
||||
};
|
||||
|
||||
kernel.init(config);
|
||||
|
||||
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
@ -9,5 +9,10 @@ export const AppConfig = {
|
||||
container: 'renderDom',
|
||||
modelUrlList: [] as string[],
|
||||
success: null as OptionalCallback,
|
||||
error: null as ErrorCallback
|
||||
error: null as ErrorCallback,
|
||||
env: {
|
||||
hdrPath:"",
|
||||
intensity: 1,
|
||||
rotationY: 0
|
||||
}
|
||||
};
|
||||
|
||||
@ -1,5 +1,6 @@
|
||||
import { CubeTexture } from '@babylonjs/core/Materials/Textures/cubeTexture';
|
||||
import { Monobehiver } from '../base/Monobehiver';
|
||||
import { AppConfig } from './AppConfig';
|
||||
|
||||
/**
|
||||
* 环境管理类- 负责创建和管理HDR环境贴图
|
||||
@ -14,18 +15,26 @@ export class AppEnv extends Monobehiver {
|
||||
|
||||
/** 初始化 - 创建默认HDR环境 */
|
||||
Awake(): void {
|
||||
this.createHDR();
|
||||
this.createHDR(AppConfig.env);
|
||||
}
|
||||
|
||||
/**
|
||||
* 创建HDR环境贴图
|
||||
* @param hdrPath HDR文件路径
|
||||
*/
|
||||
createHDR(hdrPath = '/hdr/sanGiuseppeBridge.env'): void {
|
||||
createHDR(options?: { hdrPath?: string; intensity?: number; rotationY?: number }): void {
|
||||
const hdrPath = options?.hdrPath || AppConfig.env.hdrPath || '/hdr/sanGiuseppeBridge.env';
|
||||
const intensity = options?.intensity ?? AppConfig.env.intensity ?? 1.5;
|
||||
const rotationY = options?.rotationY ?? AppConfig.env.rotationY ?? 0;
|
||||
const scene = this.mainApp.appScene.object;
|
||||
if (!scene) return;
|
||||
if (this.object) {
|
||||
this.object.dispose();
|
||||
this.object = null;
|
||||
}
|
||||
const reflectionTexture = CubeTexture.CreateFromPrefilteredData(hdrPath, scene);
|
||||
scene.environmentIntensity = 1.5;
|
||||
reflectionTexture.rotationY = rotationY;
|
||||
scene.environmentIntensity = intensity;
|
||||
scene.environmentTexture = reflectionTexture;
|
||||
this.object = reflectionTexture;
|
||||
}
|
||||
@ -48,6 +57,13 @@ export class AppEnv extends Monobehiver {
|
||||
if (this.object) this.object.rotationY = angle;
|
||||
}
|
||||
|
||||
/**
|
||||
* 更新环境配置
|
||||
*/
|
||||
updateEnvironment(options: { hdrPath?: string; intensity?: number; rotationY?: number }): void {
|
||||
this.createHDR(options);
|
||||
}
|
||||
|
||||
/** 清理资源 */
|
||||
clean(): void {
|
||||
if (this.object) {
|
||||
|
||||
@ -47,6 +47,7 @@ export class MainApp {
|
||||
AppConfig.modelUrlList = config.modelUrlList || [];
|
||||
AppConfig.success = config.success;
|
||||
AppConfig.error = config.error;
|
||||
AppConfig.env = config.env
|
||||
}
|
||||
|
||||
loadModel(): void {
|
||||
|
||||
21
src/main.ts
21
src/main.ts
@ -1,4 +1,5 @@
|
||||
import { MainApp } from './babylonjs/MainApp';
|
||||
import { AppConfig } from './babylonjs/AppConfig';
|
||||
import configurator, { ConfiguratorParams } from './components/conf';
|
||||
import auth from './components/auth';
|
||||
import { on } from './utils/event';
|
||||
@ -18,6 +19,11 @@ type InitParams = {
|
||||
onSuccess?: () => void;
|
||||
onError?: (error?: unknown) => void;
|
||||
apiConfig?: ConfiguratorParams;
|
||||
envConfig?: {
|
||||
hdrPath?: string;
|
||||
intensity?: number;
|
||||
rotationY?: number;
|
||||
};
|
||||
};
|
||||
|
||||
let mainApp: MainApp | null = null;
|
||||
@ -43,11 +49,24 @@ const kernel = {
|
||||
container: params.container || 'renderDom',
|
||||
modelUrlList: params.modelUrlList || [],
|
||||
success: params.onSuccess ?? null,
|
||||
error: params.onError ?? null
|
||||
error: params.onError ?? null,
|
||||
envConfig: params.envConfig
|
||||
});
|
||||
|
||||
await mainApp.Awake();
|
||||
await mainApp.loadModel();
|
||||
},
|
||||
|
||||
/** 更新环境贴图配置(路径/强度/旋转) */
|
||||
setEnvironment: function (envConfig: { hdrPath?: string; intensity?: number; rotationY?: number }): void {
|
||||
if (!mainApp) {
|
||||
console.warn('mainApp is not initialized yet');
|
||||
return;
|
||||
}
|
||||
if (envConfig) {
|
||||
AppConfig.env = { ...AppConfig.env, ...envConfig };
|
||||
mainApp.appEnv.updateEnvironment(AppConfig.env);
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
|
||||
Reference in New Issue
Block a user