1

examples/module-demo.html

@@ -363,9 +363,9 @@
         </div>
     </div>
 
-    <script type="module" src="./index.js"></script>
+    <script type="module" src="./module-demo.js"></script>
     <script type="module">
-     import { kernel } from './index copy.js';
+     import { kernel } from './index.js';
 
 
         // ========== UI 交互逻辑 ==========

examples/module-demo.js

@@ -0,0 +1,120 @@
+import { kernel } from './index.js';
+
+// import { kernel } from 'https://sdk.zguiy.com/zt/assets/index.js';
+
+// const config = {
+//     container: document.querySelector('#renderDom'),
+//     modelUrlList: ['/assets/model.glb'],
+//     env: { envPath: '/assets/hdr.env', intensity: 1.2, rotationY: 0.3, background: false },
+// };
+
+const config = {
+    container: document.querySelector('#renderDom'),
+    modelUrlList: [],
+    env: { envPath: 'https://sdk.zguiy.com/resurces/hdr/hdr.env', intensity: 1.2, rotationY: 0.3, background: true },
+};
+
+kernel.init(config);
+kernel.model.add("卷帘大", "https://sdk.zguiy.com/resurces/model/框架.glb")
+kernel.model.add("卷帘大", "https://sdk.zguiy.com/resurces/model/卷帘大.glb")
+kernel.model.add("卷帘小", "https://sdk.zguiy.com/resurces/model/卷帘小.glb")
+kernel.model.add("小桌", "https://sdk.zguiy.com/resurces/model/小桌.glb")
+
+kernel.on('model:load:progress', (data) => {
+    console.log('模型加载事件', data);
+});
+
+
+
+kernel.on('model:loaded', (data) => {
+    console.log('模型加载完成', data);
+    // 隐藏进度条
+    const progressContainer = document.getElementById('progress-container');
+    if (progressContainer) {
+        progressContainer.style.display = 'none';
+    }
+});
+
+kernel.on('all:ready', (data) => {
+    console.log('所有模块加载完,', data);
+    kernel.material.apply({
+        target: 'Material__2',
+        attribute: 'alpha',
+        value: 0.5,
+    });
+    kernel.hotspot.render([
+        {
+            id: "h1",
+            type: 'hotspot',
+            name: "卷帘门",
+            meshName: "Valve_01",
+            icon: "https://bpic.588ku.com/element_pic/20/06/30/d1046b01afc0b9586844350d131f4daf.jpg!/fw/253/quality/90/unsharp/true/compress/true",
+            offset: [25, 25, 0],
+            radius: 20,
+            color: "#21c7ff",
+            payload: { type: "valve", code: "A" },
+        },
+    ]);
+});
+
+
+// 存储当前选中的材质名和网格
+let currentMaterialName = '';
+let currentPickedMesh = null;
+
+kernel.on('model:click', (data) => {
+    console.log('模型点击事件', data);
+    console.log(data);
+
+    // DOM 2D转3D 示例：点击模型时显示信息框
+    if (data.pickedMesh && data.pickedPoint) {
+        const meshName = data.pickedMesh.name;
+        const position = data.pickedPoint; // 使用点击位置的坐标
+        currentMaterialName = data.materialName || ''; // 保存材质名
+        currentPickedMesh = data.pickedMesh; // 保存网格对象
+
+        console.log('点击位置的3D坐标:', position);
+        console.log('材质名:', currentMaterialName);
+
+        // 获取已创建的DOM元素
+        const infoDiv = document.getElementById('model-info-box');
+
+        // 更新信息内容
+        document.getElementById('info-name').textContent = `名称: ${meshName}`;
+        document.getElementById('info-position').textContent = `坐标: [${position.x.toFixed(2)}, ${position.y.toFixed(2)}, ${position.z.toFixed(2)}]`;
+
+        // 将DOM附加到点击的3D坐标（会自动显示）
+        kernel.domTo3D.attach('model-info', infoDiv, [position.x, position.y, position.z], { x: -2, y: -2 });
+    }
+});
+
+// 暴露到全局，供 index.html 使用
+window.getCurrentMaterialName = () => currentMaterialName;
+window.getCurrentPickedMesh = () => currentPickedMesh;
+
+// 暴露 kernel 到全局，方便调试
+
+
+kernel.on('hotspot:click', (data) => {
+    console.log('热点被点击:', data);
+    const { id, name } = data
+    if (name === "卷帘门") {
+        kernel.door.toggle({ upY: 28, downY: 0, speed: 12 });
+
+        // Y轴剖切，只作用于卷帘门网格，保留下方，剖掉上方
+        const clipHeight = 28; // 调整这个值找到合适的剖切高度
+        console.log('设置剖切:', clipHeight);
+        kernel.clipping.setY(clipHeight, true, ['Box005.001', 'Box006.001']);
+    }
+});
+
+window.kernel = kernel;
+// 添加模型到场景
+// await kernel.model.add('https://sdk.zguiy.com/resurces/model/百叶1.glb');
+
+// 销毁模型
+// kernel.model.destroy('car');
+
+// 替换模型
+// await kernel.model.replace('car', '/models/new-car.glb');
+