Developer

Appearance

Objects

rooomProducts Viewer API object manipulation for 3D product models. Control product components, parts visibility, transformations, and interactive product elements.

getNodeList ​

getNodeList(callback: Function)

Returns a flattened list of nodes in the scene.

js
api.getNodeList(function (nodes) {
  console.log(nodes);
});

show ​

show(nodeId: string, [callback: Function])

Shows a node. The nodeId is the ID of the node, which can be found via getNodeList.

js
api.show('NODE_ID', function () {
  console.log('Node shown');
});

hide ​

hide(nodeId: string, [callback: Function])

Hides a node. The nodeId is the ID of the node, which can be found via getNodeList.

js
api.hide('NODE_ID', function () {
  console.log('Node hidden');
});

setOpacity ​

setOpacity(nodeId: string, opacity: number, [callback: Function])

Sets the opacity of a node. The nodeId is the ID of the node, which can be found via getNodeList. The opacity is a number between 0 and 1.

TIP

Changing opacity does not work on instances.

js
api.setOpacity('NODE_ID', 0.25, function () {
  console.log('Node opacity changed');
});

getOpacity ​

getOpacity(nodeId: string, [callback: Function])

Returns the opacity of a node. The nodeId is the ID of the node, which can be found via getNodeList.

js
api.getOpacity('NODE_ID', function (opacity) {
  console.log(opacity);
});

remove ​

remove(nodeId: string, [callback: Function])

Delete a node. The nodeId is the ID of the node, which can be found via getNodeList.

js
api.remove('NODE_ID', function () {
  console.log('Node removed');
});

translate ​

translate(nodeId: string, newPosition: [x: number, y: number, z: number], [options: Object], [callback: Function])

Translates a node. The nodeId is the ID of the node, which can be found via getNodeList.

The options parameter: duration the duration of the translation animation (a number, in seconds; 0 by default)

js
api.translate('NODE_ID', [1, 1, 1], { duration: 1.0 }, function () {
  console.log('Node translated');
});

rotate ​

rotate(nodeId: string, newRotation: [degrees: number, x: number, y: number, z: number], [options: Object], [callback: Function])

Rotates a node. The nodeId is the ID of the node, which can be found via getNodeList.

newRotation: an array containing [degrees, axisX, axisY, axisZ].

The options parameter: duration the duration of the rotation animation (a number, in seconds; 0 by default)

js
api.rotate('NODE_ID', [180, 1, 0, 0], { duration: 1.0 }, function () {
  console.log('Node rotated');
});

getTransform ​

getTransform(nodeId: string, callback: Function)

Gets the transform of a node. The nodeId is the ID of the node, which can be found via getNodeList.

js
api.getTransform('NODE_ID', function ({ position, rotation, scaling }) {
  console.log(position); // { x: 0, y: 0, z: 0 }
  console.log(rotation); // { x: 0, y: 0, z: 0 }
  console.log(scaling);  // { x: 1, y: 1, z: 1 }
});

pickFromScreen ​

pickFromScreen(position2D: [x: number, y: number], [callback: Function])

Returns information about the world position of the first hit (intersection) at a given screen coordinate.

js
api.pickFromScreen([100, 100], function (info) {
  console.log(info.position3D, info.id, info.name);
});

exportGLB ​

exportGLB(options: { scaling?: number, usdzCompat?: boolean }, callback: Function)

Exports the object without the skybox and shadowplane as an blob-string in gltf-binary. options: is the object with different export options for GLB object. options.scale: defines node scaling for export (1 by default). options.usdzCompat: prepares the glb file so that it can be converted to usdz. takes into account usdz limitations, such as no support for second uv map. (false by default)

js
api.exportGLB({ scaling: 1 }, function (blob) {
  downloadBlob(blob, "mesh.glb"); // pseudo-code
});

getHighlight ​

getHighlight(nodeId: string, callback: Function)

Returns the highlight settings from object in the scene. The nodeId is the ID of the node, which can be found via getNodeList.

