Skip to main content

Presence for AutoDesk APS Viewer

The Autodesk plugin is designed to seamlessly integrate Presence controls, Mouse Pointers, avatars, and lasers into your BIM software.

Before we start

Before utilizing the Autodesk component, it is essential to initialize a room with a defined name and ID for the participant.

If you want to use 3D avatars, see initialization for further info. if no avatar has been provided, then a default avatar from SuperViz will be used.

Embedded viewer vs External viewer

There are two different approaches on how to implement SuperViz into an Autodesk APS viewer.

  • Choose Embedded Viewer if you want SuperViz to create the Autodesk viewer code. You only need to pass your tokens and attributes and the component takes care of the rest.
  • Choose External viewer if you've already built your application and want to have complete control of the viewer. Then you just need to pass your viewer as an object and the component takes care of the rest.
tip

When using Video Conference together with Presence for AutoDesk APS Viewer, you can enable users to select from our list of avatars, by setting the flag defaultAvatars as true on the Video Conference constructor.

How to use

import { AutodeskViewer } from "@superviz/react-sdk";
import { useState } from "react";

function Room() {
const [viewerInstance, setViewerInstance] = useState(null);

return (
<AutodeskViewer
onViewerInitialized={({ viewer }) => {
setViewerInstance(viewer);
viewer.setTheme("dark-theme");
}}
isAvatarsEnabled={false}
isLaserEnabled={false}
modelUrn="<modelURN>"
clientId="<clientID>"
clientSecret="<clientSecret>"
/>
);
}

export default Room;

Properties

NameTypeDescription
modelUrnstringRequired. Your translated design file is identified with the URN of the seed and will look something like urn:adsk.objects:os.object:031adb62-49cc-481a-8fde-b878e43fd956/1683202300280-031adb62-49cc-481a-8fde-b8282e43fd956.ifc
clientIdstringRequired. Autodesk APS client ID
clientSecretstringRequired. Autodesk APS client Secret
initializeOptionsobjectOptional. The options for initializing the viewer, excluding accessToken
isAvatarsEnabledbooleanOptional. Defines whether avatars should be enabled or not.

Default value: true
isLaserEnabledbooleanOptional. Defines whether laser pointers should be enabled or not.
If isAvatarsEnabled is set to false, then isLaserEnabled will also be false.

Default value: true
isNameEnabledbooleanOptional. Defines whether the name above the avatars should be enabled or not.

Default value: true
isMouseEnabledbooleanOptional. Defines whether Mouse pointers should be enabled or not.

Default value: true
avatarConfigAvatarConfigOptional. The configuration object for the avatar. See the AvatarConfig section for more details.

The minimum Autodesk Platform Services Viewer version required is version 7.

Events

onViewerInitialized

Type: (ViewerInitializedParams) => void

A callback function is called when the viewer is initialized. Receives a ViewerInitializedParams parameter.

onDocumentLoadSuccess

Type: (Document) => void

A callback function that is called when a document is successfully loaded. Receives a Document parameter

onDocumentLoadError

Type: (error) => void

A callback function that is called when a document fails to load. Receives an errorCode, errorMsg, and messages parameters

useAutodesk Hook

follow

Type: (participantId?: string) => void

When called with a participant ID as an argument, this function enables other participants to follow the specified participant in the Autodesk viewer. If no ID is provided, the follow feature is disabled.

Example:


function Room() {
const { follow } = useAutodesk();

function followUser() {
follow('participant-id');
};

function unFollow() {
follow();
};

return (
<>
<button onClick={followUser}>Follow user</button>
<button onClick={unFollow}>Unfollow</button>
</>
)
}

goto

Type: (participantId: string) => void

When invoked with a participant ID as an argument, this function allows other participants to instantly navigate to the specified participant's position in the 3D space, enabling easy and quick location of participants.

Example:


function Room() {
const { goTo } = useAutodesk();

function goToUser() {
goTo('participant-id');
};

return (
<>
<button onClick={goToUser}>Go to user</button>
</>
)
}

Types Definition

AvatarConfig

Type: object

An object describing the configuration for avatar, like scale, position, and laser configuration.

NameTypeDescription
heightnumberRequired. >The height you want your avatar to be positioned from the ground, in pixels.
scalenumberRequired. The scale you want your avatar to be rendered, in percent 0 to 1.
laserOriginnumberRequired. The origin position of your laser beam in relation to your avatar model.

Example:

avatarConfig: {
height: 1.6,
scale: 1,
laserOrigin: {
x: 0,
y: 0,
z: 0
}
}

Position

Type: object

Represents the origin position of your laser beam in relation to your avatar model.

NameTypeDescription
xnumberRequired. Represents the x-axis (horizontal) position.
ynumberRequired. Represents the y-axis (vertical) position.
znumberRequired. Represents the z-axis (depth) position.

Example:

laserOrigin: {
x: 0,
y: 0,
z: 0
}