Model3DViewer
New in Tiki30, Model3DViewer is a Tiki plugin for displaying interactive 3D models directly on wiki pages, trackers, and other Tiki content. It supports multiple formats (.glb, .gltf, .stl, .obj, .fbx, .dae, .ply, .3ds, .vrml, .x3d) using Three.js for rendering. Features include camera controls, auto-rotation, lighting presets, shadows, and animation support.

Parameters

Display one or more custom-formatted 3D models
Introduced in Tiki 30. Required parameters are in bold.
Go to the source code
Preferences required: wikiplugin_model3dviewer

Parameters	Accepted Values	Description	Default	Since
`type`	(blank) fileId src	Choose where to get the 3D model from		30.0
`src`	url	Full URL to the 3D Model to display.		30.0
`fileId`		Numeric ID of a 3D model in a file gallery (or a comma- or `\|`-separated list of IDs).		30.0
`camera_position`	text	Optional camera position for 3D viewer, as X,Y,Z coordinates (e.g. "0,1,5"). Only for supported viewers.		30.0
`desc`	text	Image caption. Use `name` or `desc` or `namedesc` for Tiki name and description properties, `idesc` or `ititle` for metadata from the image itself, otherwise enter your own description.		30.0
`height`	text	Height in pixels or percent. Syntax: `100` or `100px` means 100 pixels; `50%` means 50 percent. Default is 400px.	400px	30.0
`width`	text	Width in pixels or percent. Syntax: `100` or `100px` means 100 pixels; `50%` means 50 percent. Default is 100%.	100	30.0
`backgroundColor`	text	Hex background color for the viewer (e.g., "#ffffff"). Leave blank for transparent.		30.0
`autorotate`	y n	Enable or disable auto-rotation of the 3D model. Supported by some viewers.	n	30.0
`autoplay`	y n	Automatically start animation on model load if any.	n	30.0
`camera_type`	perspective orthographic	Type of camera to use , Perspective mimics human eye, Orthographic is a parallel projection.	Perspective	30.0
`controls`	y n	Allow mouse/touch camera control (orbit, zoom).	y	30.0
`shadow`	y n	Render model shadows (if supported by viewer).	n	30.0
`light_type`	default studio rembrandt portrait soft	Lighting mode (e.g., "soft", "rembrandt"). Applies mainly to Model Viewer.		30.0
`animation_loop`	y n	Enable or disable looping of the animation.	n	30.0
`exposure`	float	Adjust scene brightness. Applies to some 3D viewers.	1.0	30.0

Why Choose Model3DViewer?

Instead of static images or screenshots?
- Fully interactive—users can inspect the model from any angle
- No need for multiple rendered views; one model shows everything
- Enables understanding of spatial relationships and mechanics
Instead of external 3D hosting services?
- Data stays within your Tiki installation (when using file galleries)
- Respects Tiki's permission system and access controls
- No tracking, ads, or dependency on third‑party uptime
- Seamless integration with wiki pages, trackers, and articles

Since which version?

Plugin available since Tiki 30.0
Unified and documented support for fileId and src
Integration with File Galleries and permissions

Instead of File Gallery downloads only?
- Instant preview without downloading the file
- Web-optimised rendering with adaptive controls

click to enlarge

The Model3DViewer plugin brings professional 3D visualisation capabilities directly into your wiki. Whether you're showcasing products, teaching complex concepts, or documenting technical designs, this plugin transforms static content into interactive experiences.

Powered by the industry‑standard Three.js WebGL engine, it handles models from simple STL files for 3D printing to complex GLB scenes with animations and materials. The viewer is fully responsive, works on mobile devices, and integrates seamlessly with Tiki's existing file gallery and permission systems.

Unlike external 3D services, your models remain under your control—hosted in your file galleries, protected by your permission rules, and presented in your site's design.

Quick Start Guide

Upload a 3D model to your File Gallery
Note the File ID shown in the gallery
Embed it with minimal code:

