3d Lab massafra

Servizio di Stampa 3D
Modellazione
Prototipazione Rapida

"La salvezza umana giace nelle mani di creativi insoddisfatti."
Antonello Giasi
Maker - Web Designer - 3D Modeler - CAD Designer
Image to STL Converter #imageContainer { max-width: 500px; margin: 20px auto; } #imageContainer img { max-width: 100%; height: auto; } canvas { display: block; /* Assicura che il canvas sia visualizzato */ } #conversionProgress { display: none; /* Nascondi la barra di avanzamento all'inizio */ width: 100%; margin-top: 10px; }
let scene, camera, renderer; document.getElementById('imageInput').addEventListener('change', function(event) { const file = event.target.files[0]; if (file) { const reader = new FileReader(); reader.onload = function(e) { const imageSrc = e.target.result; displayImage(imageSrc); }; reader.readAsDataURL(file); } }); function displayImage(src) { const container = document.getElementById('imageContainer'); container.innerHTML = `Uploaded Image`; } function initThreeJS() { scene = new THREE.Scene(); camera = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.1, 1000); renderer = new THREE.WebGLRenderer(); renderer.setSize(500, 500); const canvas = renderer.domElement; document.body.appendChild(canvas); // Aggiunge il canvas al body } function generateMeshFromImage(image) { const progressElement = document.getElementById('conversionProgress'); progressElement.style.display = 'block'; // Mostra la barra di avanzamento // Create a plane geometry with width and height equal to image dimensions const geometry = new THREE.PlaneGeometry(image.width, image.height); // Create a texture from the image const texture = new THREE.Texture(image); texture.needsUpdate = true; // Create a material using the texture const material = new THREE.MeshBasicMaterial({ map: texture }); // Create a mesh using geometry and material const mesh = new THREE.Mesh(geometry, material); // Add mesh to the scene scene.add(mesh); // Position camera to view the mesh camera.position.z = 5; // Render the scene renderer.render(scene, camera); progressElement.style.display = 'none'; // Nascondi la barra di avanzamento dopo la conversione return true; // Indica che la generazione della scena รจ avvenuta con successo } function convertToSTL() { const imageElement = document.querySelector('#imageContainer img'); if (!imageElement) { alert('Please upload an image first.'); return; } const image = new Image(); image.onload = function() { if (!generateMeshFromImage(image)) { alert('Failed to generate the scene. Please try again.'); return; } const stlExporter = new THREE.STLExporter(); const stlString = stlExporter.parse(scene); // Download the STL file const link = document.createElement('a'); link.href = 'data:text/plain;charset=utf-8,' + encodeURIComponent(stlString); link.download = 'image_mesh.stl'; link.click(); }; image.src = imageElement.src; } document.getElementById('convertButton').addEventListener('click', convertToSTL); initThreeJS();