Hur man laddar en OBJ-modell med three.js i TypeScript

Jag använder TypeScript och three.d.ts från definitely typed. Jag har inga problem med att använda THREE.JSONLoader, men hur använder jag en OBJLoader här i ett TypeScript-projekt? Jag behöver antagligen skapa en OBJLoader.d.ts-fil, men jag har ingen aning om hur jag gör det och sedan hur jag använder den skapade definitionen. Jag försökte helt enkelt kopiera THREE.JSONLoader-definitionen och byta namn till OBJLoader, men det fungerade inte.

Svar #1

Den senaste versionen av Three.js har nu ES-modulversioner av alla klasser i examples/-mappen, tillsammans med typdeklarationsfiler. Så nu kan du:

import {OBJLoader} from 'three/examples/jsm/loaders/OBJLoader'

Och det kommer att skrivas på TypeScript som förväntat (hovra över det för att se verktygstips i VS Code).

Svar #2

Detta svar var korrekt vid tidpunkten för publiceringen, men det är föråldrat nu 2019. Se @trusktrs svar nedan för en bättre lösning idag.

Efter att ha tittat på källan till OBJLoader här, (och med hänvisning till three.d.ts) kan en enkel objloader.d.ts-fil se ut så här:

/// <reference path="three.d.ts" />

export class OBJLoader extends EventDispatcher {
        constructor();
        load(url: string, callback?: (response:any) => any): void;
        parse(data:any):any; // Not sure if the return value can be typed. Seems to be a group but I can't find a definition for that in three.d.ts?
}

Varning: detta är snabbt ihopsatt och inte testat, men kan hjälpa dig att komma igång.

Du skulle då referera till din objloader.d.ts på samma sätt som du för närvarande använder three.d.ts. Glöm inte att inkludera både three.js och OBJLoader.js-filerna på din HTML-sida, eller importera dem om du arbetar med externa moduler.

Relaterade artiklar