bc-model-viewer 1.7.14 → 1.7.17

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "bc-model-viewer",
-  "version": "1.7.14",
+  "version": "1.7.17",
   "main": "./dist/bc-model-viewer.min.js",
   "module": "./dist/bc-model-viewer.min.js",
   "description": "A model viewer",

package/examples/ScenePageDemo.vue

@@ -1,246 +0,0 @@
-<template>
-  <div class="scene-page-demo">
-    <div id="container"></div>
-    <div class="control-panel">
-      <h2>场景页面管理器演示</h2>
-      <div class="scene-buttons" id="modelScenesContainer">
-        <button
-          v-for="(scene, index) in modelScenes"
-          :key="scene.name"
-          @click="activateScene(scene)"
-        >
-          场景 {{ index + 1 }}: {{ scene.name }}
-        </button>
-        <p v-if="modelScenes.length === 0">模型中未发现场景</p>
-      </div>
-      <div
-        id="sceneInfo"
-        style="margin-top: 15px; padding: 10px; background-color: #f5f5f5; border-radius: 4px; max-height: 200px; overflow-y: auto;"
-        v-html="sceneInfoHtml"
-      ></div>
-      <div>
-        <label>
-          <input type="checkbox" v-model="enableTransition" checked>
-          启用过渡动画
-        </label>
-      </div>
-      <div class="current-scene">
-        当前场景: <span>{{ currentSceneName || '未设置' }}</span>
-      </div>
-      <div class="info">
-        点击按钮切换到不同预设场景，每个场景包含不同的相机位置、目标点和可能的图层可见性设置。
-      </div>
-    </div>
-  </div>
-</template>
-
-<script setup>
-import { ref, onMounted, onBeforeUnmount } from 'vue';
-import { Viewer } from '../../index.ts';
-
-// 响应式数据
-const viewer = ref(null);
-const modelScenes = ref([]);
-const sceneInfoHtml = ref('场景信息将在这里显示');
-const enableTransition = ref(true);
-const currentSceneName = ref('未设置');
-
-// 激活场景
-async function activateScene(scene) {
-  if (!viewer.value) return;
-  
-  try {
-    const success = await viewer.value.scenePageManager.activateSceneByName(
-      scene.name,
-      enableTransition.value
-    );
-    
-    if (success) {
-      updateCurrentSceneDisplay();
-      displaySceneDetails(scene);
-    } else {
-      alert(`切换到场景 "${scene.name}" 失败`);
-    }
-  } catch (error) {
-    console.error('切换场景失败:', error);
-    alert(`切换到场景 "${scene.name}" 时发生错误`);
-  }
-}
-
-// 显示场景详细信息
-function displaySceneDetails(scene) {
-  let infoHtml = `<strong>场景名称:</strong> ${scene.name}<br>`;
-  infoHtml += `<strong>激活状态:</strong> ${scene.active}<br>`;
-  infoHtml += `<strong>透视模式:</strong> ${scene.camera?.perspective ? '透视' : '正交'}<br>`;
-
-  if (scene.camera) {
-    infoHtml += `<strong>相机位置:</strong> [${scene.camera.position?.join(', ')}]<br>`;
-    infoHtml += `<strong>目标位置:</strong> [${scene.camera.target?.join(', ')}]<br>`;
-    if (scene.camera.fov) {
-      infoHtml += `<strong>视场角:</strong> ${scene.camera.fov}°<br>`;
-    }
-  }
-
-  if (scene.hidden_layers && scene.hidden_layers.length > 0) {
-    infoHtml += `<strong>隐藏的图层:</strong> ${scene.hidden_layers.join(', ')}<br>`;
-  }
-
-  if (scene.hidden_layers_index && scene.hidden_layers_index.length > 0) {
-    infoHtml += `<strong>隐藏的图层索引:</strong> ${scene.hidden_layers_index.join(', ')}<br>`;
-  }
-
-  if (scene.hidden_entities && scene.hidden_entities.length > 0) {
-    infoHtml += `<strong>隐藏的实体数量:</strong> ${scene.hidden_entities.length}<br>`;
-  }
-
-  sceneInfoHtml.value = infoHtml;
-}
-
-// 更新当前场景显示
-function updateCurrentSceneDisplay() {
-  if (!viewer.value) return;
-  currentSceneName.value = viewer.value.scenePageManager.getCurrentSceneName() || '未设置';
-}
-
-// 辅助函数：获取模型中的场景信息
-function getModelScenes() {
-  return viewer.value?.scenePageManager.pages || [];
-}
-
-// 辅助函数：获取特定场景
-function getSceneByName(name) {
-  return viewer.value?.scenePageManager.pages.find(page => page.name === name);
-}
-
-// 加载并显示模型中的场景
-function loadAndDisplayModelScenes() {
-  if (!viewer.value) return;
-
-  // 获取模型中的所有场景
-  modelScenes.value = viewer.value.scenePageManager.pages || [];
-
-  if (modelScenes.value.length > 0) {
-    // 显示第一个场景的详细信息
-    displaySceneDetails(modelScenes.value[0]);
-    updateCurrentSceneDisplay();
-  } else {
-    sceneInfoHtml.value = '未发现场景信息';
-  }
-
-  console.log('已加载并显示模型中的所有场景');
-}
-
-onMounted(async () => {
-  try {
-    // 创建Viewer实例
-    const container = document.getElementById('container');
-    viewer.value = new Viewer(container, {
-      load: {
-        cache: {
-          enabled: false
-        }
-      },
-      camera: {
-        orbitBehavior: 'free'
-      }
-    });
-
-    // 加载测试模型
-    await viewer.value.loadZipAsync('../../../assets/dgz/49F酒店室内.dgz');
-    console.log('模型加载成功');
-
-    // 模型加载完成后，检查是否有内置场景
-    console.log('模型中的场景:', viewer.value.scenePageManager.pages);
-    console.log('场景数量:', viewer.value.scenePageManager.pages.length);
-
-    // 自动加载模型中的场景
-    loadAndDisplayModelScenes();
-
-    // 暴露viewer和辅助函数到全局以便调试
-    window.viewer = viewer.value;
-    window.getModelScenes = getModelScenes;
-    window.getSceneByName = getSceneByName;
-    window.loadAndDisplayModelScenes = loadAndDisplayModelScenes;
-
-    console.log('场景页面管理器演示已加载');
-    console.log('可用场景:', viewer.value.scenePageManager.getAllSceneNames());
-    console.log('模型中的场景详情:', viewer.value.scenePageManager.pages);
-  } catch (error) {
-    console.error('初始化失败:', error);
-    alert('模型加载失败，请确保模型文件路径正确');
-  }
-});
-
-onBeforeUnmount(() => {
-  // 清理资源
-  if (viewer.value) {
-    // 根据Viewer类的API进行适当的清理
-    // viewer.value.dispose();
-  }
-});
-</script>
-
-<style scoped>
-.scene-page-demo {
-  position: relative;
-  width: 100vw;
-  height: 100vh;
-}
-
-#container {
-  width: 100%;
-  height: 100%;
-}
-
-.control-panel {
-  position: absolute;
-  top: 20px;
-  left: 20px;
-  z-index: 100;
-  background-color: rgba(255, 255, 255, 0.9);
-  padding: 20px;
-  border-radius: 8px;
-  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
-  max-width: 300px;
-  font-family: Arial, sans-serif;
-}
-
-h2 {
-  margin-top: 0;
-  color: #333;
-  font-size: 18px;
-}
-
-.scene-buttons {
-  display: flex;
-  flex-direction: column;
-  gap: 10px;
-  margin-bottom: 20px;
-}
-
-button {
-  padding: 8px 16px;
-  background-color: #4CAF50;
-  color: white;
-  border: none;
-  border-radius: 4px;
-  cursor: pointer;
-  transition: background-color 0.3s;
-}
-
-button:hover {
-  background-color: #45a049;
-}
-
-.current-scene {
-  margin-top: 15px;
-  font-weight: bold;
-  color: #2c3e50;
-}
-
-.info {
-  font-size: 12px;
-  color: #666;
-  margin-top: 15px;
-}
-</style>

package/examples/ScenePageDemoVue.html

@@ -1,22 +0,0 @@
-<!DOCTYPE html>
-<html lang="zh-CN">
-
-<head>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>场景页面管理器演示 - Vue版本</title>
-    <script src="https://unpkg.com/vue@3/dist/vue.global.js"></script>
-</head>
-
-<body>
-    <div id="app"></div>
-
-    <script type="module">
-        import ScenePageDemo from './ScenePageDemo.vue';
-
-        const app = Vue.createApp(ScenePageDemo);
-        app.mount('#app');
-    </script>
-</body>
-
-</html>