You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardexpand all lines: docs/de/examples/load-models.md
+26-25
Original file line number
Diff line number
Diff line change
@@ -1,24 +1,25 @@
1
-
# Cargar Modelos
1
+
# Modelle laden
2
2
3
-
> Todos los modelos utilizados en esta guía son de[Alvaro Saburido](https://sketchfab.com/3d-models/aku-aku-7dfcb6edf10b4098bbb965c56fd3055c).
3
+
> Alle Modelle, die in dieser Anleitung verwendet werden, stammen von[Alvaro Saburido](https://sketchfab.com/3d-models/aku-aku-7dfcb6edf10b4098bbb965c56fd3055c).
4
4
5
-
Los modelos 3D están disponibles en cientos de formatos de archivo, cada uno con diferentes propósitos, características variadas y complejidad variable.
5
+
3D-Modelle sind in Hunderten von Dateiformaten verfügbar, jedes mit unterschiedlichen Zwecken, variierenden Eigenschaften und Komplexität.
6
6
7
-
Para esta guía, nos vamos a centrar en cargar modelos gLTF (GL Transmission Format), que son el formato más común para modelos 3D en la web.
7
+
In dieser Anleitung konzentrieren wir uns auf das Laden von gLTF-Modellen (GL Transmission Format), dem häufigsten Format für 3D-Modelle im Web.
Es gibt verschiedene Möglichkeiten, Modelle in TresJS zu laden:
12
+
12
13
13
14
::: warning
14
-
Por favor, ten en cuenta que en los ejemplos anteriores utilizamos el await de nivel superior, asegúrate de envolverlo con un componente [Suspense](https://vuejs.org/guide/built-ins/suspense.html#suspense). Consulta Suspense para obtener más información.
15
+
Bitte beachte, dass wir in den vorherigen Beispielen das oberste Level `await` verwendet haben, stelle sicher, dass du es mit einer [Suspense](https://vuejs.org/guide/built-ins/suspense.html#suspense)-Komponente umgibst. Siehe Suspense für mehr Informationen.
15
16
:::
16
17
17
-
## Usando`useLoader`
18
+
## Verwendung von`useLoader`
18
19
19
-
El composable`useLoader`te permite pasar cualquier tipo de cargador de three.js y una URL para cargar el recurso. Devuelve una `Promise`con el recurso cargado.
20
+
Das Composable`useLoader`ermöglicht es dir, jeden Typ von three.js-Loader und eine URL zum Laden der Ressource zu übergeben. Es gibt ein `Promise`mit der geladenen Ressource zurück.
20
21
21
-
Para obtener una explicación detallada de cómo usar `useLoader`, consulta la documentación de[useLoader](/api/composables#useloader).
22
+
Für eine detaillierte Erklärung, wie `useLoader` verwendet wird, siehe die Dokumentation von[useLoader](/api/composables#useloader).
22
23
23
24
```ts
24
25
import { useLoader } from'@tresjs/core'
@@ -27,37 +28,37 @@ import { GLTFLoader } from 'three/addons/loaders/GLTFLoader'
27
28
const { scene } =awaituseLoader(GLTFLoader, '/models/AkuAku.gltf')
28
29
```
29
30
30
-
Luego puedes pasar la escena del modelo a un componente [`primitive`](/advanced/primitive) de TresJS para renderizarlo:
31
+
Dann kannst du die Szene des Modells in einer [`primitive`](/de/advanced/primitive)-Komponente von TresJS übergeben, um es zu rendern:
31
32
32
33
```html{2}
33
34
<TresCanvas>
34
35
<primitive :object="scene" />
35
36
</TresCanvas>
36
37
```
37
38
38
-
> El componente`<primitive />`no es un componente independiente en el código fuente de Tres. En su lugar, es parte de la funcionalidad principal de Tres. Cuando usas`<primitive>`, se traduce a una llamada a`createElement`, que crea el objeto three.js adecuado según la propiedad "object" proporcionada.
39
+
> Die Komponente`<primitive />`ist keine eigenständige Komponente im Quellcode von Tres. Stattdessen ist sie Teil der Kernfunktionalität von Tres. Wenn du`<primitive>` verwendest, wird dies zu einem Aufruf von`createElement`, der das entsprechende three.js-Objekt basierend auf der bereitgestellten "object"-Eigenschaft erstellt.
39
40
40
-
Observa en el ejemplo anterior que estamos utilizando el componente `Suspense` para envolver el componente `TresCanvas`. Esto se debe a que `useLoader`devuelve una `Promise`y necesitamos esperar a que se resuelva antes de renderizar la escena.
41
+
Beachte im obigen Beispiel, dass wir die `Suspense`-Komponente verwenden, um die `TresCanvas`-Komponente zu umgeben. Dies liegt daran, dass `useLoader`ein `Promise`zurückgibt und wir warten müssen, bis es gelöst ist, bevor wir die Szene rendern können.
41
42
42
-
## Usando`useGLTF`
43
+
## Verwendung von`useGLTF`
43
44
44
-
Una forma más conveniente de cargar modelos es utilizando el composable`useGLTF` disponible en el paquete [@tresjs/cientos](https://github.com/Tresjs/tres/tree/main/packages/cientos).
45
+
Eine bequemere Möglichkeit, Modelle zu laden, ist die Verwendung des Composables`useGLTF`, das im Paket [@tresjs/cientos](https://github.com/Tresjs/tres/tree/main/packages/cientos) verfügbar ist.
Una ventaja de usar `useGLTF`es que puedes pasar una propiedad `draco` para habilitar la [compresión Draco](https://threejs.org/docs/index.html?q=drac#examples/en/loaders/DRACOLoader)para el modelo. Esto reducirá el tamaño del modelo y mejorará el rendimiento.
53
+
Ein Vorteil der Verwendung von `useGLTF`ist, dass du eine `draco`-Eigenschaft übergeben kannst, um die [Draco-Kompression](https://threejs.org/docs/index.html?q=drac#examples/en/loaders/DRACOLoader)für das Modell zu aktivieren. Dies wird die Größe des Modells reduzieren und die Leistung verbessern.
<primitive :object="nodes.MyModel" /> // please note that "MyModel" here is just a placeholder
78
+
<primitive :object="nodes.MyModel" /> // please note that "MyModel" here is just a placeholder
78
79
</TresCanvas>
79
80
</template>
80
81
```
81
82
82
-
## Usando`GLTFModel`
83
+
## Verwendung von`GLTFModel`
83
84
84
-
El componente`GLTFModel`es un envoltorio alrededor de `useGLTF` que está disponible en el paquete [@tresjs/cientos](https://github.com/Tresjs/tres/tree/main/packages/cientos).
85
+
Die Komponente`GLTFModel`ist eine Hülle um `useGLTF`, die im Paket [@tresjs/cientos](https://github.com/Tresjs/tres/tree/main/packages/cientos) verfügbar ist.
Este enfoque en particular es más sencillo pero te brinda menos control sobre el modelo.
103
+
Dieser spezielle Ansatz ist einfacher, bietet aber weniger Kontrolle über das Modell.
103
104
104
-
## useFBX
105
+
## Verwendung von `useFBX`
105
106
106
-
El composable`useFBX`está disponible en el paquete [@tresjs/cientos](https://github.com/Tresjs/tres/tree/main/packages/cientos).
107
+
Das Composable`useFBX`ist im Paket [@tresjs/cientos](https://github.com/Tresjs/tres/tree/main/packages/cientos) verfügbar.
107
108
108
109
```ts
109
110
import { useFBX } from'@tresjs/cientos'
110
111
111
112
const model =awaituseFBX('/models/AkuAku.fbx')
112
113
```
113
114
114
-
Entonces, es tan sencillo como agregar la escena a tu escena:
115
+
Dann ist es so einfach wie das Hinzufügen der Szene zu deiner Szene:
115
116
116
117
```html{2}
117
118
<TresCanvas shadows alpha>
118
119
<primitive :object="scene" />
119
120
</TresCanvas>
120
121
```
121
122
122
-
## FBXModel
123
+
## Verwendung von `FBXModel`
123
124
124
-
El componente`FBXModel`es un envoltorio alrededor de `useFBX` que está disponible en el paquete [@tresjs/cientos](https://github.com/Tresjs/tres/tree/main/packages/cientos). Su uso es similar al de`GLTFModel`:
125
+
Die Komponente`FBXModel`ist eine Hülle um `useFBX`, die im Paket [@tresjs/cientos](https://github.com/Tresjs/tres/tree/main/packages/cientos) verfügbar ist. Ihre Verwendung ist ähnlich wie bei`GLTFModel`:
0 commit comments