Class: ViewerApp
Core-API.ViewerApp
The main entry point for the 3D viewer SDK. Creates a scene, renderer and attaches itself to a canvas.
Hierarchy
SimpleEventDispatcher
<"update"
|"preRender"
|"postRender"
|"preFrame"
|"postFrame"
|"dispose"
|"addPlugin"
|"renderEnabled"
|"renderDisabled"
>↳
ViewerApp
Implements
IViewerApp
Properties
VERSION
▪ Static
Readonly
VERSION: "0.11.0-dev.13"
console
• console: Console
= console
Implementation of
IViewerApp.console
scene
• Readonly
scene: RootScene
<CameraController
<CameraControllerEventMap
>>
The Scene attached to the viewer, this cannot be changed.
Implementation of
IViewerApp.scene
plugins
• Readonly
plugins: Record
<string
, IViewerPlugin
<boolean
>> = {}
Implementation of
IViewerApp.plugins
renderFilter
• Readonly
renderFilter: IFilter
<RenderPass2
, "render"
>
The IFilter wrapper for the main render pass for the effect composer.
resizeObserver
• Readonly
resizeObserver: undefined
| ResizeObserver
The ResizeObserver observing the canvas element. Add more elements to this observer to resize viewer on their size change.
enabled
• enabled: boolean
= true
If the viewer is enabled. Set this false
to disable RAF loop.
renderEnabled
• renderEnabled: boolean
= true
Enable or disable all rendering, Animation loop including any frame/render events won't be fired when this is false.
maxFramePerLoop
• maxFramePerLoop: number
= 1
Specifies how many frames to render in a single request animation frame. Keep to 1 for realtime rendering. Note: should be max (screen refresh rate / animation frame rate) like 60Hz / 30fps
rendersPerFrame
• rendersPerFrame: number
= 1
Number of times to run composer render. Used in WebVR plugin.
serializePluginsIgnored
• serializePluginsIgnored: string
[] = []
Accessors
useRgbm
• get
useRgbm(): boolean
Use RGBM HDR Pipeline for rendering, which makes it faster on smaller devices but disables some features like transparency.
Returns
boolean
Implementation of
IViewerApp.useRgbm
screenShader
• get
screenShader(): TViewerScreenShader
Screen shader used for final rendering on screen, this can be used by other plugins to render on screen like TonemapPlugin. so it's readonly.
Returns
useGBufferDepth
• get
useGBufferDepth(): boolean
Whether to use the rendered gbuffer as depth-prepass. Requires GBufferPlugin This gives performance improvements but sometimes creates issues with z-fighting
Returns
boolean
Implementation of
IViewerApp.useGBufferDepth
isAntialiased
• get
isAntialiased(): boolean
Whether using Multisample render targets for rendering.
Returns
boolean
Implementation of
IViewerApp.isAntialiased
renderer
• get
renderer(): BaseRenderer
The renderer for the viewer that's attached to the canvas. This is wrapper around WebGLRenderer and EffectComposer and manages post-processing passes and rendering logic
Returns
Implementation of
IViewerApp.renderer
state
• get
state(): ViewerState
deprecated
State of the viewer. Not implemented.
see
ViewerApp.enabled.
Returns
Implementation of
IViewerApp.state
container
• get
container(): HTMLElement
Get the HTML Element containing the canvas
Returns
HTMLElement
Implementation of
IViewerApp.container
canvas
• get
canvas(): HTMLCanvasElement
Get the HTML Canvas Element where the viewer is rendering
Returns
HTMLCanvasElement
Implementation of
IViewerApp.canvas
canvasTexture
• get
canvasTexture(): CanvasTexture
Returns
CanvasTexture
renderManager
• get
renderManager(): BaseRenderer
Returns
assetManager
• get
assetManager(): undefined
| AssetManagerPlugin
Returns
undefined
| AssetManagerPlugin
Constructors
constructor
• new ViewerApp(__namedParameters
)
Create a viewer instance for using the webgi viewer SDK.
Parameters
Name | Type |
---|---|
__namedParameters | IViewerAppOptions |
Overrides
SimpleEventDispatcher<'update'|'preRender'|'postRender'|'preFrame'|'postFrame'|'dispose'|'addPlugin'|'renderEnabled'|'renderDisabled'\>.constructor
Methods
resize
▸ resize(): void
Mark that the canvas is resized. If the size is changed, the renderer and all render targets are resized. This happens before the render of the next frame.
Returns
void
setDirty
▸ setDirty(source?
, event?
): void
Set the viewer to dirty and trigger render of the next frame.
Parameters
Name | Type | Description |
---|---|---|
source? | any | The source of the dirty event. like plugin or 3d object |
event? | IEvent <any > | The event that triggered the dirty event. |
Returns
void
Implementation of
IViewerApp.setDirty
dispose
▸ dispose(): void
Disposes the viewer and frees up all resource and events. Do not use the viewer after calling dispose.
note
- If you want to reuse the viewer, set viewer.enabled to false instead, then set it to true again when required. To dispose all the objects, materials in the scene use viewer.scene.disposeSceneModels()
This function is not fully implemented yet. There might be some memory leaks.
Returns
void
getPlugin
▸ getPlugin<T
>(type
): undefined
| T
Get the Plugin by a type.
Type parameters
Name | Type |
---|---|
T | extends IViewerPlugin <boolean , T > |
Parameters
Name | Type | Description |
---|---|---|
type | string | Class <T > | The class of the plugin to get. |
Returns
undefined
| T
- The plugin of the specified type.
Implementation of
IViewerApp.getPlugin
getPluginByType
▸ getPluginByType<T
>(type
): undefined
| T
Get the Plugin by the string type. Use this function if the plugin is not a dependency and you don't want to bundle the plugin.
Type parameters
Name | Type |
---|---|
T | extends IViewerPlugin <boolean , T > |
Parameters
Name | Type | Description |
---|---|---|
type | string | The string type of the plugin to get. This in the static PluginType property of the plugin |
Returns
undefined
| T
Implementation of
IViewerApp.getPluginByType
getOrAddPlugin
▸ getOrAddPlugin<T
>(type
, ...args
): Promise
<T
>
Type parameters
Name | Type |
---|---|
T | extends IViewerPlugin <boolean , T > |
Parameters
Name | Type |
---|---|
type | Class <T > |
...args | any [] |
Returns
Promise
<T
>
Implementation of
IViewerApp.getOrAddPlugin
getOrAddPluginSync
▸ getOrAddPluginSync<T
>(type
, ...args
): T
Type parameters
Name | Type |
---|---|
T | extends IViewerPluginSync <T > |
Parameters
Name | Type |
---|---|
type | Class <T > |
...args | any [] |
Returns
T
addPlugin
▸ addPlugin<T
>(plugin
, ...args
): Promise
<T
>
Add a plugin to the viewer.
Type parameters
Name | Type |
---|---|
T | extends IViewerPlugin <boolean , T > |
Parameters
Name | Type | Description |
---|---|---|
plugin | T | Class <T > | The instance of the plugin to add or the class of the plugin to add. |
...args | any [] | Arguments for the constructor of the plugin, in case a class is passed. |
Returns
Promise
<T
>
- The plugin added.
Implementation of
IViewerApp.addPlugin
addPluginSync
▸ addPluginSync<T
>(plugin
, ...args
): T
Add a plugin to the viewer(sync).
Type parameters
Name | Type |
---|---|
T | extends IViewerPluginSync <T > |
Parameters
Name | Type |
---|---|
plugin | T | Class <T > |
...args | any [] |
Returns
T
addPlugins
▸ addPlugins(plugins
): Promise
<void
>
Parameters
Name | Type |
---|---|
plugins | (IViewerPlugin <boolean > | Class <IViewerPlugin <boolean >>)[] |
Returns
Promise
<void
>
addPluginsSync
▸ addPluginsSync(plugins
): Promise
<void
>
Parameters
Name | Type |
---|---|
plugins | (IViewerPluginSync | Class <IViewerPluginSync >)[] |
Returns
Promise
<void
>
removePlugin
▸ removePlugin(p
, dispose?
): Promise
<void
>
Remove a plugin instance or a plugin class. Works similar to {@see ViewerApp.addPlugin}
Parameters
Name | Type | Default value |
---|---|---|
p | IViewerPlugin <boolean > | undefined |
dispose | boolean | true |
Returns
Promise
<void
>
Implementation of
IViewerApp.removePlugin
removePluginSync
▸ removePluginSync(p
, dispose?
): void
Parameters
Name | Type | Default value |
---|---|---|
p | IViewerPluginSync | undefined |
dispose | boolean | true |
Returns
void
createCamera
▸ createCamera(camera
): CameraController
<CameraControllerEventMap
>
Converts a three.js Camera instance to be used in the viewer.
Parameters
Name | Type | Description |
---|---|---|
camera | OrthographicCamera <Object3DEventMap > | PerspectiveCamera <Object3DEventMap > | The three.js OrthographicCamera or PerspectiveCamera instance |
Returns
CameraController
<CameraControllerEventMap
>
- A wrapper around the camera with some useful methods and properties.
Implementation of
IViewerApp.createCamera
setSize
▸ setSize(size?
): void
Set size of the canvas and update the renderer. If no width/height is passed, canvas is set to 100% of the container.
Parameters
Name | Type |
---|---|
size? | Object |
size.width? | number |
size.height? | number |
Returns
void
doOnce
▸ doOnce<TRet
>(event
, func?
): Promise
<undefined
| TRet
>
Type parameters
Name |
---|
TRet |
Parameters
Name | Type |
---|---|
event | "preRender" | "postRender" | "preFrame" | "postFrame" | "renderEnabled" | "renderDisabled" |
func? | (...args : any []) => TRet |
Returns
Promise
<undefined
| TRet
>
setBackgroundColor
▸ setBackgroundColor(color
): void
Set the background color.
deprecated
use {@see RootScene.setBackgroundColor} instead.
Parameters
Name | Type | Description |
---|---|---|
color | string | number | Color | color in sRGB space. |
Returns
void
Implementation of
IViewerApp.setBackgroundColor
setBackground
▸ setBackground(asset
): void
Set the background color or texture, toggle it to show the environment as the background. This function is async because the background can be processed by some plugins after setting. This assumes the color to be in the Linear RGB color space, to use with sRGB use function {@see setBackgroundColor}.
deprecated
use {@see RootScene.setBackground} instead.
Parameters
Name | Type | Description |
---|---|---|
asset | null | string | number | ITexture <any > | Color | a Texture object, or a string/number/Color to set a solid color or {@see envMapBackground} for showing the scene environment map |
Returns
void
- returns after background is set.
Implementation of
IViewerApp.setBackground
getBackground
▸ getBackground(raw?
): null
| string
| number
| ITexture
<any
>
Get the background color or texture for the scene.
Parameters
Name | Type | Default value | Description |
---|---|---|---|
raw | boolean | false | if true, returns the raw value that was passed to {@see setBackground}, otherwise returns the computed value. (eg. with RGBM, colors are converted to 1px textures, when raw is false, the texture is returned, else the raw color value that was set.) |
Returns
null
| string
| number
| ITexture
<any
>
Implementation of
IViewerApp.getBackground
getManager
▸ getManager(): undefined
| AssetManagerPlugin
Gets the Asset management plugin, contains useful functions for managing, loading and inserting assets.
Returns
undefined
| AssetManagerPlugin
resetCamera
▸ resetCamera(__namedParameters?
): void
Sets the camera pointing towards the object at a specific distance.
Parameters
Name | Type |
---|---|
__namedParameters | AnyOptions |
Returns
void
Implementation of
IViewerApp.resetCamera
fitToView
▸ fitToView(selected?
, distanceMultiplier?
, duration?
, ease?
): Promise
<void
>
Parameters
Name | Type | Default value |
---|---|---|
selected? | Object3D <Object3DEventMap > | undefined |
distanceMultiplier | number | 1.5 |
duration? | number | undefined |
ease? | Easing | "linear" | "easeIn" | "easeOut" | "easeInOut" | "circIn" | "circOut" | "circInOut" | "backIn" | "backOut" | "backInOut" | "anticipate" | "bounceOut" | "bounceIn" | "bounceInOut" | "easeInOutSine" | undefined |
Returns
Promise
<void
>
createObject3D
▸ createObject3D(object?
, addToRoot?
): Promise
<undefined
| Object3DModel
>
Create a new empty object in the scene or add an existing three.js object to the scene.
Parameters
Name | Type | Default value |
---|---|---|
object? | Object3D <Object3DEventMap > | undefined |
addToRoot | boolean | false |
Returns
Promise
<undefined
| Object3DModel
>
createPhysicalMaterial
▸ createPhysicalMaterial(material?
): undefined
| MeshStandardMaterial2
<IMaterialEventMap
>
Create a new physical material from a template or another material. It returns the same material if a material is passed created by the material manager.
Parameters
Name | Type |
---|---|
material? | Material <MaterialEventMap > | MeshPhysicalMaterialParameters |
Returns
undefined
| MeshStandardMaterial2
<IMaterialEventMap
>
createMaterial
▸ createMaterial<T
>(template
, material?
): undefined
| T
Create a new material from a template or another material. It returns the same material if a material is passed created by the material manager.
Type parameters
Name | Type |
---|---|
T | extends IMaterial <any , IMaterialEventMap , T > |
Parameters
Name | Type | Description |
---|---|---|
template | string | template name registered in MaterialManager |
material? | any | three.js material object or material params to create a new material |
Returns
undefined
| T
serializePlugins
▸ serializePlugins(meta?
, filter?
): any
[]
Serialize all the plugins and their settings to save or create presets. Used in {@see toJSON}.
Parameters
Name | Type | Description |
---|---|---|
meta? | any | The meta object. |
filter? | string [] | List of PluginType for the to include. |
Returns
any
[]
deserializePlugins
▸ deserializePlugins(plugins
, meta?
): ViewerApp
Deserialize all the plugins and their settings from a preset. Used in {@see fromJSON}.
Parameters
Name | Type | Description |
---|---|---|
plugins | any [] | The output of {@see serializePlugins}. |
meta? | Record <string , any > | The meta object. |
Returns
traverseSceneObjects
▸ traverseSceneObjects<T
>(callback
): void
Traverse all objects in scene model root.
Type parameters
Name | Type |
---|---|
T | extends ISceneObject <any > = IModel <Object3D <Object3DEventMap >, IObject3DEventMap > |
Parameters
Name | Type |
---|---|
callback | (o : Object3D <Object3DEventMap > & T ) => void |
Returns
void
toJSON
▸ toJSON(meta?
, pluginFilter?
): any
Serialize all the viewer and plugin settings and versions.
Parameters
Name | Type | Description |
---|---|---|
meta? | any | The meta object. |
pluginFilter? | string [] | List of PluginType to include. |
Returns
any
- Serializable JSON object.
Implementation of
IViewerApp.toJSON
fromJSON
▸ fromJSON(data
, meta?
): ViewerApp
Deserialize all the viewer and plugin settings.
Parameters
Name | Type | Description |
---|---|---|
data | any | The serialized JSON object returned from {@see toJSON}. |
meta? | Record <string , any > | The meta object |
Returns
Implementation of
IViewerApp.fromJSON
load
▸ load<T
>(obj
, options?
): Promise
<undefined
| T
>
Add an object/model/material/viewer-config/plugin-preset/... to the viewer scene from url or an IAsset object. Same as {@link AssetManager.addAssetSingle}
Type parameters
Name | Type |
---|---|
T | any |
Parameters
Name | Type |
---|---|
obj | null | string | IAsset |
options? | ImportAddOptions |
Returns
Promise
<undefined
| T
>
setEnvironmentMap
▸ setEnvironmentMap(map
, __namedParameters?
): Promise
<null
| ITexture
<any
> & Texture
<TextureEventMap
>>
Set the environment map of the scene from url or an IAsset object.
Parameters
Name | Type |
---|---|
map | undefined | null | string | ITexture <any > | IAsset | Texture <TextureEventMap > |
__namedParameters | { forceImport? : boolean ; reimportDisposed? : boolean ; pathOverride? : string ; importedFile? : IFile } & { processImported? : boolean ; forceImporterReprocess? : boolean ; rootPath? : string ; generateMipmaps? : boolean ; _testDataTextureComplete? : boolean } & AddModelOptions & { pseudoCenter? : boolean ; autoCenter? : boolean ; license? : string } & AnyOptions & ImportFileOptions & { setBackground? : boolean } |
Returns
Promise
<null
| ITexture
<any
> & Texture
<TextureEventMap
>>
setBackgroundMap
▸ setBackgroundMap(map
, __namedParameters?
): Promise
<null
| ITexture
<any
> & Texture
<TextureEventMap
>>
Set the background image of the scene from url or an IAsset object.
Parameters
Name | Type |
---|---|
map | undefined | null | string | ITexture <any > | IAsset | Texture <TextureEventMap > |
__namedParameters | { forceImport? : boolean ; reimportDisposed? : boolean ; pathOverride? : string ; importedFile? : IFile } & { processImported? : boolean ; forceImporterReprocess? : boolean ; rootPath? : string ; generateMipmaps? : boolean ; _testDataTextureComplete? : boolean } & AddModelOptions & { pseudoCenter? : boolean ; autoCenter? : boolean ; license? : string } & AnyOptions & ImportFileOptions & { setBackground? : boolean } |
Returns
Promise
<null
| ITexture
<any
> & Texture
<TextureEventMap
>>
alert
▸ alert(message?
): Promise
<void
>
Parameters
Name | Type |
---|---|
message? | string |
Returns
Promise
<void
>
Implementation of
IViewerApp.alert
confirm
▸ confirm(message?
): Promise
<boolean
>
Parameters
Name | Type |
---|---|
message? | string |
Returns
Promise
<boolean
>
Implementation of
IViewerApp.confirm
prompt
▸ prompt(message?
, _default?
, cancel?
): Promise
<null
| string
>
Parameters
Name | Type | Default value |
---|---|---|
message? | string | undefined |
_default? | string | undefined |
cancel | boolean | true |
Returns
Promise
<null
| string
>
Implementation of
IViewerApp.prompt