Three.js création de texte (Création de texte)

1.DOM + CSS

L'utilisation de HTML est généralement le moyen le plus simple et le plus rapide d'ajouter du texte, et c'est la méthode utilisée pour ajouter des superpositions descriptives dans la plupart des exemples Three.js.

<div id="info">Description</div>

Ensuite, utilisez CSS pour le positionner absolument au-dessus des autres éléments avec un z-index, surtout si vous exécutez three.js en plein écran.

#info {
	position: absolute;
	top: 10px;
	width: 100%;
	text-align: center;
	z-index: 100;
	display:block;
}

2. Dessinez le texte dans le canevas et utilisez-le comme texture

3. Créez le modèle dans votre logiciel 3D préféré et exportez-le vers three.js

4. La géométrie du texte fournie avec three.js

Si vous préférez travailler avec du three.js pur ou créer du texte 3D dynamique pouvant être modifié par programmation, vous pouvez créer un maillage dont la géométrie est une instance de THREE.TextGeometry :

new THREE.TextGeometry( text, parameters );

TextGeometry (géométrie du tampon de texte) nécessite qu'une instance de THREE.Font soit définie sur son paramètre "font"

5. Polices bitmap

BMFonts (polices bitmap) peuvent regrouper des glyphes dans un seul BufferGeometry. Le rendu de BMFont prend en charge le retour à la ligne automatique, l'espacement des lettres, l'ajustement des mots, les champs de distance signés avec des dérivés standard, les champs de distance signés multicanaux, les polices multi-textures et d'autres fonctionnalités

おすすめ

転載: blog.csdn.net/w418856/article/details/130602634