# SettingsPlugin

API Documentation

This plugin does nothing on it's own but is required by other plugins.

This plugin is available in the core photo-sphere-viewer package in dist/plugins/settings.js and dist/plugins/settings.css.

# Usage

Once enabled the plugin will add a new "Settings" button which other plugins cas use to display various settings in the side panel.

const viewer = new PhotoSphereViewer.Viewer({
  plugins: [

# Example

The following example manually adds two settings.

# Adding a setting

Registering a new setting is done by calling the addSetting on the plugin. There are currently two types of setting.

# Toggle setting

This a setting which has only two values : true and false. It is required to provide the active(): boolean and toggle(): void functions.

  id    : 'custom-toggle-setting',
  label : 'Toggle setting',
  type  : 'toggle',
  active: () => enabled,
  toggle: () => enabled = !enabled,

# Options setting

This is a setting which has multiple available values (or options). It is required to provide the current(): string, options(): Options[] and apply(option: string): void functions.

  id     : 'custom-options-setting',
  label  : 'Options setting',
  type   : 'options',
  options: () => ([
    { id: 'option-a', label: 'Option A' },
    { id: 'option-b', label: 'Option B' },
  current: () => currentOption,
  apply  : (option) => currentOption = option,

# Configuration

# lang

  • type: object
  • default:
lang: {
    settings : 'Settings',

Note: this option is not part of the plugin but is merged with the main lang object.