Result: alpha, color and enabled

js
api.getHighlight('NODE_ID', function (highlight) {
  console.log(highlight.alpha);   // Result: 0.4
  console.log(highlight.color);   // Result: #ffd700
  console.log(highlight.enabled); // Result: true
});

setHighlight ​

setHighlight(nodeId: string, options: Object, [callback: Function])

Set the highlight settings on an object in the scene. The nodeId is the ID of the node, which can be found via getNodeList.

Options: alpha, color and enabled

js
api.setHighlight(
  'NODE_ID',
  { enabled: true, alpha: 0.4, color: '#ffd700' },
  function () {
    console.log('Highlight set');
  }
);

setTransform ​

setTransform(nodeId: string, transform: object, [callback: Function])

Sets the transform properties (position, rotation, scale) of a product component. The nodeId is the ID of the node, which can be found via getNodeList.

The transform object can contain:

  • position - Array [x, y, z]
  • rotation - Array [x, y, z] in radians
  • scale - Array [x, y, z]
js
api.setTransform('NODE_ID', {
  position: [0, 0, 0.5],
  rotation: [0, Math.PI / 4, 0],
  scale: [1, 1, 1]
}, function() {
  console.log('Transform updated');
});

getTransformNodes ​

getTransformNodes(type: string, [callback: Function])

Returns a list of all transform nodes in the scene with their current transform data. The type parameter filters by node type: 'mesh', 'transformNode', 'bone', or 'all' (default).

js
api.getTransformNodes('mesh', function(nodes) {
  console.log(nodes);
});

duplicateNode ​

duplicateNode(nodeId: string, [options: object], [callback: Function])

Duplicates a node. The nodeId is the ID of the node, which can be found via getNodeList.

Options:

  • transform - Transform object with position, rotation, scale
  • instance - true for instance (shares geometry), false for full clone
  • materialId - ID of a material to apply
  • name - Custom name for the duplicated node
js
api.duplicateNode('NODE_ID', {
  transform: { position: [0, 0.5, 0] }
}, function(result) {
  console.log(result.id);
});

setNodeMaterial ​

setNodeMaterial(nodeId: string, materialId: string, [callback: Function])

Assigns an existing material to a node. The nodeId is the ID of the node, which can be found via getNodeList. The materialId can be found via getMaterials.

js
api.setNodeMaterial('NODE_ID', 'MATERIAL_ID', function(success) {
  console.log(success);
});

setScaleWithUVTiling ​

setScaleWithUVTiling(nodeId: string, scale: [number, number, number], [callback: Function])

Scales a mesh while preserving texture tiling so textures tile instead of stretching. The nodeId is the ID of the node, which can be found via getNodeList.

js
api.setScaleWithUVTiling('NODE_ID', [1.5, 1, 1.5], function(success) {
  console.log(success);
});

getSkeletons ​

getSkeletons([callback: Function])

Returns a list of all skeletons in the scene with their bone hierarchies.

js
api.getSkeletons(function(skeletons) {
  console.log(skeletons);
});

getBoneTransform ​

getBoneTransform(skeletonId: string, boneName: string, [callback: Function])

Returns the transform data of a specific bone within a skeleton. The skeletonId is the ID of the skeleton and boneName is the name of the bone.

js
api.getBoneTransform('SKELETON_ID', 'BONE_NAME', function(bone) {
  if (bone) {
    console.log(bone.position);
    console.log(bone.rotation);
  }
});

setBoneTransform ​

setBoneTransform(skeletonId: string, boneName: string, transform: object, [callback: Function])

Sets the transform properties of a specific bone within a skeleton. The skeletonId is the ID of the skeleton, boneName is the name of the bone, and transform is an object with position, rotation, and scale properties.

js
api.setBoneTransform('SKELETON_ID', 'BONE_NAME', {
  rotation: [0, 0, Math.PI / 3]
}, function(success) {
  console.log(success);
});