chore(docs): Update Documentation. (#53)

docs/services/image_to_3d.md

@@ -16,6 +16,16 @@
       noSwipingClass: 'swiper-no-swiping',
       watchSlidesProgress: true,
     });
+    const modelViewers = document.querySelectorAll('model-viewer');
+    let loadedCount = 0;
+    modelViewers.forEach(mv => {
+      mv.addEventListener('load', () => {
+        loadedCount++;
+        if (loadedCount === modelViewers.length) {
+          swiper.update();
+        }
+      });
+    });
   });
 </script>
 

docs/services/text_to_3d.md

@@ -16,6 +16,16 @@
       noSwipingClass: 'swiper-no-swiping',
       watchSlidesProgress: true,
     });
+    const modelViewers = document.querySelectorAll('model-viewer');
+    let loadedCount = 0;
+    modelViewers.forEach(mv => {
+      mv.addEventListener('load', () => {
+        loadedCount++;
+        if (loadedCount === modelViewers.length) {
+          swiper.update();
+        }
+      });
+    });
   });
 </script>
 

docs/services/texture_edit.md

@@ -16,9 +16,20 @@
       noSwipingClass: 'swiper-no-swiping',
       watchSlidesProgress: true,
     });
+    const modelViewers = document.querySelectorAll('model-viewer');
+    let loadedCount = 0;
+    modelViewers.forEach(mv => {
+      mv.addEventListener('load', () => {
+        loadedCount++;
+        if (loadedCount === modelViewers.length) {
+          swiper.update();
+        }
+      });
+    });
   });
 </script>
 
+
 # 🎨 Texture Generation Service
 
 [![🤗 Hugging Face](https://img.shields.io/badge/🤗-Texture_Gen_Demo-blue)](https://huggingface.co/spaces/HorizonRobotics/EmbodiedGen-Texture-Gen)

docs/tutorials/any_simulators.md

@@ -58,6 +58,6 @@ dst_asset_path = cvt_embodiedgen_asset_to_anysim(
 )
 ```
 
-<img src="assets/simulators_collision.jpg" alt="simulators_collision" width="800">
+<img src="/EmbodiedGen/assets/simulators_collision.jpg" alt="simulators_collision" width="800">
 
 Collision and visualization mesh across simulators, showing consistent geometry and material fidelity.

docs/tutorials/digital_twin.md

@@ -1,3 +1,3 @@
 # Real-to-Sim Digital Twin Creation
 
-<img src="assets/real2sim_mujoco.gif" alt="real2sim_mujoco" width="600">
+<img src="/EmbodiedGen/assets/real2sim_mujoco.gif" alt="real2sim_mujoco" width="600">

docs/tutorials/gym_env.md

@@ -14,9 +14,9 @@ python embodied_gen/scripts/parallel_sim.py \
 ```
 
 <div style="display: flex; justify-content: center; align-items: center; gap: 16px; margin: 16px 0;">
-  <img src="assets/parallel_sim.gif" alt="parallel_sim1"
+  <img src="/EmbodiedGen/assets/parallel_sim.gif" alt="parallel_sim1"
        style="width: 330px; max-width: 100%; border-radius: 12px; display: block;">
-  <img src="assets/parallel_sim2.gif" alt="parallel_sim2"
+  <img src="/EmbodiedGen/assets/parallel_sim2.gif" alt="parallel_sim2"
        style="width: 330px; max-width: 100%; border-radius: 12px; display: block;">
 </div>
 

docs/tutorials/image_to_3d.md

@@ -16,6 +16,16 @@
       noSwipingClass: 'swiper-no-swiping',
       watchSlidesProgress: true,
     });
+    const modelViewers = document.querySelectorAll('model-viewer');
+    let loadedCount = 0;
+    modelViewers.forEach(mv => {
+      mv.addEventListener('load', () => {
+        loadedCount++;
+        if (loadedCount === modelViewers.length) {
+          swiper.update();
+        }
+      });
+    });
   });
 </script>
 

docs/tutorials/index.md

@@ -16,9 +16,20 @@
       noSwipingClass: 'swiper-no-swiping',
       watchSlidesProgress: true,
     });
+    const modelViewers = document.querySelectorAll('model-viewer');
+    let loadedCount = 0;
+    modelViewers.forEach(mv => {
+      mv.addEventListener('load', () => {
+        loadedCount++;
+        if (loadedCount === modelViewers.length) {
+          swiper.update();
+        }
+      });
+    });
   });
 </script>
 
