Added base app structure (face detector->not working)

This commit is contained in:
Samuel Ortion 2021-05-03 13:06:34 +02:00
parent e867ac1d3a
commit cd35dd58a6
12 changed files with 981223 additions and 7 deletions

View File

@ -1,3 +1,7 @@
# photo_mem # photo_mem
Outil web de sauvegarde des noms des personnes sur les photos et d'identification automatique des visages. Outil web de sauvegarde des noms des personnes sur les photos et d'identification automatique des visages.
## Détection de visage
La détection de visage utilise la librairie OpenCV.js avec [*"Haar Feature-based Cascade Classifier"*](https://docs.opencv.org/3.4/d2/d99/tutorial_js_face_detection.html).

View File

@ -12,7 +12,7 @@ License: GNU AGPL v3
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>photo_mem v1.0.0</title> <title>photo_mem v1.0.0</title>
<!--v1.0.0 is not actual, it is set in script.js--> <!--v1.0.0 is not actual, it is set in script.js-->
<link rel="stylesheet" href="style.css"> <link rel="stylesheet" href="styles/style.css">
</head> </head>
<body> <body>
@ -20,10 +20,12 @@ License: GNU AGPL v3
<h1>photo_mem v<span class="version">1.0.0</span></h1> <h1>photo_mem v<span class="version">1.0.0</span></h1>
</header> </header>
<main> <main>
<div class="actions">
<input id="file" multiple type="file" class=cotecote onChange="lecfic(this.files);" /> <input id="file" multiple type="file" class=cotecote onChange="lecfic(this.files);" />
<input id="file" type="button" class=cotecote value="Enregistrer xml" onclick="enregistrer_fichier(enreg_xml)" /> <input id="file" type="button" class=cotecote value="Enregistrer xml" onclick="enregistrer_fichier(enreg_xml)" />
<input id="file" type="button" class=cotecote value="Enregistrer image " onclick="image_finale()" /> <input id="file" type="button" class=cotecote value="Enregistrer image " onclick="image_finale()" />
<input type="button" id="detect" value="detect">
</div>
<div style="position: relative; "> <div style="position: relative; ">
<img src="" id="ima_fond" style="position: absolute; left: 0; top: 0; z-index: 0;"> <img src="" id="ima_fond" style="position: absolute; left: 0; top: 0; z-index: 0;">
</div> </div>
@ -59,7 +61,9 @@ License: GNU AGPL v3
&#127279; Liness <em>et al.</em> &#127279; Liness <em>et al.</em>
</div> </div>
</footer> </footer>
<script src="script.js"></script> <script src="https://docs.opencv.org/4.5.2/opencv.js"></script>
<script src="scripts/script.js"></script>
<script src="scripts/detector.js"></script>
</body> </body>
</html> </html>

View File

Before

Width:  |  Height:  |  Size: 898 KiB

After

Width:  |  Height:  |  Size: 898 KiB

35
media/zizou.xml Normal file
View File

@ -0,0 +1,35 @@
<?xml version="1.0" encoding="UTF-8"?>
<photo>
<titre titx="350px" tity="55px">Coupe du monde 1998 </titre>
<date/>
<lieu/>
<auteur/>
<commentaire/>
<personne>
<nom>Zizou</nom>
<nom_jeune_fille>
</nom_jeune_fille>
<prenom>
</prenom>
<surnom>
</surnom>
<annee_naiss>
</annee_naiss>
<note>
</note>
<position posx="104" posy="132" etx="74px" ety="192px"/>
</personne>
<personne>
<nom>Deschamps </nom>
<nom_jeune_fille>
</nom_jeune_fille>
<prenom>Didier</prenom>
<surnom>
</surnom>
<annee_naiss>
</annee_naiss>
<note>
</note>
<position posx="399" posy="323" etx="369px" ety="383px"/>
</personne>
</photo>

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff

30
scripts/detector.js Normal file
View File

@ -0,0 +1,30 @@
let img = document.getElementById('ima_fond');
let mat;
img.onload = function() {
mat = cv.imread(img);
document.getElementById('detect').addEventListener('click', function() {
console.log(mat);
let gray = new cv.Mat();
cv.cvtColor(mat, gray, cv.COLOR_RGBA2GRAY, 0);
let faces = new cv.RectVector();
let profiles = new cv.RectVector();
let faceCascade = new cv.CascadeClassifier();
let profileCascade = new cv.CascadeClassifier();
// Load pretrained classifier
faceCascade.load("../models/haarcascade_frontalcatface.xml");
profileCascade.load("../models/haarcascade_profileface.xml");
// Detect faes
let msize = new cv.Size(0, 0);
faceCascade.detectMultiScale(gray, faces, 1.05, 0);
profileCascade.detectMultiScale(gray, profiles, 1.1, 3, 0, msize, msize);
// Show detected faces
faces = faces.concat(profiles);
for (let i = 0; i < faces.length; i++) {
let point1 = new cv.Point(faces.get(i).x, faces.get(i).y);
let point2 = new cv.Point(faces.get(i).x + faces.get(i).width,
faces.get(i).y + faces.get(i).height);
cv.rectangle(mat, point1, point2, [255, 0, 0, 255]);
}
});
}

937071
scripts/opencv.js Normal file

File diff suppressed because one or more lines are too long