[ModelDepot 실행예시]
깃허브 링크 🔗: https://github.com/ModelDepot/tfjs-yolo-tiny-demo
포스트링크 🔗: https://towardsdatascience.com/deep-learning-in-your-browser-a-brisk-guide-ca06c2198846
- src/index.js 파일 분석
import * as tf from '@tensorflow/tfjs';
import yolo, { downloadModel } from 'tfjs-yolo-tiny';
import { Webcam } from './webcam';
let model;
const webcam = new Webcam(document.getElementById('webcam'));
(async function main() {
try {
ga();
model = await downloadModel();
alert("Just a heads up! We'll ask to access your webcam so that we can " +
"detect objects in semi-real-time. \n\nDon't worry, we aren't sending " +
"any of your images to a remote server, all the ML is being done " +
"locally on device, and you can check out our source code on Github.");
await webcam.setup();
doneLoading();
run();
} catch(e) {
console.error(e);
showError();
}
})();
(생략)
tfjs 를 쓴 프로젝트 코드는 전체적으로 비슷하다.
index.html에서 틀을 잡고
index.js에서 yolo 알고리즘을 불러와서 처리한다.
1. tfjs를 import 시키고 yolo 알고리즘을 불러오는 코드 downloadModel에 yolo-tiny 모델이 불러와진다.
import * as tf from '@tensorflow/tfjs';
import yolo, { downloadModel } from 'tfjs-yolo-tiny';
2. downloandModel 을 model 변수 받고 로딩 완료 후 카메라 허용 팝업이 뜬다.
(async function main() {
try {
ga();
model = await downloadModel();
alert("Just a heads up! We'll ask to access your webcam so that we can " +
"detect objects in semi-real-time. \n\nDon't worry, we aren't sending " +
"any of your images to a remote server, all the ML is being done " +
"locally on device, and you can check out our source code on Github.");
await webcam.setup();
doneLoading();
run();
} catch(e) {
console.error(e);
showError();
}
})();
이후 webcam 코드는 대체적으로 비슷했기 때문에 이 모델을 어떻게 우리가 새롭게 트레이닝 시킨 weights를 적용해서 로드할지 고민했다.
그래서 확인한게 teachable machine 에서 model export 기능을 통해 코드를 확인해 보았다.
👉 model.json 그리고 metadata.json 형식의 모델과 metadata를 이미 호스팅 된 url을 통해 받아와서 동작하는 코드다.
일단 먼저 local에서 동작하는 코드를 작성해보고 호스팅은 나중에..
(참고자료)
How to deploy a tensorflow model to production https://youtu.be/T_afaArR0E8
[flask-yolo]
: 연수가 저번주에 찾아왔던 프로젝트. 아래 보이는 weights 파일만 우리가 트레이닝 시키고 난 걸로 바꾸면 동작할 것 같다.
- server.py
from flask import Flask, url_for, render_template, Response
from darkflow.net.build import TFNet
from facenet.src import facenet
from facenet.src.align import detect_face
import cv2
import tensorflow as tf
import numpy as np
import pickle
from scipy import misc
app = Flask(__name__)
options = {"model": "/home/rohitner/tensorflow/darkflow/cfg/tiny-yolo-voc.cfg",
"load": "/home/rohitner/tensorflow/darkflow/bin/tiny-yolo-voc.weights",
"threshold": 0.1, "gpu": 0.8}
tfnet = TFNet(options)
[Tensorflow.js 를 활용한 사물인식]
포스트 링크 🔗: https://blog.naver.com/shane5321/221700192580
<html>
<head>
<title>Coco SSD</title>
<script src="./tf.min.js"> </script>
<script src="./coco-ssd.js"> </script>
</head>
<body>
<font color="blue">
<div id="info">...</div>
</font>
<video id="videoInput" width="240" height="320" style="position: absolute; left:10; top:30"></video>
<canvas id="videoOutput" width="240" height="320" style="position: absolute; left:10; top:30"></canvas>
<script>
const info = document.getElementById("info");
const constraints = { audio: false, video: true };
const video = document.getElementById("videoInput");
function successCallback(stream) {
video.srcObject = stream;
video.play();
}
function errorCallback(error) {
console.log(error);
}
navigator.getUserMedia(constraints, successCallback, errorCallback);
let net;
async function makeNet() {
info.innerHTML = "Now loading... Please wait.";
net = await cocoSsd.load();
info.innerHTML = "Ready to use!";
setInterval(detect, 0);
}
(생략)
</script>
</body>
</html>
[출처] [Droidscript] Tensorflow.js를 이용한 사물인식|작성자 Shane
[Yolo v2 to detect your own objects using Darkflow]
일단 회의부터..
'프로그래밍 > Developer Student Clubs' 카테고리의 다른 글
[Back-end] Darkflow-flask-web-streaming 구현 (0) | 2020.02.23 |
---|---|
[Back-end] Flask 공부 및 Yolo v3 web streaming 구현 (1) | 2020.02.18 |
[YOLO 웹으로 구현한 프로젝트 조사] (0) | 2020.02.02 |
ASL, Digit 데이터 수집 (0) | 2020.01.16 |
깃헙 프로젝트 코드 분석 기록(cnn_keras.py) (0) | 2020.01.12 |