30:[{"id":"7b3c7b7fd582765991d7518f46d37dc38e9e46690c3af91952d4d8d85e840d8642d8e219e07a1041bed2579b872ae9800b4258970980cf33617e162333bc5c0d","href":"https://static.observableusercontent.com/files/7b3c7b7fd582765991d7518f46d37dc38e9e46690c3af91952d4d8d85e840d8642d8e219e07a1041bed2579b872ae9800b4258970980cf33617e162333bc5c0d","name":"face-api.js","type":"application/javascript","lastModified":1579437335248.066,"size":845491}] 2e:{"title":"Face Detection","cells":[{"id":0,"value":"md`# Face Detection`","pinned":false,"hidden":false,"mode":"ojs"},{"id":5,"value":"md`\n## Basic\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":44,"value":"html`\n\n\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":8,"value":"{\n await visibility();\n\n const start = document.getElementById('start');\n const url = document.getElementById('url');\n const origin = document.getElementById('origin');\n const canvas = document.getElementById('canvas');\n\n start.onclick = () => {\n const path = url.value;\n origin.src = path;\n origin.crossOrigin = 'anonymous'; // required\n };\n\n origin.onload = async () => {\n const loaded = await loadFaceModels();\n if (!loaded) {\n return 'Load Model Failed';\n }\n\n await detectFaces(origin, canvas);\n };\n\n return 'Setup finished';\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":9,"value":"html`\n

\n \n

\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":11,"value":"md`\n## Face API\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":13,"value":"md`\n### Models\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":15,"value":"{\n let message = '| Net | Features |\\n| ----- | ----- |';\n\n const nets = Object.keys(faceapi.nets);\n nets.forEach(n => {\n message = `${message}\\n | ${n} | |`;\n });\n return md`${message}`;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":17,"value":"md`\n### Load Models\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":19,"value":"loadFaceModels = async () => {\n const modelsURL = 'https://justadudewhohacks.github.io/face-api.js/models/';\n\n try {\n await faceapi.loadSsdMobilenetv1Model(modelsURL);\n await faceapi.loadFaceLandmarkModel(modelsURL);\n await faceapi.loadFaceDetectionModel(modelsURL);\n } catch (err) {\n return false;\n }\n\n return faceapi.nets.ssdMobilenetv1.params;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":21,"value":"md`\n### Face Detection\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":23,"value":"detectFaces = async (img, canvas) => {\n const faces = await faceapi.detectAllFaces(img).withFaceLandmarks();\n faceapi.matchDimensions(canvas, img);\n\n const resized = faceapi.resizeResults(faces, img);\n faceapi.draw.drawDetections(canvas, resized);\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":25,"value":"md`\n## Imports\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":27,"value":"import { button, checkbox } from '@jashkenas/inputs'","pinned":false,"hidden":false,"mode":"ojs"},{"id":29,"value":"faceapi = require(await FileAttachment(\"face-api.js\").url())","pinned":false,"hidden":false,"mode":"ojs"}],"files":"$W30","stdlib":"1","titling":"auto"}