|
|
| (51 intermediate revisions by 2 users not shown) |
| Line 4: |
Line 4: |
|
| |
|
|
| |
|
| <table>
| | {{#widget:ModelViewer |
| <tr>
| | |src=https://survivalcraft.wiki/content/Models/Moose.glb |
| <td>Cell 1</td>
| | |alt=Brown Bear |
| <td> Cell 2</td>
| | |width=270px |
| </tr>
| | |height=200px |
| | |interactionPrompt=false |
| | |backgroundColor=transparent |
| | |cameraControls=true |
| | |disableZoom=true |
| | |cameraOrbit=220deg 75deg 4m |
| | |ar=true |
| | |arModes=scene-viewer quick-look webxr |
| | |poster=https://survivalcraft.wiki/content/Models/Bear_Brown.webp}} |
|
| |
|
| <tr>
| | {{#widget:ModelViewer |
| <td>Cell 3</td>
| | |src=https://survivalcraft.wiki/content/Models/Boat.glb |
| <td> Cell 4</td>
| | |alt=Donkey |
| </tr>
| | |width=270px |
| | |height=200px |
| | |interactionPrompt=false |
| | |backgroundColor=transparent |
| | |cameraControls=true |
| | |disableZoom=true |
| | |cameraOrbit=220deg 75deg 4m |
| | |ar=true |
| | |arModes=scene-viewer quick-look webxr |
| | |poster=https://survivalcraft.wiki/content/Models/Bear_Brown.webp |
| | }} |
|
| |
|
| | | {{#widget:ModelViewer |
| | | |src=https://survivalcraft.wiki/content/Models/SoundGenerator.glb |
| <html>
| | |alt=Donkey |
| <head>
| | |width=270px |
| <script type="module" src="https://unpkg.com/@google/model-viewer/dist/model-viewer.min.js"></script>
| | |height=200px |
| <style>
| | |interactionPrompt=false |
| model-viewer {
| | |backgroundColor=transparent |
| width: 100%;
| | |cameraControls=true |
| height: 500px;
| | |disableZoom=true |
| background-color: #eee;
| | |cameraOrbit=220deg 75deg 4m |
| }
| | |ar=true |
| </style>
| | |arModes=scene-viewer quick-look webxr |
| </head>
| | |poster=https://survivalcraft.wiki/content/Models/SoundGenerator.webp |
| <body>
| | }} |
| <model-viewer id="bearModel"
| |
| src="https://survivalcraft.wiki/content/Models/Bear.glb"
| |
| ar shadow-intensity="1" camera-controls touch-action="pan-y"
| |
| environment-image="neutral"
| |
| auto-rotate>
| |
| </model-viewer>
| |
| | |
| <script type="module">
| |
| const modelViewer = document.querySelector('#bearModel');
| |
| | |
| modelViewer.addEventListener('load', async () => {
| |
| try {
| |
| // Get the scene and materials
| |
| const scene = modelViewer.model.scene || modelViewer.model;
| |
|
| |
| // Function to traverse and update materials
| |
| function updateMaterials(object) {
| |
| if (object.material) {
| |
| // Load the new texture
| |
| const textureLoader = new THREE.TextureLoader();
| |
| textureLoader.load(
| |
| 'https://survivalcraft.wiki/content/Textures/Creatures/Bear_Brown.png',
| |
| (texture) => {
| |
| // Apply the texture to the material
| |
| if (Array.isArray(object.material)) {
| |
| object.material.forEach(mat => {
| |
| mat.map = texture;
| |
| mat.needsUpdate = true;
| |
| });
| |
| } else {
| |
| object.material.map = texture;
| |
| object.material.needsUpdate = true;
| |
| }
| |
|
| |
| // Force a re-render
| |
| modelViewer.requestUpdate();
| |
| },
| |
| undefined,
| |
| (error) => {
| |
| console.error('Error loading texture:', error);
| |
| }
| |
| );
| |
| }
| |
|
| |
| // Recursively check children
| |
| if (object.children) {
| |
| object.children.forEach(child => updateMaterials(child));
| |
| }
| |
| }
| |
|
| |
| // Start the material update process
| |
| updateMaterials(scene);
| |
|
| |
| } catch (error) {
| |
| console.error('Error updating materials:', error);
| |
| }
| |
| });
| |
| | |
| // Alternative approach using model-viewer's createTexture method (if available)
| |
| modelViewer.addEventListener('load', async () => {
| |
| try {
| |
| // This is an alternative approach that might work with newer versions
| |
| const materials = modelViewer.model.materials;
| |
| console.log('Found materials:', materials.map(m => m.name));
| |
|
| |
| if (materials.length > 0) {
| |
| const material = materials[0];
| |
|
| |
| // Try to use the Three.js material directly
| |
| const threeMaterial = material.pbrMetallicRoughness || material;
| |
|
| |
| if (threeMaterial && typeof threeMaterial.setValues === 'function') {
| |
| // Load texture using Three.js loader
| |
| const loader = new THREE.TextureLoader();
| |
| loader.load('https://survivalcraft.wiki/content/Textures/Creatures/Bear_Brown.png', (texture) => {
| |
| threeMaterial.setValues({
| |
| baseColorTexture: texture
| |
| });
| |
| modelViewer.requestUpdate();
| |
| });
| |
| }
| |
| }
| |
| } catch (error) {
| |
| console.log('Alternative approach failed:', error);
| |
| }
| |
| }); | |
| | |
| </script>
| |
| </body>
| |
| </html>
| |
