본문 바로가기

전체 글103

[자바스크립트] WebRTC를 이용한 카메라 사용 기초 안녕하세요? 만들오 입니다. 오늘은 WebRTC를 이용해 웹브라우저상에 카메라 화면을 띄우는 것을 알아보겠습니다. WebRTC를 이용하면 브라우저에서 카메라를 호출해 사용할 수 있는데요~ 이를 통해 아주 재미난 일들을 할 수 있게 됩니다. http://blog.naver.com/seineda/221224921920 자바스크립트를 이용한 물체 추적 안녕하세요? 오코치입니다. 자바스크립트를 이용해 선택한 대상을 추적하는 안드로이드 프로그램을 만들었... blog.naver.com 위 영상은 네이버 블로그에 작성했던 물체추적 영상입니다. 더욱 신기하고 재미난 것들이 많은데요~ 이러한 프로젝트의 첫걸음인 카메라 화면을 웹으로 불러오기를 본격적으로 알아보겠습니다. 1. 완성 코드 https://sein-oh.gi.. 2021. 1. 23.
[자바스크립트] Canvas를 이용한 조이스틱 만들기 2019.05.19 - Canvas를 블로그 내에서 사용할 수 있도록 수정하였습니다. 이번 글은 Html의 태그를 이용해 조이스틱을 만드는 것을 목표로 하고 있고, RC카에 연동하기 위해 w, a, s, d, x 등 커맨드 보내는 것을 간단히 구현하도록 하겠습니다. 1. 완성 코드 2. 작동설명 해당 코드로 html 파일을 만들어 열어보면 조이스틱 모양이 보이고, 움직이면 console.log로 w, a, s, d, x 와 같은 출력을 나타냅니다. send함수를 수정하면 droidscript에서 블루투스로 신호를 보낼 수 있습니다. 모바일 환경의 터치 이벤트와, 마우스를 이용한 클릭 이벤트를 모두 수용하기 위해 try catch문을 사용했습니다. 3. 마무리 Html/css/javascript로 만든 웹.. 2021. 1. 23.
[자바스크립트] Droidscript - Tensorflow.js를 이용한 사물인식(Object Detection) 안녕하세요? 만들오 입니다. 오늘은~ Tensorflow.js를 이용해 사물인식을 구현했습니다. 대표적인 사물인식 신경망은 YOLO(You Only Look Once)가 있습니다. 제가 구현한 것은 SSD(Single Shot MultiBox Detector)방식입니다. 카메라가 달려있는 환경이라면 데모를 실행해보셔도 좋습니다. https://sein-oh.github.io/coco_ssd/ (demo) 설정이 마무리되지 않아 스마트폰에서는 오류가 발생하니 참고해 주세요. 1. 완성 코드 ... tf.min.js 파일과 coco-ssd.js 파일은 다음 링크에서 받아 위 코드가 있는 html파일과 같은 경로에 저장해주세요. https://github.com/Sein-Oh/coco_ssd 2. 코드 설명 .. 2021. 1. 23.
[자바스크립트] Droidscript - 물체추적(Object tracking) 앱 만들기 안녕하세요? 만들오 입니다. Html/Css/Javascirpt로 구현한 물체추적 프로젝트를 Droidscript로 바꾸어 보았습니다. https://sein-oh.github.io/LK_track/ -> (사용 예제) My LK Tracker sein-oh.github.io 1. 완성 코드 1.1. App이름.html 예) LK_track.html Mouse : 1.2. jsfeat (외부 라이브러리) 해당 파일을 Droidscript의 {App이름.html} 과 같은 폴더에 저장 0.06MB 2. 코드 설명 이제부터는 외부 라이브러리를 이용해 프로젝트를 구성했습니다. 위 코드는 나의 html파일이 있는 폴더에서 jsfeat-min.js라는 자바스크립트파일을 불러오라는 요청입니다. let w = 395.. 2021. 1. 23.

티스토리툴바