Type Definitions

Getting started

System Requirements

Importing

Design process

Materials and Textures

Lighting and Environment

3D Configurator

Scene and project settings

Version History

Augmented Reality (WebAR)

Sharing, exporting, embedding

Performance analyzer

Optimizing a shared project

Project cloning

Embedding to other software

Export options

Other

Figma Plugin - Vectary 3D Studio Lite

Model API

Floating UI Configurators

Ecommerce

Type Definitions

Init

ProjectInfo

type ProjectInfo {
	projectName: string;
	modelId: string;
	modelIdBase62: string;
	publishedId: string;
	workspaceId: string;
};

EventListeners

Api Events

enum ApiEvents 
	INTERACTION_CUSTOM_EVENT = "{custom_event_name}",
	MOUSE_MOVE = "mouse_move",
	MOUSE_DRAG = 'mouse_drag',
	MOUSE_DOWN = "mouse_down",
	MOUSE_UP = 'mouse_up',
	MOUSE_CLICK = "mouse_click",
	MOUSE_WHEEL = 'mouse_wheel',
	KEY_DOWN = 'key_down',
	HOVERED_OBJECT = 'hovered_object',
	CONFIGURATOR_STATE_CHANGE = "configurator_state_change",
	SELECTION_STATE_CHANGE = "configurator_state_change",
}

Event Responses

`{custom_event_name}`

Custom events need to be setup directly in studio.

return string | number | boolean | void

`configurator_state_change`

return ConfigurationState[]

Configurators

ConfigurationState

type ConfigurationState = VariantSwitcherData | MaterialSwitcherData;

VariantSwitcherData

type VariantSwitcherData {
	variant: string;
	active_object: string;
};

MaterialSwitcherData

type MaterialSwitcherData {
	object: string;
	active_material: string;
};

Math

Vector3

type Vector3 = {
	x: number;
	y: number;
	z: number;
};

Euler

type Euler = Vector3 & {
	order?: string // default: 'XYZ'
};

Ray

type Ray = {
	start: Vector3;
	direction: Vector3;
};

RayObjectHit

type RayObjectHit = {
	id: string;
	name: string;
	position: Vector3;
	normal: Vector3;
	uv: Vector3;
};

Objects

Object

type Object = {
		id: string;
		name: string;
		type: sceneObjects;
		position: Vector3;
		rotation: Euler;
		scale: Vector3;
		materials?: Material[];
		primitive?: PrimitiveNodeSettings;
		text3d?: Text3DNodeSettings;
};

‣

SceneObjects

Primitives

PrimitiveNodeSettings

type PrimitiveNodeSettings =
	| PrimitiveBoxSettings
	| PrimitiveConeSettings
	| PrimitiveCylinderSettings
	| PrimitivePolyhedronSettings
	| PrimitiveSphereSettings
	| PrimitiveTorusSettings
	| PrimitiveTubeSettings
	| PrimitiveCapsuleSettings
	| PrimitiveSquarePlaneSettings
	| PrimitiveCirclePlaneSettings
	| PrimitiveInfinitePlaneSettings;

PrimitiveBoxSettings

type PrimitiveBoxSettings = {
	boxDimensions: {
		x: number;
		y: number;
		z: number;
	};
	boxSegments: {
		x: number;
		y: number;
		z: number;
	};
	roundnessEnabled: boolean;
	roundnessRadius: number;
	roundnessRadiusSegments: number;
	computeNormals: boolean;
}

PrimitiveConeSettings

type PrimitiveConeSettings = {
	coneRadiusBottom: number;
	coneHeight: number;
	coneRadiusSegments: number;
	coneHeightSegments: number;
	coneCloseEnds: boolean;
	roundnessEnabled: boolean;
	roundnessRadius: number;
	roundnessRadiusSegments: number;
	computeNormals: boolean;
}

PrimitiveCylinderSettings

type PrimitiveCylinderSettings = {
	cylinderRadiusTop: number;
	cylinderRadiusBottom: number;
	cylinderHeight: number;
	cylinderRadiusSegments: number;
	cylinderHeightSegments: number;
	cylinderCapSegments: number;
	cylinderCloseEnds: boolean;
	roundnessEnabled: boolean;
	roundnessRadius: number;
	roundnessRadiusSegments: number;
	computeNormals: boolean;
}

PrimitivePolyhedronSettings

type PrimitivePolyhedronSettings = {
	polyhedronRadius: number;
	polyhedronDetail: number;
	computeNormals: boolean;
}

PrimitiveSphereSettings

type PrimitiveSphereSettings = {
	sphereRadius: number;
	sphereWidthSegments: number;
	sphereHeightSegments: number;
	computeNormals: boolean;
}

PrimitiveTorusSettings

type PrimitiveTorusSettings = {
	torusRingRadius: number;
	torusTubeRadius: number;
	torusTubeSegments: number;
	torusRingSegments: number;
	computeNormals: boolean;
}

PrimitiveTubeSettings

