Open-source release of MAESTRO, an agent orchestration platform that runs LLM-driven tasks through sandboxed tools, with a web UI. Apache-2.0. See README.md and docs/ (getting-started, configuration, architecture).
1.9 KiB
1.9 KiB
AnnotateImage
画像上に矩形枠・矢印・テキストラベルを SVG で重畳描画する。元画像は変更せず output/ に新しいファイルとして保存される。
基本
AnnotateImage({
input_path: "input/screenshot.png",
output_path: "output/annotated.png",
annotations: [
{ type: "rectangle", x: 100, y: 50, width: 200, height: 80, color: "#FF0000", label: "問題箇所" },
{ type: "arrow", from_x: 50, from_y: 200, to_x: 150, to_y: 250, color: "#00FF00", label: "ここに注目" },
{ type: "text", x: 300, y: 100, text: "重要", color: "#0000FF", font_size: 24 }
]
})
annotation の種類
rectangle(矩形)
x,y: 左上の座標(px)width,height: 幅・高さ(px)color: 線色(CSS カラー、デフォルト#FF0000)label: 矩形の上に表示するラベル(任意)
arrow(矢印)
from_x,from_y: 始点to_x,to_y: 終点(矢印の先)color: 線・矢じり色label: 始点付近に表示するラベル(任意)
text(テキスト)
x,y: テキストの基準点text: 表示文字列color: 文字色font_size: フォントサイズ(任意、画像サイズに応じて自動調整)
自動スケーリング
線幅・フォントサイズは画像サイズに応じて自動調整される(短辺ベース)。固定値で見栄えが崩れることは少ない。
用途
- スクリーンショットへの注釈追加
- 手順書の作成(操作手順を矢印で示す)
- バグ報告での問題箇所のハイライト
- レポート用の図解作成
注意
output_pathはoutput/配下である必要がある- 元画像は変更されない(非破壊的)
- 日本語ラベル使用時は環境に日本語フォントが必要(prepare.sh で自動チェック)