J'aimerais faire un site internet où, en envoyant une image de sa tête, elle soit collée sur un arrière plan choisi au préalable par le codeur. Je me suis servi de toute la documentation accessibles pour faire ce code qui permet de détecter un visage et de le coller sur une image de fond mais il ne fonctionne pas. Est- ce que quelqu'un pourrait m'aider à le corriger et le rendre fonctionnel ??
Merci beaucoup !!!
Code : Tout sélectionner
<script>
const { faceapi } = require('face-api.js');
async function handleImageUpload() {
const inputImage = document.getElementById('inputImage');
const outputCanvas = document.getElementById('outputCanvas');
const ctx = outputCanvas.getContext('2d');
errorMessage.textContent = '';
const backgroundImage = new Image();
backgroundImage.src = 'image-de-fond.jpg';
await backgroundImage.decode();
ctx.drawImage(backgroundImage, 0, 0, outputCanvas.width, outputCanvas.height);
const userImage = new Image();
userImage.src = URL.createObjectURL(inputImage.files[0]);
await userImage.decode(); // Attendez que l'image soit chargée
const detections = await faceapi.detectAllFaces(userImage).withFaceLandmarks().withFaceDescriptors();
if (detections.length > 0) {
const face = detections[0].detection.box;
ctx.drawImage(userImage, face.x, face.y, face.width, face.height);
} else {
errorMessage.textContent = 'Veuillez sélectionner une image avec un visage clairement visible.';
}
}
const inputImage = document.getElementById('inputImage');
inputImage.addEventListener('change', handleImageUpload);
</script>