@egjs/view3d
Version:
Fast & Customizable glTF 3D model viewer, packed with full of features!
260 lines (259 loc) • 10.7 kB
TypeScript
import * as THREE from "three";
import Component from "@egjs/component";
import Renderer from "./core/Renderer";
import Scene from "./core/Scene";
import Camera from "./core/Camera";
import Model from "./core/Model";
import ModelAnimator from "./core/ModelAnimator";
import ARManager from "./core/ARManager";
import AnnotationManager from "./annotation/AnnotationManager";
import { ShadowOptions } from "./core/ShadowPlane";
import OrbitControl from "./control/OrbitControl";
import { RotateControlOptions } from "./control/RotateControl";
import { TranslateControlOptions } from "./control/TranslateControl";
import { ZoomControlOptions } from "./control/ZoomControl";
import AutoPlayer, { AutoplayOptions } from "./core/AutoPlayer";
import { WebARSessionOptions } from "./xr/WebARSession";
import { SceneViewerSessionOptions } from "./xr/SceneViewerSession";
import { QuickLookSessionOptions } from "./xr/QuickLookSession";
import { EVENTS, AUTO, AR_SESSION_TYPE, TONE_MAPPING, ANIMATION_REPEAT_MODE } from "./const/external";
import * as EVENT_TYPES from "./type/event";
import { View3DPlugin } from "./plugin";
import { LiteralUnion, OptionGetters, ValueOf } from "./type/utils";
import { LoadingItem } from "./type/external";
export interface View3DEvents {
[EVENTS.READY]: EVENT_TYPES.ReadyEvent;
[EVENTS.LOAD_START]: EVENT_TYPES.LoadStartEvent;
[EVENTS.LOAD]: EVENT_TYPES.LoadEvent;
[EVENTS.LOAD_ERROR]: EVENT_TYPES.LoadErrorEvent;
[EVENTS.LOAD_FINISH]: EVENT_TYPES.LoadFinishEvent;
[EVENTS.MODEL_CHANGE]: EVENT_TYPES.ModelChangeEvent;
[EVENTS.RESIZE]: EVENT_TYPES.ResizeEvent;
[EVENTS.BEFORE_RENDER]: EVENT_TYPES.BeforeRenderEvent;
[EVENTS.RENDER]: EVENT_TYPES.RenderEvent;
[EVENTS.PROGRESS]: EVENT_TYPES.LoadProgressEvent;
[EVENTS.INPUT_START]: EVENT_TYPES.InputStartEvent;
[EVENTS.INPUT_END]: EVENT_TYPES.InputEndEvent;
[EVENTS.CAMERA_CHANGE]: EVENT_TYPES.CameraChangeEvent;
[EVENTS.ANIMATION_START]: EVENT_TYPES.AnimationStartEvent;
[EVENTS.ANIMATION_LOOP]: EVENT_TYPES.AnimationLoopEvent;
[EVENTS.ANIMATION_FINISHED]: EVENT_TYPES.AnimationFinishedEvent;
[EVENTS.ANNOTATION_FOCUS]: EVENT_TYPES.AnnotationFocusEvent;
[EVENTS.ANNOTATION_UNFOCUS]: EVENT_TYPES.AnnotationUnfocusEvent;
[EVENTS.AR_START]: EVENT_TYPES.ARStartEvent;
[EVENTS.AR_END]: EVENT_TYPES.AREndEvent;
[EVENTS.AR_MODEL_PLACED]: EVENT_TYPES.ARModelPlacedEvent;
[EVENTS.QUICK_LOOK_TAP]: EVENT_TYPES.QuickLookTapEvent;
}
export interface View3DOptions {
src: string | string[] | null;
iosSrc: string | null;
variant: number | string | null;
dracoPath: string;
ktxPath: string;
meshoptPath: string | null;
fixSkinnedBbox: boolean;
fov: typeof AUTO | number;
center: typeof AUTO | Array<number | string>;
yaw: number;
pitch: number;
pivot: typeof AUTO | Array<number | string>;
initialZoom: number | {
axis: "x" | "y" | "z";
ratio: number;
};
rotate: boolean | Partial<RotateControlOptions>;
translate: boolean | Partial<TranslateControlOptions>;
zoom: boolean | Partial<ZoomControlOptions>;
autoplay: boolean | Partial<AutoplayOptions>;
scrollable: boolean;
wheelScrollable: boolean;
useGrabCursor: boolean;
ignoreCenterOnFit: boolean;
skybox: string | null;
envmap: string | null;
background: number | string | null;
exposure: number;
shadow: boolean | Partial<ShadowOptions>;
skyboxBlur: boolean;
toneMapping: LiteralUnion<ValueOf<typeof TONE_MAPPING>, THREE.ToneMapping>;
useDefaultEnv: boolean;
defaultAnimationIndex: number;
animationRepeatMode: ValueOf<typeof ANIMATION_REPEAT_MODE>;
annotationURL: string | null;
annotationWrapper: HTMLElement | string;
annotationSelector: string;
annotationBreakpoints: Record<number, number>;
annotationAutoUnfocus: boolean;
webAR: boolean | Partial<WebARSessionOptions>;
sceneViewer: boolean | Partial<SceneViewerSessionOptions>;
quickLook: boolean | Partial<QuickLookSessionOptions>;
arPriority: Array<ValueOf<typeof AR_SESSION_TYPE>>;
poster: string | HTMLElement | null;
canvasSelector: string;
autoInit: boolean;
autoResize: boolean;
useResizeObserver: boolean;
maintainSize: boolean;
on: Partial<View3DEvents>;
plugins: View3DPlugin[];
maxDeltaTime: number;
}
declare class View3D extends Component<View3DEvents> implements OptionGetters<Omit<View3DOptions, "on">> {
static readonly VERSION: string;
private _renderer;
private _scene;
private _camera;
private _control;
private _autoPlayer;
private _model;
private _animator;
private _autoResizer;
private _arManager;
private _annotationManager;
private _rootEl;
private _plugins;
private _initialized;
private _loadingContext;
private _src;
private _iosSrc;
private _variant;
private _dracoPath;
private _ktxPath;
private _meshoptPath;
private _fixSkinnedBbox;
private _fov;
private _center;
private _yaw;
private _pitch;
private _pivot;
private _initialZoom;
private _rotate;
private _translate;
private _zoom;
private _autoplay;
private _scrollable;
private _wheelScrollable;
private _useGrabCursor;
private _ignoreCenterOnFit;
private _skybox;
private _envmap;
private _background;
private _exposure;
private _shadow;
private _skyboxBlur;
private _toneMapping;
private _useDefaultEnv;
private _defaultAnimationIndex;
private _animationRepeatMode;
private _annotationURL;
private _annotationWrapper;
private _annotationSelector;
private _annotationBreakpoints;
private _annotationAutoUnfocus;
private _webAR;
private _sceneViewer;
private _quickLook;
private _arPriority;
private _poster;
private _canvasSelector;
private _autoInit;
private _autoResize;
private _useResizeObserver;
private _maintainSize;
private _maxDeltaTime;
get renderer(): Renderer;
get scene(): Scene;
get camera(): Camera;
get control(): OrbitControl;
get autoPlayer(): AutoPlayer;
get model(): Model;
get animator(): ModelAnimator;
get ar(): ARManager;
get annotation(): AnnotationManager;
get rootEl(): HTMLElement;
get initialized(): boolean;
get loadingContext(): LoadingItem[];
get plugins(): View3DPlugin[];
get src(): string | string[];
get iosSrc(): View3DOptions["iosSrc"];
get variant(): View3DOptions["variant"];
get dracoPath(): string;
get ktxPath(): string;
get meshoptPath(): string;
get fixSkinnedBbox(): boolean;
get fov(): number | "auto";
get center(): "auto" | (string | number)[];
get yaw(): number;
get pitch(): number;
get pivot(): "auto" | (string | number)[];
get initialZoom(): View3DOptions["initialZoom"];
get rotate(): boolean | Partial<RotateControlOptions>;
get translate(): boolean | Partial<TranslateControlOptions>;
get zoom(): boolean | Partial<ZoomControlOptions>;
get autoplay(): boolean | Partial<AutoplayOptions>;
get scrollable(): boolean;
get wheelScrollable(): boolean;
get useGrabCursor(): View3DOptions["useGrabCursor"];
get ignoreCenterOnFit(): boolean;
get skybox(): View3DOptions["skybox"];
get envmap(): View3DOptions["envmap"];
get background(): string | number;
get exposure(): View3DOptions["exposure"];
get shadow(): boolean | Partial<ShadowOptions>;
get skyboxBlur(): View3DOptions["skyboxBlur"];
get toneMapping(): View3DOptions["toneMapping"];
get useDefaultEnv(): boolean;
get defaultAnimationIndex(): View3DOptions["defaultAnimationIndex"];
get animationRepeatMode(): View3DOptions["animationRepeatMode"];
get annotationURL(): string;
get annotationWrapper(): string | HTMLElement;
get annotationSelector(): string;
get annotationBreakpoints(): Record<number, number>;
get annotationAutoUnfocus(): boolean;
get webAR(): boolean | Partial<WebARSessionOptions>;
get sceneViewer(): boolean | Partial<SceneViewerSessionOptions>;
get quickLook(): boolean | Partial<QuickLookSessionOptions>;
get arPriority(): ("webAR" | "sceneViewer" | "quickLook")[];
get poster(): string | HTMLElement;
get canvasSelector(): string;
get autoInit(): boolean;
get autoResize(): View3DOptions["autoResize"];
get useResizeObserver(): boolean;
get maintainSize(): View3DOptions["maintainSize"];
get maxDeltaTime(): View3DOptions["maxDeltaTime"];
set iosSrc(val: View3DOptions["iosSrc"]);
set variant(val: View3DOptions["variant"]);
set defaultAnimationIndex(val: View3DOptions["defaultAnimationIndex"]);
set initialZoom(val: View3DOptions["initialZoom"]);
set skybox(val: View3DOptions["skybox"]);
set envmap(val: View3DOptions["envmap"]);
set exposure(val: View3DOptions["exposure"]);
set skyboxBlur(val: View3DOptions["skyboxBlur"]);
set toneMapping(val: View3DOptions["toneMapping"]);
set useGrabCursor(val: View3DOptions["useGrabCursor"]);
set animationRepeatMode(val: View3DOptions["animationRepeatMode"]);
set autoResize(val: View3DOptions["autoResize"]);
set maintainSize(val: View3DOptions["maintainSize"]);
set maxDeltaTime(val: View3DOptions["maxDeltaTime"]);
constructor(root: string | HTMLElement, { src, iosSrc, variant, dracoPath, ktxPath, meshoptPath, fixSkinnedBbox, fov, center, yaw, pitch, pivot, initialZoom, rotate, translate, zoom, autoplay, scrollable, wheelScrollable, useGrabCursor, ignoreCenterOnFit, skybox, envmap, background, exposure, shadow, skyboxBlur, toneMapping, useDefaultEnv, defaultAnimationIndex, animationRepeatMode, annotationURL, annotationWrapper, annotationSelector, annotationBreakpoints, annotationAutoUnfocus, webAR, sceneViewer, quickLook, arPriority, poster, canvasSelector, autoInit, autoResize, useResizeObserver, maintainSize, on, plugins, maxDeltaTime }?: Partial<View3DOptions>);
destroy(): void;
init(): Promise<void>;
resize(): void;
load(src: string | string[], { iosSrc }?: Partial<{
iosSrc: string | null;
}>): Promise<void>;
display(model: Model, { resetCamera }?: Partial<{
resetCamera: boolean;
}>): void;
loadPlugins(...plugins: View3DPlugin[]): Promise<void>;
removePlugins(...plugins: View3DPlugin[]): Promise<void>;
screenshot(fileName?: string): void;
private _loadModel;
private _loadSingleModel;
private _addEventHandlers;
private _addPosterImage;
private _initPlugins;
private _resetLoadingContextOnFinish;
}
export default View3D;