Differences

This shows you the differences between two versions of the page.

--- informatica:linux:tour360 [2024/03/09 12:39] – jose
+++ informatica:linux:tour360 [2024/03/09 15:51] – jose
@@ Line 108: / Line 108: @@
 ====== Añadir nuevas fotos sin Marzipano tool ======
+Hay que hacer 3 pasos:
+<code>
+. Convertir foto en directorios y copiar en directorio tiles
+. Modificar data.js
+. Modificar index.html
+</code>
 Descargamos la foto en formato rectangular. Por ejemplo si la tenemos subida a kuula y la editamos, abajo a la derecha está la opción download
@@ Line 266: / Line 272: @@
 Copiamos el directorio dentro de la instalación de marzipano en el directorio tiles
+Por ejemplo si hemos añadido planta2_01 se suele poner el ID: 3-planta2_01 para tenerlos ordenados.
+El directorio tiles nos quedaría mas o menos así
+<code>
+└── tiles
+    ├── 0-portalon_01
+    ├── 1-portalon_02
+    ├── 2-patio_01
+    └── 3-planta2_01
+</code>
+Modificamos el fichero data.js añadiendo otra entrada al vector json de Scenes. Podemos copiar otro tal cual y después ir cambiando los parámetros, solo tenemos que cambiar ID para que coincida con el que tenemos:
+<code>
+    {
+      "id": "3-planta2_01",
+      "name": "planta2_01",
+      "levels": [
+        {
+          "tileSize": 256,
+          "size": 256,
+          "fallbackOnly": true
+        },
+        {
+          "tileSize": 512,
+          "size": 512
+        },
+        {
+          "tileSize": 512,
+          "size": 1024
+        },
+        {
+          "tileSize": 512,
+          "size": 2048
+        }
+      ],
+      "faceSize": 1368,
+      "initialViewParameters": {
+        "pitch": 0,
+        "yaw": 0,
+        "fov": 1.5707963267948966
+      },
+      "linkHotspots": [],
+      "infoHotspots": []
+    }
+</code>
+Y por último tenemos que añadir el DIV en el fichero index.html:
+<code>
+<div id="sceneList">
+  <ul class="scenes">
+      <a href="javascript:void(0)" class="scene" data-id="0-portalon_01">
+        <li class="text">portalon_01</li>
+      </a>
+      <a href="javascript:void(0)" class="scene" data-id="1-portalon_02">
+        <li class="text">portalon_02</li>
+      </a>
+      <a href="javascript:void(0)" class="scene" data-id="2-patio_01">
+        <li class="text">patio_01</li>
+      </a>
+      <a href="javascript:void(0)" class="scene" data-id="3-planta2_01">
+        <li class="text">planta2_01</li>
+      </a>
+  </ul>
+</div>
+</code>