Advanced images
rtSurveyの高度な画像機能：ウォーターマーク、メディアグリッド表示、画像アノテーション。
標準のimage質問タイプ以外に、rtSurveyは撮影した写真へのウォーターマーク適用と複数の画像をメディアグリッドで表示するための拡張機能を提供します。これらは、調査員のIDや調査メタデータで写真をマークする必要がある証拠ベースの調査や、視覚的レビューインターフェースに便利です。
ウォーターマーク
ウォーターマーク機能は、撮影した写真が保存される前にテキストまたは画像をオーバーレイします。これは、日付、調査員名、GPS位置、またはその他の調査データでフィールド写真にブランドを付けるために使用されます — 既存の写真を新しく撮影されたものとして偽ることを難しくします。
セットアップ
imageフィールドの**calculation**列でcallapi外観と組み合わせて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}から取得されます。フォームでimageフィールドの前にウォーターマークテキストフィールドを設定してください。
画像/ロゴウォーターマークの例
組織のロゴ（logo.pngという名前のメディアファイルとして添付）をオーバーレイする：
| type | name | label | appearance | calculation |
|---|---|---|---|---|
| image | evidence_photo | 証拠の写真を撮影してください | watermark | watermark('file', 25, 80, '', '#000000', 0, 50) |
元に戻す/やり直し
ウォーターマークエディターは元に戻すとやり直しをサポートします — 調査員は写真を確認する前に編集履歴を遡ることができます。
ウォーターマークのタイリング
ウォーターマークは画像全体に自動的に繰り返し（タイル）表示されます。distanceパラメーターはタイル間のスペーシングを制御し、rotateは各タイルの角度を制御します。
メディアグリッドウィジェット
メディアグリッドウィジェットは、メディアファイル（画像、音声、動画）のコレクションをグリッドレイアウトで表示し、レビュアーまたは調査員が撮影されたファイルを視覚的に閲覧できます。
このウィジェットはmediagridwidget外観によって起動され、通常は繰り返しグループから以前に撮影されたメディアを表示するために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ウォーターマークタイプは、期待されるファイル名と完全に一致するメディアファイルとしてロゴ画像が添付されていることが必要です。