Files
sp/src/components/ModelViewer.jsx
2025-04-01 14:19:16 +05:30

32 lines
890 B
JavaScript

import React from 'react';
import '@google/model-viewer';
const ModelViewer = () => {
return (
<div className="w-full h-[500px]">
<model-viewer
src="https://bscdn.sgp1.digitaloceanspaces.com/tb-revised-books/glb/alligator.glb"
ar
ar-modes="webxr scene-viewer quick-look"
camera-controls
tone-mapping="neutral"
poster="poster.webp"
shadow-intensity="1"
style={{ width: '100%', height: '100%' }}
>
<div className="progress-bar hide" slot="progress-bar">
<div className="update-bar"></div>
</div>
<button slot="ar-button" id="ar-button">
View in your space
</button>
<div id="ar-prompt">
<img src="https://modelviewer.dev/shared-assets/icons/hand.png" />
</div>
</model-viewer>
</div>
);
};
export default ModelViewer;