고급 이미지
rtSurvey의 고급 이미지 기능: 워터마킹, 미디어 그리드 표시 및 이미지 주석.
표준 image 질문 유형을 넘어, rtSurvey는 촬영된 사진에 워터마킹을 적용하고 미디어 그리드에 여러 이미지를 표시하는 확장 기능을 제공합니다. 이는 사진에 조사원 신원 또는 설문 메타데이터로 표시해야 하는 증거 기반 설문과 시각적 검토 인터페이스에 유용합니다.
워터마크
워터마크 기능은 촬영된 사진이 저장되기 전에 텍스트 또는 이미지를 오버레이합니다. 이는 날짜, 조사원 이름, GPS 위치 또는 기타 설문 데이터로 현장 사진에 브랜딩을 적용하는 데 사용됩니다 — 기존 사진을 새로 촬영한 증거로 사용하기 어렵게 합니다.
설정
callapi appearance와 함께 image 필드의 calculation 열에 watermark()를 사용합니다:
watermark(type, size, distance, color, shadow, rotate, blur)
| 매개변수 | 설명 |
|---|---|
type | 텍스트 워터마크의 경우 'text'; 이미지 워터마크의 경우 'file' |
size | 픽셀 단위의 글꼴 크기 (텍스트) 또는 이미지 너비의 %로 표시되는 워터마크 크기 (파일) |
distance | 반복되는 워터마크 타일 사이의 간격 (픽셀) |
color | 텍스트 색상 (CSS 색상 또는 16진수). file 유형에는 사용되지 않음 |
shadow | 그림자 색상 (CSS 색상 또는 16진수) |
rotate | 도 단위의 회전 각도 (예: 대각선의 경우 45) |
blur | 워터마크의 불투명도 (0 = 보이지 않음, 100 = 완전히 불투명) |
텍스트 워터마크 예시
각 촬영된 사진에 조사원의 이름과 오늘 날짜를 대각선으로 오버레이합니다:
| type | name | label | appearance | calculation |
|---|---|---|---|---|
| calculate | wm_text | `concat(pulldata(‘app-api’, ‘user.name’), ' | ||
| image | site_photo | 현장 사진 촬영 | watermark | watermark('text', 20, 60, '#ffffff', '#000000', 45, 40) |
워터마크 텍스트는 ${wm_text}에서 가져옵니다. 양식에서 이미지 필드 앞에 워터마크 텍스트 필드를 설정합니다.
이미지/로고 워터마크 예시
조직 로고를 오버레이합니다 (logo.png라는 이름의 미디어 파일로 첨부):
| type | name | label | appearance | calculation |
|---|---|---|---|---|
| image | evidence_photo | 증거 사진 촬영 | watermark | watermark('file', 25, 80, '', '#000000', 0, 50) |
실행 취소/다시 실행
워터마크 편집기는 실행 취소 및 다시 실행을 지원합니다 — 조사원이 사진을 확인하기 전에 편집 기록을 되돌릴 수 있습니다.
워터마크 타일링
워터마크는 전체 이미지에 걸쳐 자동으로 반복 (타일링)됩니다. distance 매개변수는 타일 사이의 간격을 제어하고, rotate는 각 타일의 각도를 제어합니다.
미디어 그리드 위젯
미디어 그리드 위젯은 미디어 파일 (이미지, 오디오, 비디오) 컬렉션을 그리드 레이아웃으로 표시하여 검토자나 조사원이 캡처된 파일을 시각적으로 탐색할 수 있게 합니다.
이 위젯은 mediagridwidget appearance로 활성화되며 일반적으로 note 또는 calculate 필드에서 이전에 반복 그룹에서 캡처된 미디어를 표시하는 데 사용됩니다.
예시: 반복에서 모든 사진을 그리드로 표시
| type | name | label | appearance | calculation |
|---|---|---|---|---|
| calculate | photo_list | join(' ', ${site_photo}) | ||
| note | photo_review | 캡처된 사진 검토 | mediagridwidget |
워터마크 처리된 사진에 대한 모범 사례
- 사진이 찍힐 때 사용할 수 있도록 이미지 필드 위의
calculate필드에서 워터마크 텍스트를 항상 계산합니다. - 워터마크를 잘라내기 어렵게 만들기 위해 회전 각도 (예: 45°)를 사용합니다.
- 불투명도 (
blur)를 30–60% 사이로 설정합니다 — 읽을 수 있을 만큼 높고, 사진 피사체를 가리지 않을 만큼 낮습니다. - 감사 가치를 극대화하기 위해 워터마크 텍스트에 조사원 이름, 날짜 및 GPS 좌표를 포함합니다.
- 기기 중 가장 낮은 사양에서 워터마크 렌더링을 테스트합니다 — 캔버스 기반 워터마킹은 구형 하드웨어에서 느릴 수 있습니다.
제한 사항
- 워터마킹은 HTML5 Canvas API를 사용하여 클라이언트 측에서 적용됩니다 — 유능한 브라우저 또는 모바일 WebView가 필요합니다.
- 매우 고해상도 사진은 저사양 기기에서 워터마킹에 몇 초가 걸릴 수 있습니다.
- 워터마크는 이미지 파일에 내포됩니다 — 제출 후 이미지 편집 없이는 제거할 수 없습니다.
file워터마크 유형은 로고 이미지가 정확한 파일명으로 미디어 파일로 첨부되어야 합니다.