Section:

WebViewer BIM Client APIs

initializeBimViewer

Construct initialized 3D viewer.

Parameters

instance

object

WebViewer instance that is available after initializing.

serverURL

string

URL of WebViewer BIM server.

options

object

An options object to configure the WebViewer BIM application. The following are possible arguments:

  • license - The WebViewer BIM license key.
  • dataSchema - An object that defines the schema of the properties panel.

Returns

A promise that resolves to an object containing the functions necessary for loading models in WebViewer.

Example

JavaScript

1import  WebViewer  from  '@pdftron/webviewer';
2import { initializeBimViewer } from '@pdftron/webviewer-bim-client'
3WebViewer({
4  path: '/webviewer/lib',
5}, document.getElementById('viewer')).then(instance  => {
6  const  license = `---- Insert commercial license key here after purchase ----`;
7  const  serverURL = `---- Insert server URL after setup ----`;
8  const  options = {
9    license: license,
10    dataSchema: {
11      headerName: 'Name',
12      defaultValues: {
13        Description: 'Description',
14        GlobalID: 'GlobalId',
15        Handle: 'handle',
16        EmptyRow1: 'EmptyRow1',
17      },
18      groups: {
19        Dimensions: {
20          Length: 'Length',
21          Width: 'Width',
22          Height: 'Height',
23          EmptyRow2: 'EmptyRow2',
24          GrossFootprintArea: 'GrossFootprintArea',
25          GrossSideArea: 'GrossSideArea',
26          GrossVolume: 'GrossVolume',
27        }
28        EmptyGroupTest: {
29            ObjectType: 'Lions',
30            EmptyRow3: 'Tigers',
31            ObjectPlacement: 'Bears',
32        },
33      },
34      groupOrder: ['EmptyGroupTest', 'Dimensions'],
35      removeEmptyRows: true,
36      removeEmptyGroups: true,
37      createRawValueGroup: true,
38    }
39  };
40  const WebViewerBIM = await initializeBimViewer(instance, serverURL, options);
41}

load3dAsset

Loads a 3D model.

Parameters

pathToAsset

string

URL or path to 3D model.

options

object

An optional object that modifies the 3D loading process.

  • loadProperties, determines whether the server should extract and load 3D property data or not.
  • withCredentials, determines whether to set the credentials property to 'include' on the Fetch request. This is used when the BIM Server has allow_credentials enabled.
  • headers, carries additional information to be sent to the BIM server.
  • headers.extension, use this option to exclusively specify the file extension.

Returns

void

Example

JavaScript

1const webviewerBIM = await initializeBimViewer(instance, serverURL, options);
2const loadOptions = {
3  loadProperties: true,
4  withCredentials: true,
5  headers: {
6    extension: '.ifc',
7  },
8};
9webviewerBIM.File.load3dAsset('Add URL to your 3D asset here', loadOptions);

preload3dAsset

Preloads a 3D model for future loading, allowing for the conversion of model data before loading.

Parameters

serverURL

string

URL to your BIM server instance.

pathToAsset

string

URL or path to 3D model.

preloadOptions

object

Optional options object to modify preload behavior.

  • loadProperties, determines whether the server should extract and load 3D property data or not.
  • withCredentials, determines whether to set the credentials property to 'include' on the Fetch request. This is used when the BIM Server has allow_credentials enabled.
  • headers, carries additional information to be sent to the BIM server. For instance, the extension attribute can be included in the header to exclusively specify the file extension.

Returns

Promise<object> - An object containing IDs for model and, optionally, properties data. If enable_auth is enabled on your BIM server, it will return an authorization token for both the model and properties data.

JavaScript

1// Sample return value.
2assetObject = {
3  modelData: {
4    id: '7bdb6aeab27191a882b9d3ed1e48afd4b490d755',
5    authorization: 'be36e17d84d9eac35f41aef4cd9dc6e894f9f452b96175b2075308725338c3fe',
6  },
7  propertiesData: {
8    id: 'b204f18fb2168dc547d5056721c50ceb5bb3c62b',
9    authorization: 'fa34e17d84g3awe35f41aef4cd9dc6e894f9f452b96175b2075308725338c3fe',
10  },
11};

Example

JavaScript

1const preloadOptions = {
2  loadProperties: true,
3  withCredentials: true,
4  headers: {
5   extension: '.ifc', 
6  },
7};
8const assetObject = await preload3dAsset(<serverURL>, <pathToAsset>, preloadOptions);

loadCached3dAsset

Loads a cached 3D asset from the BIM server.

Parameters

loadCachedOptions

object

Options object containing credential options, model data IDs, and optional properties data. Authorization tokens are only required if enable_auth is set to true on the BIM Server.

  • withCredentials, determines whether to set the credentials property to 'include' on the Fetch request. This is used when the BIM Server has allow_credentials enabled.

Returns

Promise<void>

Example

JavaScript

1const loadCachedOptions = {
2  withCredentials: true,
3  modelData: {
4    id: '7bdb6aeab27191a882b9d3ed1e48afd4b490d755',
5    authorization: 'be36e17d84d9eac35f41aef4cd9dc6e894f9f452b96175b2075308725338c3fe',
6  },
7  propertiesData: {
8    id: 'b204f18fb2168dc547d5056721c50ceb5bb3c62b',
9    authorization: 'fa34e17d84g3awe35f41aef4cd9dc6e894f9f452b96175b2075308725338c3fe',
10  },
11};
12const webviewerBIM = await initializeBimViewer(instance, serverURL, options);
13await webviewerBIM.File.loadCached3dAsset(loadCachedOptions);

checkAssetConversionProgress

Checks the status on asset conversion, returning true when an asset is ready to load.

Parameters

optionsObject

object

Options object containing credential options, model data IDs, and optional properties data. Authorization tokens are only required if enable_auth is set to true on the BIM Server.

  • withCredentials, determines whether to set the credentials property to 'include' on the Fetch request. This is used when the BIM Server has allow_credentials enabled.

Returns

Promise<boolean> - A promise that resolves to true if the conversion has been completed successfully. false otherwise.

Example

JavaScript

1import { initializeBimViewer, preload3dAsset } from '@pdftron/webviewer-bim-client';
2const webviewerBIM = await initializeBimViewer(<instance>, <serverURL>, <options>);
3const asset = await preload3dAsset(<serverURL>, <assetURL>, {});
4// Rudimentary polling against the BIM server to know when the asset is ready.
5while (true) {
6  const status = await webviewerBIM.File.checkAssetConversionProgress({
7    ...asset,
8    withCredentials: true
9  });
10  if (status === true) {
11    break;
12  }
13  await new Promise((r) => setTimeout(r, 200));
14}
15await webviewerBIM.File.loadCached3dAsset(asset);

unmountBimViewer

Unmounts the BIM Viewer. Calling this will close the document and delete all annotations of the current session.

Parameters

instance

object

WebViewer instance that is available after initializing.

Returns

void

Example

JavaScript

1import  Webviewer  from  '@pdftron/webviewer';
2import { initializeBimViewer, unmountBimViewer } from '@pdftron/webviewer-bim-client'
3Webviewer({
4  path: '/webviewer/lib',
5}, document.getElementById('viewer')).then(instance  => {
6  const  license = `---- Insert commercial license key here after purchase ----`;
7  const  serverURL = `---- Insert server URL after setup ----`;
8  const  options = {
9    license: license,
10  }
11  const WebViewerBIM = await initializeBimViewer(instance, serverURL, options);
12  webviewerBIM.File.load3dAsset("Add URL to your 3D asset here");
13  unmountBimViewer(instance);
14}

Viewer APIs

enableSSAO

Enable screen-space ambient occlusion for the viewer.

Returns

void

Example

JavaScript

1const webviewerBIM = await initializeBimViewer(instance, serverURL, options);
2webviewerBIM.Viewer.enableSSAO();

disableSSAO

Disable screen-space ambient occlusion for the viewer.

Returns

void

Example

JavaScript

1const webviewerBIM = await initializeBimViewer(instance, serverURL, options);
2webviewerBIM.Viewer.disableSSAO();

setSSAOOptions

Adjust screen-space ambient occlusion for the viewer.

Returns

void

Example

JavaScript

1const webviewerBIM = await initializeBimViewer(instance, serverURL, options);
2webviewerBIM.Viewer.setSSAOOptions({
3  // example parameters：
4  isDynamicRadius: true,
5  radius: 1,
6  loops: 64,
7  blurRadius: 2,
8  power: 1.4,
9});

enableAntiAliasing

Enable anti-aliasing for the viewer.

Returns

void

Example

JavaScript

1const webviewerBIM = await initializeBimViewer(instance, serverURL, options);
2webviewerBIM.Viewer.enableAntiAliasing();

disableAntiAliasing

Disable anti-aliasing for the viewer.

Returns

void

Example

JavaScript

1const webviewerBIM = await initializeBimViewer(instance, serverURL, options);
2webviewerBIM.Viewer.disableAntiAliasing();

enableShadows

Enable ground shadows for the viewer.

Returns

void

Example

JavaScript

1const webviewerBIM = await initializeBimViewer(instance, serverURL, options);
2webviewerBIM.Viewer.enableShadows();

disableShadows

Disable ground shadows for the viewer.

Returns

void

Example

JavaScript

1const webviewerBIM = await initializeBimViewer(instance, serverURL, options);
2webviewerBIM.Viewer.disableShadows();

getWalkMode

Gets the current Walk Mode for the First Person Mode.

Returns

String - Returns either WalkThrough or FlyThrough.

Example

JavaScript

1const webviewerBIM = await initializeBimViewer(instance, serverURL, options);
2webviewerBIM.Viewer.FirstPersonMode.getWalkMode();

setWalkMode

Sets the current Walk Mode for the First Person Mode, either WalkThrough or FlyThrough. WalkThrough simulates walking where going forward for example is always in reference to the ground plane. When set to FlyThrough directional movement is relative to the camera orientation.

Parameters

walkMode

string

String containing the desired walk mode, either WalkThrough or FlyThrough.

Returns

void

Example

JavaScript

1const webviewerBIM = await initializeBimViewer(instance, serverURL, options);
2webviewerBIM.Viewer.FirstPersonMode.setWalkMode('WalkThrough');

Orbit & Pan Tools APIs

setCameraSensitivity

Sets the sensitivity for Orbit/Pan tool.

Returns

void

Example

JavaScript

1const cameraTools = {
2  orbit: 'Orbit3D',
3  pan: 'Pan3D',
4  walk: 'Walk',
5};
6const panTool = instance.Core.DocumentViewer.getTool(cameraTools.pan);
7panTool.setCameraSensitivity(10);

getCameraSensitivity

Gets the Orbit/Pan tool's sensitivity.

Returns

Number

Example

JavaScript

1const cameraTools = {
2  orbit: 'Orbit3D',
3  pan: 'Pan3D',
4  walk: 'Walk',
5};
6const orbitTool = instance.Core.DocumentViewer.getTool(cameraTools.orbit);
7orbitTool.getCameraSensitivity();

Properties Panel APIs

setPanelSchema

Sets a new Properties Panel configuration based on a passed in Schema.

Parameters

schema

object

Object containing the desired configuration.

Returns

void

Example

JavaScript

1const sampleSchema =  {
2      headerName: 'Name',
3      defaultValues: {
4        Description: 'Description',
5        GlobalID: 'GlobalId',
6        Handle: 'handle',
7        EmptyRow1: 'EmptyRow1',
8      },
9      groups: {
10        Dimensions: {
11          Length: 'Length',
12          Width: 'Width',
13          Height: 'Height',
14          EmptyRow2: 'EmptyRow2',
15          GrossFootprintArea: 'GrossFootprintArea',
16          GrossSideArea: 'GrossSideArea',
17          GrossVolume: 'GrossVolume',
18        }
19        EmptyGroupTest: {
20            ObjectType: 'Lions',
21            EmptyRow3: 'Tigers',
22            ObjectPlacement: 'Bears',
23        },
24      },
25      groupOrder: ['EmptyGroupTest', 'Dimensions'],
26      removeEmptyRows: true,
27      removeEmptyGroups: true,
28      createRawValueGroup: true,
29    }
30    const webviewerBIM = await initializeBimViewer(instance, serverURL, options);
31    webviewerBIM.PropertiesPanel.setSchema(sampleSchema);
32}

toggleShowDefaultGroup

Toggles showing the Default group. This group contains all of the key/value pairs on a selected element without any adjustments.

Returns

void

Example

JavaScript

1const webviewerBIM = await initializeBimViewer(instance, serverURL, options);
2webviewerBIM.PropertiesPanel.toggleShowDefaultGroup();

toggleShowEmptyGroups

Toggles showing empty Groups on the properties panel. Empty Groups are defined as groups where every Row has an empty String.

Returns

void

Example

JavaScript

1const webviewerBIM = await initializeBimViewer(instance, serverURL, options);
2webviewerBIM.PropertiesPanel.toggleShowEmptyGroups();

toggleShowEmptyRows

Toggles showing empty Rows on the properties panel. An empty Row is defined as a row where the value is an empty String.

Returns

void

Example

JavaScript

1const webviewerBIM = await initializeBimViewer(instance, serverURL, options);
2webviewerBIM.PropertiesPanel.toggleShowEmptyRows();

Did you find this helpful?

Trial setup questions?

Ask experts on Discord

Need other help?

Contact Support

Pricing or product questions?

Contact Sales