DIFETTATO - Pannello Diffusore Acustico Skyline in Legno di Ayous
Altezza variabile dei listelli: da 10 mm a 40 mm
Dimensione totale pannello: 525 x 525 mm (±10 mm)
Spessore complessivo variabile: 60–90 mm (±5 mm)
Materiale: legno massello di Ayous
Peso: circa 5-6 kg
Colore: legno naturale (non trattato o protetto con finitura) o vernicaito
.viewer3d-button {
margin: 2rem auto;
display: block;
padding: 10px 20px;
background-color: #333;
color: white;
border: none;
font-size: 16px;
cursor: pointer;
border-radius: 6px;
}
.viewer3d-lightbox {
display: none;
position: fixed;
z-index: 9999;
top: 0;
left: 0;
width: 100vw;
height: 100vh;
background: rgba(0, 0, 0, 0.8);
justify-content: center;
align-items: center;
}
.viewer3d-lightbox.active {
display: flex;
}
.viewer3d-container {
position: relative;
width: 80vw;
height: 80vh;
max-width: 1000px;
background: #eee;
box-shadow: 0 0 30px rgba(0, 0, 0, 0.3);
}
.viewer3d-container canvas {
width: 100% !important;
height: 100% !important;
display: block;
}
.viewer3d-close {
position: absolute;
top: 10px;
right: 10px;
z-index: 1000;
background: #fff;
border: none;
font-size: 18px;
cursor: pointer;
padding: 5px 10px;
border-radius: 4px;
}
Apri Visualizzatore 3D
×
import * as THREE from 'https://esm.sh/three@0.155.0';
import { GLTFLoader } from 'https://esm.sh/three@0.155.0/examples/jsm/loaders/GLTFLoader.js';
import { OrbitControls } from 'https://esm.sh/three@0.155.0/examples/jsm/controls/OrbitControls.js';
const openBtn = document.getElementById('openViewer3D');
const lightbox = document.getElementById('lightbox3D');
const closeBtn = document.getElementById('closeViewer3D');
const container = document.getElementById('viewerContainer3D');
let scene, camera, renderer, controls;
openBtn.onclick = () => {
lightbox.classList.add('active');
if (!renderer) initViewer();
};
closeBtn.onclick = () => {
lightbox.classList.remove('active');
};
function initViewer() {
scene = new THREE.Scene();
scene.background = new THREE.Color(0xf0f0f0);
const aspect = container.clientWidth / container.clientHeight;
camera = new THREE.PerspectiveCamera(60, aspect, 0.1, 100);
camera.position.set(2, 2, 5);
renderer = new THREE.WebGLRenderer({ antialias: true });
renderer.setPixelRatio(window.devicePixelRatio);
renderer.setSize(container.clientWidth, container.clientHeight);
renderer.outputEncoding = THREE.sRGBEncoding;
renderer.toneMapping = THREE.ACESFilmicToneMapping;
renderer.toneMappingExposure = 1.2;
renderer.shadowMap.enabled = true;
renderer.shadowMap.type = THREE.PCFSoftShadowMap;
container.appendChild(renderer.domElement);
// Luci
scene.add(new THREE.AmbientLight(0xffffff, 0.3));
const light1 = new THREE.DirectionalLight(0xffffff, 0.6);
light1.position.set(5, 5, 5);
light1.castShadow = true;
scene.add(light1);
const light2 = new THREE.DirectionalLight(0xffffff, 1.2);
light2.position.set(-5, 8, 5);
light2.castShadow = true;
scene.add(light2);
const lightBack = new THREE.DirectionalLight(0xffffff, 0.15);
lightBack.position.set(0, 5, -5);
scene.add(lightBack);
// Controlli orbitali
controls = new OrbitControls(camera, renderer.domElement);
controls.enableDamping = true;
controls.dampingFactor = 0.05;
// Caricamento texture
const textureLoader = new THREE.TextureLoader();
const woodTexture = textureLoader.load('http://www.keyhelmshop.it/cdn/dl_view.php/texture-legno-ayous-00.jpg?documentID=6819f188be7ea07d931f233e');
woodTexture.encoding = THREE.sRGBEncoding;
const woodMaterial = new THREE.MeshStandardMaterial({
map: woodTexture,
roughness: 0.6,
metalness: 0.1
});
// Caricamento modello
const loader = new GLTFLoader();
loader.load('http://www.keyhelmshop.it/cdn/dl_view.php/modello-diffusore-skyline.glb?documentID=681cc0fabe7ea00a3f5a1f18', function (gltf) {
const model = gltf.scene;
model.traverse(child => {
if (child.isMesh) {
child.material = woodMaterial;
child.castShadow = true;
child.receiveShadow = true;
}
});
// Centra il modello
const bbox = new THREE.Box3().setFromObject(model);
const center = bbox.getCenter(new THREE.Vector3());
model.position.sub(center);
scene.add(model);
// Ricalcola bounding box dopo il posizionamento
const finalBox = new THREE.Box3().setFromObject(model);
const minY = finalBox.min.y;
// Piano d'ombra esattamente sotto il modello
const ground = new THREE.Mesh(
new THREE.PlaneGeometry(20, 20),
new THREE.ShadowMaterial({ opacity: 0.3 })
);
ground.rotation.x = -Math.PI / 2;
ground.position.y = minY - 0.01;
ground.receiveShadow = true;
scene.add(ground);
// Inquadramento camera
const size = finalBox.getSize(new THREE.Vector3()).length();
const d = size * 0.4;
camera.position.set(center.x + d, center.y + d, center.z + d);
camera.lookAt(0, 0, 0);
controls.target.set(0, 0, 0);
controls.update();
});
animate();
}
function animate() {
requestAnimationFrame(animate);
controls?.update();
renderer?.render(scene, camera);
}
.lightbox-overlay {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(0, 0, 0, 0.6);
display: none;
justify-content: center;
align-items: center;
z-index: 9999;
}
.lightbox-content {
background: #fff;
padding: 30px;
border-radius: 10px;
position: relative;
max-width: 600px;
width: 90%;
box-shadow: 0 0 15px rgba(0, 0, 0, 0.5);
}
.close-button {
position: absolute;
top: 10px;
right: 15px;
font-size: 24px;
font-weight: bold;
color: #333;
cursor: pointer;
}
.read-button {
padding: 8px 15px;
font-size: 14px;
border: none;
border-radius: 5px;
background-color: #0088cc;
color: white;
cursor: pointer;
}
.read-button:hover {
background-color: #5599cc;
}
Info su STOCK-DIFETTATI
×
PRODOTTI STOCK e/o DIFETTATI
I seguenti prodotti possono sempre presentare difetti di varia natura: bordi non rifilati, sagomatura imperfetta, colorazione alterata, dimensioni imprecise, macchie, piccoli strappi, presenza di molteplici bollicine d'aria, ecc...
In generale si tratta sempre di difetti di natura estetica, che non compromettono l'efficienza del pannello dal punto di vista acustico.
Non è possibile conoscere in anticipo il difetto preciso del prodotto, in quanto può variare per ogni singolo pannello.
In alcuni casi i prodotti potrebbero non presentare alcun difetto, venduti scontati per uno smaltimento del magazzino.
const lightbox = document.getElementById('lightbox');
const closeBtn = document.getElementById('closeBtn');
const openBtn = document.getElementById('openBtn');
openBtn.addEventListener('click', () => {
lightbox.style.display = 'flex';
});
closeBtn.addEventListener('click', () => {
lightbox.style.display = 'none';
});
lightbox.addEventListener('click', (e) => {
if (e.target === lightbox) {
lightbox.style.display = 'none';
}
});
€ 85,00
€ 49,00
