UNPKG

@inweb/viewer-three

Version:

JavaScript library for rendering CAD and BIM files in a browser using Three.js

194 lines (193 loc) 8.42 kB
import { Box3, Object3D, OrthographicCamera, PerspectiveCamera, Scene, Vector3, WebGLRenderer } from "three"; import { EffectComposer } from "three/examples/jsm/postprocessing/EffectComposer.js"; import { RenderPass } from "three/examples/jsm/postprocessing/RenderPass.js"; import { FXAAPass } from "three/examples/jsm/postprocessing/FXAAPass.js"; import { SMAAPass } from "three/examples/jsm/postprocessing/SMAAPass.js"; import { SSAARenderPass } from "./postprocessing/SSAARenderPass.js"; import { OutputPass } from "three/examples/jsm/postprocessing/OutputPass.js"; import { EventEmitter2 } from "@inweb/eventemitter2"; import { Assembly, Client, Model, File } from "@inweb/client"; import { CanvasEventMap, FileSource, IComponent, IDragger, ILoader, IOptions, IViewer, IViewpoint, Options, OptionsEventMap, ViewerEventMap } from "@inweb/viewer-core"; import { IMarkup, IWorldTransform } from "@inweb/markup"; import { IModelImpl } from "./models/IModelImpl"; import { Helpers } from "./scenes/Helpers"; /** * 3D viewer powered by {@link https://threejs.org/ | Three.js}. */ export declare class Viewer extends EventEmitter2<ViewerEventMap & CanvasEventMap & OptionsEventMap> implements IViewer, IWorldTransform { client: Client | undefined; protected _options: Options; private canvaseventlistener; canvas: HTMLCanvasElement | undefined; canvasEvents: string[]; scene: Scene | undefined; helpers: Helpers | undefined; camera: PerspectiveCamera | OrthographicCamera | undefined; renderer: WebGLRenderer | undefined; renderPass: RenderPass | undefined; helpersPass: RenderPass | undefined; fxaaPass: FXAAPass | undefined; smaaPass: SMAAPass | undefined; ssaaRenderPass: SSAARenderPass | undefined; outputPass: OutputPass | undefined; composer: EffectComposer | undefined; loaders: ILoader[]; models: IModelImpl[]; selected: Object3D[]; extents: Box3; target: Vector3; private _activeDragger; private _components; private renderNeeded; private renderTime; private _markup; /** * @param client - The `Client` instance that is used to load model reference files from the Open Cloud * Server. Do not specify `Client` if you need a standalone viewer instance to view `glTF` files from * the web or from local computer. */ constructor(client?: Client); get options(): IOptions; get draggers(): string[]; get components(): string[]; /** * 2D markup core instance used to create markups. * * @readonly */ get markup(): IMarkup; initialize(canvas: HTMLCanvasElement, onProgress?: (event: ProgressEvent<EventTarget>) => void): Promise<this>; dispose(): this; isInitialized(): boolean; update(force?: boolean): void; render(time?: DOMHighResTimeStamp, force?: boolean): void; loadReferences(model: Model | File | Assembly): Promise<this>; /** * Loads a file into the viewer. * * The viewer must be {@link initialize | initialized} before opening the file. Otherwise, `open()` does * nothing. * * This method requires a `Client` instance to be specified to load file from the Open Cloud Server. * The file geometry data on the Open Cloud Server must be converted into a `gltf` format, otherwise an * exception will be thrown. * * For files from Open Cloud Server, the default model will be loaded. If there is no default model, * first availiable model will be loaded. If no models are found in the file, an exception will be * thrown. * * For URLs, the file extension is used to determine the file format. For a `ArrayBuffer` and `Data * URL`, a file format must be specified using `params.format` parameter (see below). If no appropriate * loader is found for the specified format, an exception will be thrown. * * If there was an active dragger before opening the file, it will be deactivated. After opening the * file, you must manually activate the required dragger. * * Fires: * * - {@link OpenEvent | open} * - {@link GeometryStartEvent | geometrystart} * - {@link GeometryProgressEvent | geometryprogress} * - {@link DatabaseChunkEvent | databasechunk} * - {@link GeometryChunkEvent | geometrychunk} * - {@link GeometryEndEvent | geometryend} * - {@link GeometryErrorEvent | geometryerror} * * @param file - File to load. Can be one of: * * - `File`, `Assembly` or `Model` instance from the Open Cloud Server * - File `URL` string * - {@link https://developer.mozilla.org/docs/Web/HTTP/Basics_of_HTTP/Data_URIs | Data URL} string * - {@link https://developer.mozilla.org/docs/Web/API/File | Web API File} object * - {@link https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/ArrayBuffer | ArrayBuffer} * object * * @param params - Loading parameters. * @param params.format - File format string. Required when loading a file as `ArrayBuffer` or `Data * URL`. * @param params.mode - File opening mode. Can be one of: * * - `open` - Unloads an open file and opens a new one. This is default mode. * - `append` - Appends a file to an already open file. * * @param params.requestHeader - The * {@link https://developer.mozilla.org/docs/Glossary/Request_header | request header} used in HTTP * request. * @param params.withCredentials - Whether the HTTP request uses credentials such as cookies, * authorization headers or TLS client certificates. See * {@link https://developer.mozilla.org/docs/Web/API/XMLHttpRequest/withCredentials | XMLHttpRequest.withCredentials}. * @param params.path - The base path from which external resources such as binary data buffers, images * or textures will be loaded. If not defined, the base path of the file URL will be used. * @param params.externalFiles - External resource map. Each resource should be represented by a `uri` * and a corresponding resource URL, or * {@link https://developer.mozilla.org/docs/Web/HTTP/Basics_of_HTTP/Data_URIs | Data URL} string, or * {@link https://developer.mozilla.org/docs/Web/API/File | Web API File} object, or * {@link https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/ArrayBuffer | ArrayBuffer}. * @param params.crossOrigin - The crossOrigin string to implement CORS for loading the external * resources from a different domain that allows CORS. Default is `anonymous`. */ open(file: FileSource, params?: { format?: string; mode?: string; requestHeader?: HeadersInit; withCredentials?: boolean; path?: string; externalFiles?: Map<string, string | globalThis.File | ArrayBuffer>; crossOrigin?: string; }): Promise<this>; /** * Deprecated since `26.4`. Use {@link open | open()} instead. * * @deprecated */ openGltfFile(file: any, externalFiles: any, params?: any): Promise<this>; /** * Deprecated since `26.4`. Use {@link open | open()} instead. * * @deprecated */ loadGltfFile(file: any, externalFiles: any, params?: any): Promise<this>; cancel(): this; clear(): this; syncOptions(options?: IOptions): void; syncOverlay(): void; clearOverlay(): void; clearSlices(): void; getSelected(): string[]; setSelected(handles?: string[]): void; clearSelected(): void; hideSelected(): void; isolateSelected(): void; showAll(): void; explode(index?: number): void; collect(): void; activeDragger(): IDragger | null; setActiveDragger(name?: string): IDragger | null; resetActiveDragger(): void; getComponent(name: string): IComponent; is3D(): boolean; screenToWorld(position: { x: number; y: number; }): { x: number; y: number; z: number; }; worldToScreen(position: { x: number; y: number; z: number; }): { x: number; y: number; }; getScale(): { x: number; y: number; z: number; }; executeCommand(id: string, ...args: any[]): any; drawViewpoint(viewpoint: IViewpoint): void; createViewpoint(): IViewpoint; }