Files
zhengte.babylonjs-sdk/index.html
2026-03-11 11:56:46 +08:00

90 lines
1.9 KiB
HTML

<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>3D模型展示SDK - TS版</title>
<style>
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
body {
font-family: Arial, sans-serif;
overflow: hidden;
background: linear-gradient(135deg, #1a1a2e 0%, #16213e 100%);
}
#app {
width: 100vw;
height: 100vh;
position: relative;
}
#renderDom {
width: 100%;
height: 100%;
display: block;
}
</style>
</head>
<body>
<div id="app">
<canvas id="renderDom"></canvas>
</div>
<script type="module">
import { kernel } from './src/main.ts';
// import { kernel } from 'https://sdk.zguiy.com/zt/assets/index.js';
const config = {
container: document.querySelector('#renderDom'),
modelUrlList: ['https://sdk.zguiy.com/resurces/model/model.glb'],
env: { envPath: 'https://sdk.zguiy.com/resurces/hdr/hdr.env', intensity: 1.2, rotationY: 0.3, background: false },
};
kernel.init(config);
kernel.on('model:load:progress', (data) => {
console.log('模型加载事件', data);
});
kernel.on('model:loaded', (data) => {
console.log('模型加载完成', data);
});
kernel.on('all:ready', (data) => {
console.log('所有模块加载完成', data);
kernel.material.apply({
target: 'Material__2',
attribute: 'alpha',
value: 0.5,
});
});
kernel.on('model:click', (data) => {
console.log('模型点击事件', data);
});
</script>
</body>
</html>