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:
- Using the auto-rotate parameter you can define whether your model should automatically rotate or not.
- Using the camera-orbit parameter you can define how the camera is positioned with respect to your model.
- Using the camera-target parameter you can define the point the camera orbits around.
- Using the hotspot-focus parameters you can define whether the camera should focus on hotspots when they are clicked.
- Using the ar-placement parameter you can define whether your model is placed on the wall or on the ground.
- Using the min-camera-orbit parameter you can define how far the camera can be positioned with respect to your model.
- Using the max-camera-orbit parameter you can define how far the camera can be positioned with respect to your model.
- Using the disable-zoom parameter you can define whether you can zoom in/out or not.
- Using the disable-tap parameter you can define whether you can tap to ‘recenter camera position’.
- 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.
Parameter | Supported values | Default value |
---|---|---|
auto-rotate | 1 (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:
- The horizontal position.
- The vertical position.
- The zoom percentage.
Parameter | Supported values | Default value |
---|---|---|
auto-rotate | -20deg auto auto | |
Horizontal position | degrees (deg )or auto | -20deg |
Vertical position | degrees (deg )or auto | auto |
Zoom percentage | percentage (% )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:
- The horizontal position.
- The vertical position.
- The depth position.
Parameter | Supported values | Default value |
---|---|---|
camera-target | auto auto auto | |
Horizontal position | millimeter (mm )or centimeter ( cm )or meter ( m )or auto | auto |
Vertical position | millimeter (mm )or centimeter ( cm )or meter ( m )or auto | auto |
Depth percentage | millimeter (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.
Parameter | Supported values | Default value |
---|---|---|
hotspot-focus | 1 (on) or 0 (off) | Set in CMS |
customize-hotspot-focus | 1 (on) or 0 (off) | Set in CMS |
information-hotspot-focus | 1 (on) or 0 (off) | Set in CMS |
animation-hotspot-focus | 1 (on) or 0 (off) | Set in CMS |
Example
<iframe
src="https://vulp.studio/foxmountain/armchair/en-US?hotspot-focus=1&hotspot-button=1&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&hotspot-button=1&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&hotspot-button=1&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&hotspot-button=1&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.
Parameter | Supported values | Default value |
---|---|---|
ar-placement | floor or wall | Set 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.
min-camera-orbit
.Values
The value consists of three parts:
- Counterclockwise limit.
- Top-down limit.
- Zoom-in limit.
Parameter | Supported values | Default value |
---|---|---|
min-camera-orbit | Set in CMS | |
Counterclockwise limit | degrees (deg )or auto | |
Top-down limit | degrees (deg )or* auto | |
Zoom-in | percentage (% )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.
max-camera-orbit
.Values
The value consists of three parts:
- Clockwise limit.
- Bottom-up limit.
- Zoom-out limit.
Parameter | Supported values | Default value |
---|---|---|
max-camera-orbit | Set in CMS | |
Clockwise limit | degrees (deg )or auto | |
Bottom-up limit | degrees (deg )or auto | |
Zoom-out | percentage (% )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.
Parameter | Supported values | Default value |
---|---|---|
disable-zoom | 1 (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’.
Parameter | Supported values | Default value |
---|---|---|
disable-tap | 1 (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.
Parameter | Supported values | Default value |
---|---|---|
ar-scale | fixed (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>