3D Viewer

Read a project’s embed configuration, and persist a configuration of your own between sessions.

What these methods are (and are not)

getViewerEmbedConfig reads the project’s saved camera, lighting and AR settings. getViewerState / setViewerState are a per-project scratchpad you write and read yourself — useful for saving a configuration across sessions or devices. Nothing populates it automatically, so a get before your first set returns an empty default. The SDK does not render, drive or screenshot a running viewer; a live configurator is embedded as a share URL and observed through its viewer events.

Get Embed Config

const config = await client.getViewerEmbedConfig('proj_123');
console.log('Camera:', config.cameraPosition);
console.log('Environment:', config.environmentPreset);
console.log('AR enabled:', config.enableAR);

Get Viewer State

// Returns exactly what you last stored with setViewerState().
const state = await client.getViewerState('proj_123');
console.log(state.selections);

// Never stored anything yet? You get the empty default:
// { loaded: false, selections: {}, visibleBlocks: [],
//   cameraPosition: [0, 2, 5], cameraTarget: [0, 0, 0] }

Set Viewer State

const newState = await client.setViewerState('proj_123', {
  loaded: true,
  selections: {
    dropdownSelections: { 'blk_frame': 'silver' },
    selectMaterialSelections: {},
    checkboxSelections: {},
    toggleSwitchSelections: {},
    carouselSelections: {}
  },
  visibleBlocks: ['blk_001', 'blk_002'],
  cameraPosition: [3, 2, 5],
  cameraTarget: [0, 0.5, 0]
});

Continue reading