Getting started

System Requirements

Rendering

Vectary Dashboard

Account Settings

Roles

User Interface

Scene Orientation

Units

How To Get Help

Importing

Import formats

Figma frames import

CAD files

Processor

Design process

Design mode

Materials and Textures

Animated Materials

Decals

UV mapping

Camera

Lighting and Environment

Effects

Background

Ground plane

Control Bar

Libraries

Edit mode

3D Configurator

Variants

Interactions

Animations

Floating UI

Hotspots

Variables & Expressions (Beta)

Scene and project settings

Version History

Augmented Reality (WebAR)

WebXR (beta)

Loading screen

Mouse controls

Interaction prompt

Menu - Settings

Sharing, exporting, embedding

Sharing

Performance analyzer

Optimizing a shared project

Project cloning

Embedding to other software

Export options

Other

Figma Plugin - Vectary 3D Studio Lite

2D to 3D

Adding comments

Object Editing

Left bar

Shortcuts

Model API

Introduction

Quick Start

Events & Listeners

Floating UI Configurators

Ecommerce

Quick Start

How to start using our API on one of the embedded models on your site

The Basics

The easiest way to start using our API is to import it as a module and create an instance while passing the DOM id of the iframe (web component coming soon ⏳).

Wait for it to be initialized and from there on, you are all set.

If you have more models to connect to, you will need to create a new instance of the API for each one of them.

https://codesandbox.io/embed/init-00jr7l?autoresize=1&expanddevtools=1&fontsize=14&hidenavigation=1&theme=dark&codemirror=1

Async Methods

Since the API needs to connect to an iframe, all the methods go through ****PostMessage events - because of that they all return as a Promise.

Errors

Since we are returning promises, any errors that might happen when running any of the methods will trigger the rejection of the promise with the following format:

{
    status: "error",
    error?: string
}

init

Initializes the API instance connecting to the model.

init(): Promise<void>

Usage:

await modelApi.init();