---

1. 引言：高級幾何體的應用場景

• 核心價值：

  • 突破基礎幾何體限制，創建復雜模型（如建筑結構、有機生物、工業零件）。

• 案例對比：

  • 基礎幾何體：僅能表現簡單形狀（立方體/球體），缺乏細節。
  • 高級幾何體：通過參數化建模生成齒輪、地形、管道等專業模型。

---

2. 參數化建模：Babylon.MeshBuilder

2.1 擴展幾何體類型

• 內置復雜幾何體：

  // 創建十二面體
  const dodecahedron = BABYLON.MeshBuilder.CreatePolyhedron("dodeca", { type: 2, size: 2 }, // type 2 對應十二面體scene
  );
  

  

  // 創建圓環結（Torus Knot）
  const torusKnot = BABYLON.MeshBuilder.CreateTorusKnot("knot", // 網格的名稱0.5, // 設置圓環結的全局半徑大小0.2, // 設置圓環管的直徑大小128, // 設置每個管段上的邊數64, // 設置要將結分解為的管的數量2: // X軸上的匝數3: // Y軸上的匝數scene
  );
  

  

2.2 自定義多邊形（ExtrudePolygon）

• 生成2D形狀拉伸的3D模型

  // Poteau Gauche
  const pts_pg = [new BABYLON.Vector3(0, 0, 0), new BABYLON.Vector3(100, 0, 0),   new BABYLON.Vector3(100, 0, 100), new BABYLON.Vector3(0, 0, 100), ]
  const poteau_gauche = BABYLON.MeshBuilder.ExtrudePolygon("poteau_gauche",{shape: pts_pg,depth: 1100}
  )
  

  

---

3. 頂點級建模：自定義VertexData

3.1 手動定義頂點數據

• 步驟：
  定義頂點位置（positions）
  定義頂點索引（indices）
  可選：法線（normals）、UV坐標（uvs）
• 代碼示例：創建三角錐：

  const customMesh = new BABYLON.Mesh("custom", scene);
  const vertexData = new BABYLON.VertexData();// 頂點坐標（4個點：底面3個，頂點1個）
  vertexData.positions = [0, 0, 0,   // 底面點11, 0, 0,   // 底面點20.5, 0, 1, // 底面點30.5, 1, 0.5 // 頂點
  ];// 三角形面索引（4個面：底面+3個側面）
  vertexData.indices = [0, 1, 2,   // 底面0, 1, 3,   // 側面11, 2, 3,   // 側面22, 0, 3    // 側面3
  ];// 計算法線（否則光照異常）
  BABYLON.VertexData.ComputeNormals(vertexData.positions, vertexData.indices, vertexData.normals);vertexData.applyToMesh(customMesh);
  

3.2 動態生成地形（高度圖）

• 基于噪聲函數生成起伏地形：

  const size = 100;
  const subdivisions = 50;
  const terrain = BABYLON.MeshBuilder.CreateGround("terrain", { width: size, height: size, subdivisions: subdivisions },scene
  );// 修改頂點Y坐標
  const positions = terrain.getVerticesData(BABYLON.VertexBuffer.PositionKind);
  for (let i = 0; i < positions.length; i += 3) {const x = positions[i];const z = positions[i + 2];positions[i + 1] = 5 * Math.sin(x * 0.2) * Math.cos(z * 0.2); // 噪聲函數
  }
  terrain.updateVerticesData(BABYLON.VertexBuffer.PositionKind, positions);
  

---

4. 幾何體變形與動態更新

4.1 實時頂點動畫（波浪效果）

• 代碼：

  scene.registerBeforeRender(() => {const time = performance.now() / 1000;const positions = plane.getVerticesData(BABYLON.VertexBuffer.PositionKind);for (let i = 0; i < positions.length; i += 3) {const x = positions[i];const z = positions[i + 2];positions[i + 1] = Math.sin(x + time) * Math.cos(z + time);}plane.updateVerticesData(BABYLON.VertexBuffer.PositionKind, positions);
  });
  

4.2 幾何體布爾運算（差集/并集）

• 使用CSG（Constructive Solid Geometry）：

  const box = BABYLON.MeshBuilder.CreateBox("box", { size: 2 }, scene);
  const sphere = BABYLON.MeshBuilder.CreateSphere("sphere", { diameter: 2 }, scene);
  sphere.position.x = 1;// 轉換為CSG對象
  const boxCSG = BABYLON.CSG.FromMesh(box);
  const sphereCSG = BABYLON.CSG.FromMesh(sphere);// 布爾運算（差集：立方體減去球體）
  const resultCSG = boxCSG.subtract(sphereCSG);
  const resultMesh = resultCSG.toMesh("result", null, scene);
  box.dispose();
  sphere.dispose();
  

---

5. 實戰任務

任務1：生成參數化齒輪

• 目標：
• 代碼要點：

  function createGear(teeth: number, radius: number) {const points = [];for (let i = 0; i < teeth * 2; i++) {const angle = (i / (teeth * 2)) * Math.PI * 2;const r = i % 2 === 0 ? radius : radius * 0.8; // 交替半徑生成齒槽points.push(new BABYLON.Vector3(r * Math.cos(angle), 0, r * Math.sin(angle)));}return BABYLON.MeshBuilder.ExtrudePolygon("gear", { shape: points, depth: 0.5 },scene);
  }
  const gear = createGear(16, 3); // 16齒，半徑3
  

任務2：動態生長的植物

• 目標：
• 實現步驟：
  1. 使用L-System算法生成分支結構。
  2. 通過頂點數據構建圓柱體分支。
  3. 添加生長動畫（逐幀增加分支長度）。

---

6. 性能優化與調試

6.1 優化策略

• 合并網格（MergeMeshes）：減少Draw Call。

  const merged = BABYLON.Mesh.MergeMeshes([mesh1, mesh2], true); // 第二個參數啟用材質合并
  

• 簡化復雜網格：使用simplify()方法降低面數。

  const simplified = BABYLON.SimplificationStrategy.QUADRATIC(mesh);
  mesh.simplify([{ distance: 100, quality: 0.8 }]); // 根據距離簡化
  

6.2 調試工具

• 顯示頂點法線

  BABYLON.Debug.AxesViewer(scene, 1); // 顯示坐標系
  const normalsViewer = new BABYLON.Debug.NormalsViewer(mesh, scene); // 顯示法線
  

---

7. 總結與擴展

• 核心技能：參數化建模、頂點操作、布爾運算、動態幾何更新。
• 擴展方向：
  • GPU加速生成：通過Compute Shader實時生成幾何體。
  • 程序化城市生成：結合噪聲函數和規則系統。
  • 三維掃描重建：從點云數據生成網格。

---

通過本指南，開發者可掌握從基礎擴展幾何體到專業級程序化建模的全套技能，滿足工業設計、游戲開發等領域的復雜需求。