Camera

Adjust the camera to get the best look on your model.

Description

There are a couple of parameters which can be used to change the camera:

  1. Using the auto-rotate parameter you can define whether your model should automatically rotate or not.
  2. Using the camera-orbit parameter you can define how the camera is positioned with respect to your model.
  3. Using the camera-target parameter you can define the point the camera orbits around.
  4. Using the hotspot-focus parameters you can define whether the camera should focus on hotspots when they are clicked.
  5. Using the ar-placement parameter you can define whether your model is placed on the wall or on the ground.
  6. Using the min-camera-orbit parameter you can define how far the camera can be positioned with respect to your model.
  7. Using the max-camera-orbit parameter you can define how far the camera can be positioned with respect to your model.
  8. Using the disable-zoom parameter you can define whether you can zoom in/out or not.
  9. Using the disable-tap parameter you can define whether you can tap to ‘recenter camera position’.
  10. Using the ar-scale parameter you can define whether your product is scalable or has a fixed size in Augmented Reality.

Auto rotate

Using the auto-rotate parameter you can define whether your model should automatically rotate or not.

ParameterSupported valuesDefault value
auto-rotate1 (on) and 0 (off).1 (on)

Example

  <iframe
      src="https://vulp.studio/foxmountain/moped/en-US?auto-rotate=0"
      allow="xr-spatial-tracking; fullscreen; web-share; clipboard-write"
      referrerpolicy="no-referrer-when-downgrade"
      width="600"
      height="510"
      frameBorder="0"
      title="Moped - vulp.studio"
  ></iframe>

Camera orbit

Using the camera-orbit you can define how the camera is positioned with respect to your model.

Values

The value consists of three parts:

  1. The horizontal position.
  2. The vertical position.
  3. The zoom percentage.
ParameterSupported valuesDefault value
auto-rotate-20deg auto auto
Horizontal positiondegrees (deg)
or auto
-20deg
Vertical positiondegrees (deg)
or auto
auto
Zoom percentagepercentage (%)
or centimeter (cm)
or millimeter (mm)
or auto
auto

The values can be separated by either spaces or underscores (the latter is recommended).

Example

  <iframe
      src="https://vulp.studio/foxmountain/moped/en-US?camera-orbit=30deg_-80deg_10m"
      allow="xr-spatial-tracking; fullscreen; web-share; clipboard-write"
      referrerpolicy="no-referrer-when-downgrade"
      width="600"
      height="510"
      frameBorder="0"
      title="Moped - vulp.studio"
  ></iframe>

Camera target

Using the camera-target you can define the point the camera orbits around.

Values

The value consists of three parts:

  1. The horizontal position.
  2. The vertical position.
  3. The depth position.
ParameterSupported valuesDefault value
camera-targetauto auto auto
Horizontal positionmillimeter (mm)
or centimeter (cm)
or meter (m)
or auto
auto
Vertical positionmillimeter (mm)
or centimeter (cm)
or meter (m )
or auto
auto
Depth percentagemillimeter (mm)
or centimeter (cm)
or meter (m)
or auto
auto

The values can be separated by either spaces or underscores (the latter is recommended).

Example

  <iframe
      src="https://vulp.studio/foxmountain/moped/en-US?camera-target=10cm_5cm_10cm"
      allow="xr-spatial-tracking; fullscreen; web-share; clipboard-write"
      referrerpolicy="no-referrer-when-downgrade"
      width="600"
      height="510"
      frameBorder="0"
      title="Moped - vulp.studio"
  ></iframe>

Hotspot focus

Using the hotspot-focus parameter you can define whether the camera should focus on hotspots when they are clicked. This parameter applies to all hotspot types unless overridden by specific hotspot focus parameters.

ParameterSupported valuesDefault value
hotspot-focus1 (on) or 0 (off)Set in CMS
customize-hotspot-focus1 (on) or 0 (off)Set in CMS
information-hotspot-focus1 (on) or 0 (off)Set in CMS
animation-hotspot-focus1 (on) or 0 (off)Set in CMS

Example

  <iframe
      src="https://vulp.studio/foxmountain/armchair/en-US?hotspot-focus=1&amp;hotspot-button=1&amp;hotspots=1"
      allow="xr-spatial-tracking; fullscreen; web-share; clipboard-write"
      referrerpolicy="no-referrer-when-downgrade"
      width="600"
      height="510"
      frameBorder="0"
      title="Armchair - vulp.studio"
  ></iframe>

Customize hotspot focus

Using the customize-hotspot-focus parameter you can define whether the camera should focus on customize hotspots when they are clicked. This parameter overrides the general hotspot-focus setting for customize hotspots.

Example

  <iframe
      src="https://vulp.studio/foxmountain/armchair/en-US?customize-hotspot-focus=1&amp;hotspot-button=1&amp;hotspots=1"
      allow="xr-spatial-tracking; fullscreen; web-share; clipboard-write"
      referrerpolicy="no-referrer-when-downgrade"
      width="600"
      height="510"
      frameBorder="0"
      title="Armchair - vulp.studio"
  ></iframe>

Information hotspot focus

Using the information-hotspot-focus parameter you can define whether the camera should focus on information hotspots when they are clicked. This parameter overrides the general hotspot-focus setting for information hotspots.