+
 # Tutorials & Interface Usage
 
 Welcome to the tutorials for `EmbodiedGen`. `EmbodiedGen` is a powerful toolset for generating 3D assets, textures, scenes, and interactive layouts ready for simulators and digital twin environments.
@@ -150,7 +161,7 @@ Generate **high-quality textures** for 3D meshes using **text prompts**, support
 
 Generate **physically consistent and visually coherent 3D environments** from text prompts. Typically used as **background** 3DGS scenes in simulators for efficient and photo-realistic rendering.
 
-<img src="assets/scene3d.gif" style="width: 500px; max-width: 100%; border-radius: 12px; display: block; margin: 16px auto;">
+<img src="/EmbodiedGen/scene3d.gif" style="width: 500px; max-width: 100%; border-radius: 12px; display: block; margin: 16px auto;">
 
 ---
 
@@ -159,10 +170,10 @@ Generate **physically consistent and visually coherent 3D environments** from te
 Generate diverse, physically realistic, and scalable **interactive 3D scenes** from natural language task descriptions, while also modeling the robot and manipulable objects.
 
 <div align="center" style="display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; justify-items: center; margin: 20px 0;">
-  <img src="assets/layout1.gif" alt="layout1" style="width: 400px; border-radius: 12px; display: block;">
+  <img src="/EmbodiedGen/layout1.gif" alt="layout1" style="width: 400px; border-radius: 12px; display: block;">
-  <img src="assets/layout2.gif" alt="layout2" style="width: 400px; border-radius: 12px; display: block;">
+  <img src="/EmbodiedGen/layout2.gif" alt="layout2" style="width: 400px; border-radius: 12px; display: block;">
-  <img src="assets/layout3.gif" alt="layout3" style="width: 400px; border-radius: 12px; display: block;">
+  <img src="/EmbodiedGen/layout3.gif" alt="layout3" style="width: 400px; border-radius: 12px; display: block;">
-  <img src="assets/Iscene_demo2.gif" alt="layout4" style="width: 400px; border-radius: 12px; display: block;">
+  <img src="/EmbodiedGen/Iscene_demo2.gif" alt="layout4" style="width: 400px; border-radius: 12px; display: block;">
 </div>
 
 
@@ -173,9 +184,9 @@ Generate diverse, physically realistic, and scalable **interactive 3D scenes** f
 Generate multiple **parallel simulation environments** with `gym.make` and record sensor and trajectory data.
 
 <div style="display: flex; justify-content: center; align-items: center; gap: 16px; margin: 16px 0;">
-  <img src="assets/parallel_sim.gif" alt="parallel_sim1"
+  <img src="/EmbodiedGen/parallel_sim.gif" alt="parallel_sim1"
        style="width: 330px; max-width: 100%; border-radius: 12px; display: block;">
-  <img src="assets/parallel_sim2.gif" alt="parallel_sim2"
+  <img src="/EmbodiedGen/parallel_sim2.gif" alt="parallel_sim2"
        style="width: 330px; max-width: 100%; border-radius: 12px; display: block;">
 </div>
 
@@ -187,11 +198,11 @@ Generate multiple **parallel simulation environments** with `gym.make` and recor
 Seamlessly use EmbodiedGen-generated assets in major simulators like **IsaacSim**, **MuJoCo**, **Genesis**, **PyBullet**, **IsaacGym**, and **SAPIEN**, featuring **accurate physical collisions** and **consistent visual appearance**.
 
 <div align="center">
-  <img src="assets/simulators_collision.jpg" alt="simulators_collision" style="width: 400px; max-width: 100%; border-radius: 12px; display: block; margin: 16px 0;">
+  <img src="/EmbodiedGen/simulators_collision.jpg" alt="simulators_collision" style="width: 400px; max-width: 100%; border-radius: 12px; display: block; margin: 16px 0;">
 </div>
 
 ## [🔧 Real-to-Sim Digital Twin Creation](digital_twin.md)
 
 <div align="center">
-  <img src="assets/real2sim_mujoco.gif" alt="real2sim_mujoco" style="width: 400px; max-width: 100%; border-radius: 12px; display: block; margin: 16px 0;">
+  <img src="/EmbodiedGen/real2sim_mujoco.gif" alt="real2sim_mujoco" style="width: 400px; max-width: 100%; border-radius: 12px; display: block; margin: 16px 0;">
 </div>

