Hi all,
Hope you are doing well,
My name is Mathilde. I’m working for ARTELIA. I want to create a tool to show a model.
I have the same problem (CORS)
Here is my code :
Can you help me ?
Is it a problem with a CORS or with my code ?
export async function displayModel() {
// let token = localStorage.getItem(TOKEN)
try {
const response = await fetch('https://app.speckle.systems/projects/...../models/.....');
if (!response.ok) {
throw new Error(`Erreur HTTP ! statut : ${response.status}`);
}
const data = await response.json();
console.erreur(data);
initThreeJS(data);
} catch (error) {
console.error('Erreur lors de la récupération de la maquette:', error);
}
}
// Initialiser Three.js pour afficher la maquette
function initThreeJS(modelData) {
const container = document.getElementById('models-container');
const width = container.clientWidth;
const height = container.clientHeight;
const scene = new THREE.Scene();
const camera = new THREE.PerspectiveCamera(75, width / height, 0.1, 1000);
const renderer = new THREE.WebGLRenderer();
renderer.setSize(width, height);
container.appendChild(renderer.domElement);
modelData.objects.forEach(obj => {
const geometry = new THREE.BoxGeometry(obj.size.x, obj.size.y, obj.size.z);
const material = new THREE.MeshBasicMaterial({ color: obj.color });
const mesh = new THREE.Mesh(geometry, material);
mesh.position.set(obj.position.x, obj.position.y, obj.position.z);
scene.add(mesh);
});
camera.position.z = 5;
const animate = function () {
requestAnimationFrame(animate);
renderer.render(scene, camera);
};
animate();
}
Have a nice day,