Example

  <iframe
      src="https://vulp.studio/foxmountain/armchair/en-US?information-hotspot-focus=1&amp;hotspot-button=1&amp;hotspots=1"
      allow="xr-spatial-tracking; fullscreen; web-share; clipboard-write"
      referrerpolicy="no-referrer-when-downgrade"
      width="600"
      height="510"
      frameBorder="0"
      title="Armchair - vulp.studio"
  ></iframe>

Animation hotspot focus

Using the animation-hotspot-focus parameter you can define whether the camera should focus on animation hotspots when they are clicked. This parameter overrides the general hotspot-focus setting for animation hotspots.

Example

  <iframe
      src="https://vulp.studio/foxmountain/armchair/en-US?animation-hotspot-focus=1&amp;hotspot-button=1&amp;hotspots=1"
      allow="xr-spatial-tracking; fullscreen; web-share; clipboard-write"
      referrerpolicy="no-referrer-when-downgrade"
      width="600"
      height="510"
      frameBorder="0"
      title="Armchair - vulp.studio"
  ></iframe>

Placement

Using the ar-placement you can define whether your model is placed on the wall or on the ground. You can see the difference in how the shadow is displayed. When choosing the wall as placement, the user needs to scan the wall in augmented reality mode.

ParameterSupported valuesDefault value
ar-placementfloor or wallSet in CMS

Example

  <iframe
      src="https://vulp.studio/foxmountain/moped/en-US?ar-placement=wall"
      allow="xr-spatial-tracking; fullscreen; web-share; clipboard-write"
      referrerpolicy="no-referrer-when-downgrade"
      width="600"
      height="510"
      frameBorder="0"
      title="Moped - vulp.studio"
  ></iframe>

Min camera orbit

Using the min-camera-orbit you can define how far the camera can be positioned with respect to your model.

Values

The value consists of three parts:

  1. Counterclockwise limit.
  2. Top-down limit.
  3. Zoom-in limit.
ParameterSupported valuesDefault value
min-camera-orbitSet in CMS
Counterclockwise limitdegrees (deg)
or auto
Top-down limitdegrees (deg)
or* auto
Zoom-inpercentage (%)
or centimeter (cm)
or millimeter (mm)
or auto

The values can be separated by either spaces or underscores (the latter is recommended).

Example

  <iframe
      src="https://vulp.studio/foxmountain/moped/en-US?min-camera-orbit=-90deg_-178deg_1mm"
      allow="xr-spatial-tracking; fullscreen; web-share; clipboard-write"
      referrerpolicy="no-referrer-when-downgrade"
      width="600"
      height="510"
      frameBorder="0"
      title="Moped - vulp.studio"
  ></iframe>

Max camera orbit

Using the max-camera-orbit you can define how far the camera can be positioned with respect to your model.

Values

The value consists of three parts:

  1. Clockwise limit.
  2. Bottom-up limit.
  3. Zoom-out limit.
ParameterSupported valuesDefault value
max-camera-orbitSet in CMS
Clockwise limitdegrees (deg)
or auto
Bottom-up limitdegrees (deg)
or auto
Zoom-outpercentage (%)
or centimeter (cm)
or millimeter (mm),
or auto

The values can be separated by either spaces or underscores (the latter is recommended).

Example

  <iframe
      src="https://vulp.studio/foxmountain/moped/en-US?max-camera-orbit=90deg_178deg_1m"
      allow="xr-spatial-tracking; fullscreen; web-share; clipboard-write"
      referrerpolicy="no-referrer-when-downgrade"
      width="600"
      height="510"
      frameBorder="0"
      title="Moped - vulp.studio"
  ></iframe>

Disable zoom

Using the disable-zoom parameter you can define whether you can zoom in/out or not.

ParameterSupported valuesDefault value
disable-zoom1 (on) or 0 (off)1 (on)

Example

  <iframe
      src="https://vulp.studio/foxmountain/moped/en-US?disable-zoom=1"
      allow="xr-spatial-tracking; fullscreen; web-share; clipboard-write"
      referrerpolicy="no-referrer-when-downgrade"
      width="600"
      height="510"
      frameBorder="0"
      title="Moped - vulp.studio"
  ></iframe>

Disable tap

Using the disable-tap parameter you can define whether you can tap to ‘recenter camera position’.

ParameterSupported valuesDefault value
disable-tap1 (on) or 0 (off)1 (on)

Example

  <iframe
      src="https://vulp.studio/foxmountain/moped/en-US?disable-tap=1"
      allow="xr-spatial-tracking; fullscreen; web-share; clipboard-write"
      referrerpolicy="no-referrer-when-downgrade"
      width="600"
      height="510"
      frameBorder="0"
      title="Moped - vulp.studio"
  ></iframe>

AR scale

Using the ar-scale parameter you can define whether your product is scalable or has a fixed size in Augmented Reality.

ParameterSupported valuesDefault value
ar-scalefixed (off) or auto (on)fixed (off)

Example

  <iframe
      src="https://vulp.studio/foxmountain/moped/en-US?ar-scale=auto"
      allow="xr-spatial-tracking; fullscreen; web-share; clipboard-write"
      referrerpolicy="no-referrer-when-downgrade"
      width="600"
      height="510"
      frameBorder="0"
      title="Moped - vulp.studio"
  ></iframe>