해당 샘플은 스트리밍 서버를 사용할 수 없는 환경에서 이미지를 마치 카메라처럼 응용하여 웹에서 표현하기 위한 목적으로 만들었습니다.

웹 서비스를 지원하지 않는 IP/USB Camera를 바이트 태그(Bytes tag)와 연결하여 이미지 객체를 활용해 실제 카메라처럼 표현하는 방법을 소개하겠습니다.

1. 카메라(Camera), 이미지(Image), 레이블(Label) 등을 활용하여 화면을 구성한다.

2. 태그 탐색기(Tag Explorer)에서 디지털 태그(Digital Tag) 1개와 바이트 태그(Bytes Tag) 1개를 생성한다.

- 디지털 태그는 카메라 화면을 캡처하기 위해 사용한다.

- 바이트 태그는 캡처한 결과를 저장하기 위해 사용한다.

3. 생성한 카메라(Camera) 객체 선택 후 속성(Properties)에서 이미지 캡처(Capture)와 URL에 대해 설정한다.

- 캡처 태그(Capture Tag)에 미리 생성한 디지털 태그인 capture 태그를 설정한다.

- 이미지 태그(Image Tag)에 미리 생성한 바이트 태그인 bytes_1 태그를 설정한다.

- 재생(Playback) > URL 에 카메라 URL을 설정한다.

4. 이미지(Image) 객체 선택 후 속성(Preperties)에서 바인딩(Binding) > URI 태그(URI Tag)를 설정한다.

- URI 태그에 바이트 태그를 설정하면, 바이트 태그에 저장된 값을 불러와 이미지로 표현한다.

5. 스크립트 작성한(Script)에서 아래와 같이 스크립트를 작성한다.

- 0.1초마다 카메라 캡처 기능을 동작시켜 카메라가 보는 화면을 바이트 태그에 저장한 뒤, 캡처한 정보를 담은 바이트 태그를 이미지 객체를 통해 볼 수 있다.

- 0.1초마다 자동으로 이미지가 갱신되기 때문에 카메라가 웹을 지원하지 않더라도, 이미지를 빠르게 최신화시켜 마치 실시간 카메라처럼 현장 상황을 볼 수 있다.

6. 해당 프로젝트를 웹에서 볼 수 있도록 웹서비스 설정을 한다.

- 상단 파일(File) > 웹 서비스용 내보내기(Export for Http Service) 를 클릭한 뒤, 원하는 설정 및폴더 지정 등을 통해 웹 서비스 내보내기를 실시한다.

7. 실행환경 설정(Runtime Settings) > Http Service에서 웹서비스 내보내기한 폴더를 지정한 뒤 [확인(OK)] 버튼을 누른다.

8. 프로젝트 저장 후 X-SCADA AI Viewer로 실행한다.

9. 구글 크롬 등 웹브라우저 주소창에 localhost 를 입력하여 접속한 뒤, [Capture Start] 버튼을 클릭해본다.

- 카메라가 웹을 지원하지 않아 왼쪽에 있는 실시간 카메라 모습을 볼 수는 없지만, 바이트 태그를 통해 0.1초마다 갱신하고 있기 때문에 오른쪽에 있는 이미지 객체를 카메라처럼 응용하여 활용할 수 있다.