type PrimitiveTubeSettings = {
	tubeRadiusIn: number;
	tubeRadiusOut: number;
	tubeHeight: number;
	tubeRadiusSegments: number;
	tubeHeightSegments: number;
	tubeSideSegments: number;
	roundnessEnabled: boolean;
	roundnessRadius: number;
	roundnessRadiusSegments: number;
	computeNormals: boolean;
}

PrimitiveSquarePlaneSettings

type PrimitiveSquarePlaneSettings = {
	width: number;
	depth: number;
	widthSegments: number;
	depthSegments: number;
	cropSettings: {
		x: number;
		y: number;
		width: number;
		height: number;
	};
	roundnessEnabled: boolean;
	roundnessRadius: number;
	roundnessRadiusSegments: number;
	computeNormals: boolean;
}

PrimitiveInfinitePlaneSettings

type PrimitiveInfinitePlaneSettings = {
	dimensions: { x: number; y: number; z: number };
	offset: number;
	angle: number;
	segments: number;
	computeNormals: boolean;
}

Text3D

export type Text3DNodeSettings = {
	text?: string;
	fontFamily?: string;
	fontSize?: number;
	weight?: string;
	distanceX?: number;
	distanceY?: number;
	textAlign?: 'LEFT' | 'CENTER' | 'RIGHT' | 'JUSTIFY';
	textHeight?: 'DEFAULT' | 'CAMELCASE' | 'UPPERCASE' | 'LOWERCASE';
	curveSegments?: number;
	contourOffset?: number;
	amount?: number;
};

Materials

Material

type Material = {
	id?: string;
	name: string;

	baseColor?: {
		textureConfig?: TextureConfig;
		color?: Vector3;
	};
	roughness?: {
		textureConfig?: TextureConfig;
		value?: number;
	};
	metalness?: {
		textureConfig?: TextureConfig;
		value?: number;
	};
	emission?: {
		textureConfig?: TextureConfig;
		color?: Vector3;
		value?: number;
	};
	normal?: {
		textureConfig?: TextureConfig;
		value?: number;
	};
	opacity?: {
		textureConfig?: TextureConfig;
		value?: number;
		alphaMode?: AlphaMode;
		alphaCutoff?: number;
	};
	doubleSided?: boolean;
	clearcoat?: {
		amount?: number;
		reflectivity?: number;
		roughness?: number;
	};
	refraction: {
		amount?: number;
		IOR?: number;
		absorptionDepth?: number;
		absorptionColor?: Vector3;
		thicknessTextureConfig?: TextureConfig;
		thicknessValue?: number;
	};
	subsurface?: {
		amount?: number;
		color?: Vector3;
		radius?: number;
	};
	iridescence?: {
		textureConfig?: TextureConfig;
		value?: number;
	};
	reflectivity?: {
		textureConfig?: TextureConfig;
		value?: number;
	};
	baked?: {
		ambientOcclusion?: {
			textureConfig?: TextureConfig;
			value?: number;
		};
		lightmap: {
			textureConfig?: TextureConfig;
			value?: number;
		};
	};
	globalMapping?: TextureMapSettings;
};

‣

AlphaMode

Textures

TextureConfig

type TextureConfig<T> = {
	id?: string;
	name?: string;
	filters?: TextureFilterSettings;
	mapping?: TextureMapSettings;
	wrapping?: WrapMode;
};

‣

TextureFilterSettings

‣

TextureMapSettings

‣

WrapMode

TextureData

type TextureData = {
	image: ArrayBuffer;
	width: number;
	height: number;
};

Cameras

CameraSettings

type CameraSettings = {
	cameraType?: CameraType;
	previewControls?: {
		orbitLimits?: {
			upLimit?: number;
			downLimit?: number;
			leftLimit?: number;
			rightLimit?: number;
		};
		dollyLimits?: {
			inLimit?: number;
			outLimit?: number;
		};
		panLimits?: {
			enabled?: boolean;
		};
	};
	previewTurntable?: {
		delay?: number;
		duration?: number;
		resume?: boolean;
		easing?: number;
	};
	perspective?: {
		fov?: number;
	};
	depthOfField?: {
		intensity?: number;
		depthOffset?: number;
	};
	aspectRatio?: {
		customWidth?: number;
		customHeight?: number;
	};
};

CameraType

enum CameraType {
    UNKNOWN = 0,
    PERSPECTIVE = 1,
    ORTHOGRAPHIC = 2,
}

CameraViewState

type CameraViewState = {
	target: Vector3;
	position: Vector3;
	upVector: Vector3;
};

Exports

Export3dFormats

enum Export3DFormats {
	OBJ = 'OBJ',
	GLTF = 'GLTF',
	GLB = 'GLB',
	DAE = 'DAE',
	USDZ = 'USDZ',
	FBX = 'FBX',
	STL = 'STL',
}

ExportOptions

type ExportOptions = {
	fbx?: 'ASCII' | 'Binary';
	applyParentMatrix?: boolean;
	exportOnlyUsedUVs?: boolean;
};