Position & Transition

2026-05-25

130 words

1 min

Position

Place the widget at 'bottom-left' (default) or 'bottom-right':

createWidget({
  model: { path: '/models/model.json' },
  position: 'bottom-right',
});

Size

Canvas defaults to 300px. Pass a number for a square, or an object for separate width/height:

// Square 400x400
createWidget({
  model: { path: '/models/model.json' },
  size: 400,
});

// Separate width and height
createWidget({
  model: { path: '/models/model.json' },
  size: { width: 350, height: 500 },
});

Transition Type

The entrance/exit animation can be 'slide' (default) or 'fade':

createWidget({
  model: { path: '/models/model.json' },
  transitionType: 'fade',
  transitionDuration: 1000, // animation duration 1000ms (default 1500)
});

Theme Color

primaryColor tints the menu, status bar, tip bubbles, and other UI elements:

createWidget({
  model: { path: '/models/model.json' },
  primaryColor: 'rgba(255, 130, 130, 0.9)', // pink theme
});