Template:ModelViewer: Difference between revisions
No edit summary |
No edit summary |
||
| Line 7: | Line 7: | ||
|src=https://survivalcraft.wiki/content/Models/Bear_Brown.glb | |src=https://survivalcraft.wiki/content/Models/Bear_Brown.glb | ||
|alt=Brown Bear | |alt=Brown Bear | ||
|width= | |width=300px | ||
|height= | |height=300px | ||
|cameraOrbit=165deg 75deg 4m | |cameraOrbit=165deg 75deg 4m | ||
|autoRotate=yes | |||
|cameraControls=yes | |||
|backgroundColor=transparent | |||
|shadowIntensity=1 | |||
|environmentImage=neutral | |||
|exposure=1 | |||
|ar=yes | |||
|autoplay=no | |||
|poster=https://example.com/poster.png | |||
|loading=lazy | |||
}} | }} | ||
</pre> | </pre> | ||
</noinclude> | </noinclude> | ||
<model-viewer | <model-viewer | ||
id="modelViewer-{{PAGENAME}}" | id="modelViewer-{{PAGENAME}}" | ||
| Line 20: | Line 28: | ||
alt="{{{alt|3D model}}}" | alt="{{{alt|3D model}}}" | ||
camera-orbit="{{{cameraOrbit|165deg 75deg 4m}}}" | camera-orbit="{{{cameraOrbit|165deg 75deg 4m}}}" | ||
auto- | style="display: block; width: {{{width|300px}}}; height: {{{height|300px}}}; margin-left: auto; margin-right: auto;" | ||
background-color="{{{backgroundColor|transparent}}}" | |||
background-color="transparent" | shadow-intensity="{{{shadowIntensity|1}}}" | ||
shadow-intensity="1" | environment-image="{{{environmentImage|neutral}}}" | ||
environment-image="neutral" | exposure="{{{exposure|1}}}" | ||
exposure="1" | loading="{{{loading|eager}}}" | ||
poster="{{{poster|}}}" | |||
{{#if:{{{autoRotate|}}}| auto-rotate}} | |||
{{#if:{{{cameraControls|}}}| camera-controls}} | |||
{{#if:{{{ar|}}}| ar}} | |||
{{#if:{{{autoplay|}}}| autoplay}} | |||
> | > | ||
</model-viewer> | </model-viewer> | ||
</ | <noinclude> | ||
<templatedata> | |||
{ | |||
"description": "Displays an interactive 3D model using <model-viewer>.", | |||
"params": { | |||
"src": {"label": "Model source URL","description": "URL of the .glb or .gltf file","type": "string","required": true}, | |||
"alt": {"label": "Alternative text","description": "Accessibility text","type": "string","required": false}, | |||
"width": {"label": "Width","description": "Width of viewer (e.g., 300px)","type": "string","required": false}, | |||
"height": {"label": "Height","description": "Height of viewer (e.g., 300px)","type": "string","required": false}, | |||
"cameraOrbit": {"label": "Camera orbit","description": "Initial camera orbit (e.g., 165deg 75deg 4m)","type": "string","required": false}, | |||
"backgroundColor": {"label": "Background color","description": "Background color (e.g., transparent, #ffffff)","type": "string","required": false}, | |||
"shadowIntensity": {"label": "Shadow intensity","description": "Shadow intensity (0-1)","type": "string","required": false}, | |||
"environmentImage": {"label": "Environment image","description": "Environment image or 'neutral'","type": "string","required": false}, | |||
"exposure": {"label": "Exposure","description": "Scene exposure value","type": "string","required": false}, | |||
"loading": {"label": "Loading mode","description": "eager or lazy","type": "string","required": false}, | |||
"poster": {"label": "Poster image","description": "Poster image URL (displayed before load)","type": "string","required": false}, | |||
"autoRotate": {"label": "Auto rotate","description": "yes to enable auto-rotate","type": "boolean","required": false}, | |||
"cameraControls": {"label": "Camera controls","description": "yes to enable user camera controls","type": "boolean","required": false}, | |||
"ar": {"label": "Augmented reality","description": "yes to enable AR","type": "boolean","required": false}, | |||
"autoplay": {"label": "Autoplay","description": "yes to autoplay animations","type": "boolean","required": false} | |||
} | |||
} | |||
</templatedata> | |||
</noinclude> | |||