Passer au contenu principal

Modèles

Introduction

Studio comprend plusieurs primitives intégrées, telles que des sphères, des boîtes et des plans, qui peuvent être rapidement personnalisées et positionnées dans l'éditeur. Pour les conceptions plus complexes, Studio prend en charge les modèles 3D externes aux formats GLTF/GLB, idéaux pour le contenu 3D sur le web, et les fichiers FBX, qui peuvent être convertis en GLB après le téléchargement. Cette configuration permet d'utiliser une large gamme d'éléments 3D, qu'il s'agisse de créer des scènes virtuelles épurées ou très détaillées.

Primitives

Les primitives intégrées suivantes sont disponibles :

TypeAttributs
SphereGeometry{radius}
BoxGeometry{width, height, depth}
PlaneGeometry{width, height}
CapsuleGéométrie{radius, height}
ConeGeometry{radius, height}
CylinderGeometry{radius, height}
PolyhedronGeometry{radius}
CercleGéométrie{radius}
RingGeometry{innerRadius, outerRadius}

Ajouter une primitive

Un modèle 3D peut être ajouté à l'entité via l'interface Studio, par l'intermédiaire du composant Mesh, ou dans le code. Leur ajout dans Studio s'effectue via le bouton (+) de la hiérarchie ou en ajoutant la géométrie à un composant personnalisé sur l'entité.

Exemple

ecs.SphereGeometry.set(world, eid, {radius: 5})

Composante GLTF

Formats pris en charge

GLTF et GLB

Les modèles GLTF et GLB sont pris en charge et sont idéaux pour travailler en 3D sur le web.

FBX

Le téléchargement FBX est pris en charge, mais Niantic Studio exige que les modèles soient convertis en GLB après le téléchargement. **Assurez-vous que les textures sont intégrées dans le fichier FBX avant de le convertir en GLB.

fbx-to-glb-converter.png

Établissement d'un modèle

L'exemple suivant montre comment définir un GLTF ou un GLB sur une entité au moment de l'exécution.

info

Cette méthode exige que vous sélectionniez votre modèle personnalisé dans les propriétés du composant, une fois que le composant est appliqué à votre entité.

import * as ecs from '@8thwall/ecs'

ecs.registerComponent({
name : 'loaded-model',
schema : {
// @asset
model : ecs.string,
},
add : (world, component) => {
ecs.GltfModel.set(world, eid, {
url: component.schema.model,
})
}
})

Définition des propriétés du modèle

Propriétés du modèle

Voir les propriétés ici.

Exemple

L'exemple suivant montre comment définir un modèle sur une entité au moment de l'exécution.

import * as ecs from '@8thwall/ecs'

ecs.registerComponent({
name : 'loaded-model',
schema : {
// @asset
model : ecs.string,
},
add : (world, component) => {
ecs.GltfModel.set(world, eid, {
url : component.schema.model,
animationClip : 'clip1',
loop : true,
paused : false,
time : 0,
timeScale : 1,
})
}
})

Définition des propriétés des matériaux

Les matériaux peuvent être configurés soit par le biais du code, soit directement dans le composant Mesh de l'éditeur.

Types de matériaux

Matériau

Un matériau standard PBR.

Non éclairéMatériel

Le matériau n'est pas affecté par l'éclairage ou les ombres.

Matériau d'ombre

Matériau qui ne réagit qu'aux ombres.

HiderMaterial

Matériau spécialisé qui cache les objets situés derrière lui.

Propriétés des matériaux

Voir les propriétés ici.

Exemple

L'exemple suivant montre comment définir un matériau sur une entité au moment de l'exécution.

// Réglage du matériau standard
ecs.Material.set(world, component.eid, {r : 255, g : 0, b : 100, roughness : 1})

// Réglage du matériau de l'ombre
ecs.ShadowMaterial.set(world, component.eid, {r: 255, g: 0, b: 100})