docs/tutorials/layout_gen.md

@@ -3,10 +3,10 @@
 Layout Generation enables the generation of diverse, physically realistic, and scalable **interactive 3D scenes** directly from natural language task descriptions, while also modeling the robot's pose and relationships with manipulable objects. Target objects are randomly placed within the robot's reachable range, making the scenes readily usable for downstream simulation and reinforcement learning tasks in any mainstream simulator.
 
 <div align="center" style="display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; justify-items: center; margin: 20px 0;">
-  <img src="assets/layout1.gif" alt="layout1" style="width: 400px; border-radius: 12px; display: block;">
+  <img src="/EmbodiedGen/assets/layout1.gif" alt="layout1" style="width: 400px; border-radius: 12px; display: block;">
-  <img src="assets/layout2.gif" alt="layout2" style="width: 400px; border-radius: 12px; display: block;">
+  <img src="/EmbodiedGen/assets/layout2.gif" alt="layout2" style="width: 400px; border-radius: 12px; display: block;">
-  <img src="assets/layout3.gif" alt="layout3" style="width: 400px; border-radius: 12px; display: block;">
+  <img src="/EmbodiedGen/assets/layout3.gif" alt="layout3" style="width: 400px; border-radius: 12px; display: block;">
-  <img src="assets/Iscene_demo2.gif" alt="layout4" style="width: 400px; border-radius: 12px; display: block;">
+  <img src="/EmbodiedGen/assets/Iscene_demo2.gif" alt="layout4" style="width: 400px; border-radius: 12px; display: block;">
 </div>
 
 !!! note "Model Requirement"
@@ -44,8 +44,8 @@ layout-cli \
 
 You will get the following results:
 <div align="center" style="display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; justify-items: center; margin: 20px 0;">
-  <img src="assets/Iscene_demo1.gif" alt="Iscene_demo1" style="width: 320px; border-radius: 12px; display: block;">
+  <img src="/EmbodiedGen/assets/Iscene_demo1.gif" alt="Iscene_demo1" style="width: 240px; border-radius: 12px; display: block;">
-  <img src="assets/Iscene_demo2.gif" alt="Iscene_demo2" style="width: 320px; border-radius: 12px; display: block;">
+  <img src="/EmbodiedGen/assets/Iscene_demo2.gif" alt="Iscene_demo2" style="width: 480px; border-radius: 12px; display: block;">
 </div>
 
 

docs/tutorials/scene_gen.md

@@ -4,7 +4,7 @@ Generate **physically consistent and visually coherent 3D environments** from te
 
 ---
 
-<img src="assets/scene3d.gif" style="width: 600px; border-radius: 12px; display: block; margin: 16px auto;">
+<img src="/EmbodiedGen/assets/scene3d.gif" style="width: 600px; border-radius: 12px; display: block; margin: 16px auto;">
 
 ---
 

docs/tutorials/text_to_3d.md

@@ -16,6 +16,16 @@
       noSwipingClass: 'swiper-no-swiping',
       watchSlidesProgress: true,
     });
+    const modelViewers = document.querySelectorAll('model-viewer');
+    let loadedCount = 0;
+    modelViewers.forEach(mv => {
+      mv.addEventListener('load', () => {
+        loadedCount++;
+        if (loadedCount === modelViewers.length) {
+          swiper.update();
+        }
+      });
+    });
   });
 </script>
 

docs/tutorials/texture_edit.md

@@ -16,9 +16,20 @@
       noSwipingClass: 'swiper-no-swiping',
       watchSlidesProgress: true,
     });
+    const modelViewers = document.querySelectorAll('model-viewer');
+    let loadedCount = 0;
+    modelViewers.forEach(mv => {
+      mv.addEventListener('load', () => {
+        loadedCount++;
+        if (loadedCount === modelViewers.length) {
+          swiper.update();
+        }
+      });
+    });
   });
 </script>
 
+
 # 🎨 Texture Generation: Create Visually Rich Textures for 3D Meshes
 
 Generate **high-quality textures** for 3D meshes using **text prompts**, supporting both **Chinese and English**. This allows you to enhance the visual appearance of existing 3D assets for simulation, visualization, or digital twin applications.