Copy to clipboard

 Plugin disabled
Plugin model3dviewer cannot be executed.

Adjust `height` and `width` as needed

Control the initial view:

Copy to clipboard

 Plugin disabled
Plugin model3dviewer cannot be executed.

Set lighting and atmosphere:

Copy to clipboard

 Plugin disabled
Plugin model3dviewer cannot be executed.

Enable auto‑rotation:

Copy to clipboard

 Plugin disabled
Plugin model3dviewer cannot be executed.

For animated models (GLB/GLTF):

Copy to clipboard

 Plugin disabled
Plugin model3dviewer cannot be executed.

Control playback:
- `autoplay="y"` – starts animation immediately
- `animation_loop="y"` – repeats animation
- Some formats don't support animation

Create a tracker field of type **3D Model Viewer**
Choose input mode: `local` (file gallery), `external` (URL), or `both`
Each tracker item can display attached 3D models
Field respects tracker‑item permissions

Parameters Reference

Parameter	Required	Description	Default	Since
type	Yes	3D Model Source. Choose where to get the 3D model from. Options: "fileId" (from file galleries) or "src" (external URL)	(none)	29.0
fileId	Yes (if type="fileId")	Numeric ID of a 3D model in a file gallery (or comma/pipe-separated list of IDs)	(none)	29.0
src	Yes (if type="src")	Full URL to the 3D Model to display	(none)	28.0
camera_position	No	Optional camera position for 3D viewer, as X,Y,Z coordinates (e.g. "0,1,5")	(empty)	29.0
camera_type	No	Type of camera to use. Options: "perspective" (human eye-like) or "orthographic" (parallel projection)	"perspective"	29.0
autorotate	No	Enable or disable auto-rotation of the 3D model	"n"	29.0
backgroundColor	No	Hex background color for the viewer (e.g., "#ffffff"). Leave blank for transparent	(empty)	29.0
height	No	Height in pixels or percent. Syntax: "100" or "100px" means 100 pixels; "50%" means 50 percent	"400px"	29.0
width	No	Width in pixels or percent. Syntax: "100" or "100px" means 100 pixels; "50%" means 50 percent	"100%"	29.0
desc	No	Image caption. Use "name" or "desc" or "namedesc" for Tiki name and description properties, "idesc" or "ititle" for metadata from the image itself, otherwise enter your own description	(empty)	29.0
controls	No	Allow mouse/touch camera control (orbit, zoom)	"y"	29.0
shadow	No	Render model shadows (if supported by viewer)	"n"	29.0
light_type	No	Lighting mode. Options: "default", "studio", "rembrandt", "portrait", "soft"	"default"	29.0
exposure	No	Adjust scene brightness. Applies to some 3D viewers. Range: 0.1 to 5.0	"1.0"	29.0
autoplay	No	Automatically start animation on model load if any	"n"	29.0
animation_loop	No	Enable or disable looping of the animation	"n"	29.0

Feature Showcase: Complete Example

This example shows all major features in one viewer. Copy and adapt for your own use.

Professional product showcase

Copy to clipboard

{model3dviewer
  type="fileId"
  fileId="789"
  autorotate="y"
  camera_position="2,2,8"
  camera_type="perspective"
  height="500px"
  width="90%"
  backgroundColor="#1a1a2e"
  controls="y"
  shadow="y"
  light_type="rembrandt"
  exposure="1.3"
  autoplay="y"
  animation_loop="y"
  desc="Engineering Prototype v2.3 - Interactive 3D Model"
}

Pro Tip: Use `camera_type="orthographic"` for technical drawings and CAD models where perspective distortion is unwanted.

Permissions & Security

Permission	Purpose
tiki_p_download_files	Required to view models from file galleries
tiki_p_upload_files	Required to upload models to galleries
tiki_p_admin_wiki	Required to edit pages containing the plugin
Plugin-specific permissions	Control who can use the plugin (Admin → Plugins)
Tracker item permissions	Control access to tracker fields with 3D models

