Jak programově vytvořit 3D síť v TypeScriptu

Krok 1: Nainstalovat @aspose/3d

asposefoss/3d is not yet published — build from source until it ships. See the project README for build instructions.

Nevyžaduje se žádné nativní doplňky ani systémové knihovny. Paket obsahuje definice typů TypeScript.

Minimální hodnota: tsconfig.json:

{
  "compilerOptions": {
    "target": "ES2020",
    "module": "commonjs",
    "moduleResolution": "node",
    "esModuleInterop": true,
    "strict": true
  }
}

Krok 2: Vytvořte scénu a uzel

A. Vypravit . Scene Všechna geometrie musí být připojená k Node uvnitř stromu scén:

import { Scene } from '@aspose/3d';

const scene = new Scene();
const node = scene.rootNode.createChildNode('triangle');

createChildNode(name) vytvoří jmenovaný uzel a připojí ho jako dítě současného uzlu. Vrácený Node Objekt je místo, kde budete připojit síť v kroku 7.

Krok 3: Vytvořte objekt sítě

Mesh Vytvořte jeden s volitelným názvem:

import { Mesh } from '@aspose/3d/entities';

const mesh = new Mesh('triangle');

Mřížka začíná prázdná: žádné vrcholy a tváře. Přidáte je v dalších krocích.

Krok 4: Přidání kontrolních bodů (křivek)

Kontrolní body jsou pozice vrcholu v místním prostoru. Vector4 hodnoty do mesh.controlPoints.Čtvrtá složka (w) je 1 pro pozice:

import { Vector4 } from '@aspose/3d/utilities';

mesh.controlPoints.push(new Vector4(0.0, 0.0, 0.0, 1.0)); // index 0
mesh.controlPoints.push(new Vector4(1.0, 0.0, 0.0, 1.0)); // index 1
mesh.controlPoints.push(new Vector4(0.5, 1.0, 0.0, 1.0)); // index 2

Tyto pozice odkazujete na jejich index založený na nule při definování polygonových tváří.

Krok 5: Vytvořte polygonové tváře

createPolygon() Tři indexy tvoří trojúhelník:

mesh.createPolygon(0, 1, 2);

Můžete také definovat čtyřkolky (čtyři indexy) nebo libovolné polygony pro formáty, které je podporují. Pro glTF knižnice automaticky triangulace čtverkolek a n-gons při vývozu.

Krok 6: Přidání normálních vertexů

Normální zlepšuje kvalitu vykreslování. mesh.createElement() vytvořit VertexElementNormal, shromáždit normální vektory do řady, pak volání setData() aby je uskladnila. data getter vrací obrannou kopii tlačení na ni nemá žádný účinek. Použijte FVector3 (jednopřesný plávací systém) pro běžné údaje, ne Vector4.

import { VertexElementNormal } from '@aspose/3d/entities';
import { VertexElementType, MappingMode, ReferenceMode } from '@aspose/3d/entities';
import { FVector3 } from '@aspose/3d/utilities';

const normals = mesh.createElement(
    VertexElementType.NORMAL,
    MappingMode.CONTROL_POINT,
    ReferenceMode.DIRECT
) as VertexElementNormal;

// Build the normal array, then call setData() — do NOT push to normals.data
normals.setData([
    new FVector3(0, 0, 1), // normal for vertex 0 (pointing +Z)
    new FVector3(0, 0, 1), // normal for vertex 1
    new FVector3(0, 0, 1), // normal for vertex 2
]);

MappingMode.CONTROL_POINT znamená jeden normál na vrchol. ReferenceMode.DIRECT znamená, že datová řady jsou indexovány přímo indexem vrcholu polygonu.

Krok 7: Připojte síť a ukládat na glTF

Přidělit síť na uzel prostřednictvím node.entity, pak to schovej .:

import { GltfSaveOptions, GltfFormat } from '@aspose/3d/formats/gltf';

node.entity = mesh;

const saveOpts = new GltfSaveOptions();
scene.save('triangle.gltf', GltfFormat.getInstance(), saveOpts);
console.log('Triangle mesh saved to triangle.gltf');

Vytvořit jedinou samostatnou, nezávislou a bezvýhradní firmu. .glb soubor místo, nastavení saveOpts.binaryMode = true a změnit rozšíření výstupního souboru na: .glb.