Security Note: External URLs (`src` parameter) are sanitized to block `javascript:` and other potentially malicious schemes. For maximum security, host models in your Tiki file galleries when possible.

Troubleshooting Guide

Check the browser console (F12 → Console) for JavaScript errors
Verify file permissions – user needs `tiki_p_download_files`
Test the URL directly – for external sources, ensure CORS headers allow embedding
Clear Tiki caches – Admin → System → Clear all caches

Optimize your 3D model – reduce polygon count, compress textures
Use GLB format – most efficient for web delivery
Limit multiple viewers – consider carousel for many models
Check file size – models over 50MB may load slowly

Ensure format supports animation – GLB/GLTF work best
Verify animation data exists – some models are static
Check `autoplay="y"` parameter
Try different browsers – WebGL implementation varies

Supported formats: .glb, .gltf, .stl, .obj, .fbx, .dae, .ply, .3ds, .vrml, .x3d
Convert unsupported formats – use Blender or online converters
Check MIME type – file gallery may misidentify some 3D formats

Format Comparison Guide

Format	Best For	Limitations	Animation
.glb / .gltf	Web display, animations	—	✓ Excellent
.stl	3D printing, simple models	No colors/textures	✗ None
.obj	Compatibility, materials	Needs separate .mtl file	✗ Limited
.fbx	Game assets, complex scenes	May need conversion	✓ Good
.dae (Collada)	CAD exchange, archiving	Large file size	✓ Yes
.ply	3D scanning, point clouds	Limited material support	✗ None

Recommendation: Use **GLB format** for web display whenever possible. It's compact, supports animations and materials, and loads fastest in browsers.

Real-World Examples

Product Catalog
* Interactive product exploration
* 360° view of items
* Technical specifications overlay
* Customer can inspect before purchase

Education & Training
* Anatomical models for medicine
* Engineering part disassembly
* Architectural walkthroughs
* Historical artifact examination

Technical Documentation
* Assembly instructions
* Maintenance procedures
* Exploded views
* Measurement tools (via annotations)

Community Projects
* 3D printing file sharing
* Game mod development
* Open‑source hardware
* Collaborative design review

Advanced Configuration

theme_model3dviewer_default_background

Default
This version does not contain the plugin yet so we cannot show anything here.

Description: Default background for 3D models. This can be overridden by the backgroundColor parameter in the Model3DViewer plugin.
Example values: #243d40, grey, #ffffff, transparent
Default: #ffffff

Admin → Look & Feel → Themes: set default 3D viewer background

Related Resources

https://threejs.org/ – Three.js library documentation
https://github.com/mrdoob/three.js/ – Three.js GitHub repository
PluginModel3DViewer – Developer documentation
Model3DViewer – Plugin reference
Blender – Free 3D modeling software
Google Model Viewer – Reference for web 3D best practices

FAQ

Q: Can I use Model3DViewer in articles and blogs?
A: Yes! The plugin works anywhere wiki syntax is supported.

Q: Are there file size limits?
A: Limits are set by your PHP configuration (`upload_max_filesize`, `post_max_size`) and web server. For very large models, consider optimization or streaming solutions.

Q: Can I embed multiple viewers on one page?
A: Yes, but performance may suffer with many complex models. Consider a carousel or lazy loading.

Q: Does it work on mobile devices?
A: Yes, with full touch controls (pinch to zoom, drag to rotate).

Q: Can users download the original model files?
A: Only if they have `tiki_p_download_files` permission and the model is from a file gallery.

Aliases

Model3DViewer

Parameters

Why Choose Model3DViewer?

Since which version?

Quick Start Guide

Parameters Reference

Feature Showcase: Complete Example

Permissions & Security

Troubleshooting Guide

Format Comparison Guide

Real-World Examples

Advanced Configuration

theme_model3dviewer_default_background

Related Resources

FAQ

Aliases