andfanilo/streamlit-drawable-canvas

何を解決するか

Streamlitアプリケーションにインタラクティブなスケッチキャンバスを統合する方法を提供し、ユーザーがWebアプリ内で直接図形を描画・注釈・操作できるようにします。カスタムフロントエンドコンポーネントをゼロから構築する必要はありません。

動作方法

Fabric.jsを使用してStreamlitコンポーネントとして構築され、ブラウザにキャンバスをレンダリングします。自由な描画、線、長方形、円、多角形、テキストなどのさまざまな描画モードをサポートします。背景画像または色で初期化でき、結果の画像データ（numpy配列として）またはオブジェクトのプロパティ（JSONとして）をStreamlitバックエンドに送信し、さらに処理できます。

対象ユーザー

画像の注釈ツール、スケッチインターフェース、またはシンプルなグラフィックエディタが必要な、Streamlitアプリを開発する開発者。

特徴

• 複数の描画モード: 自由な描画、点、線、長方形、円、多角形、テキストをサポート。
• オブジェクト操作: キャンバス上に配置されたオブジェクトを回転、歪め、スケーリング、移動可能。
• データ統合: 画像データと、描画されたすべてのオブジェクトの詳細なJSONプロパティをPythonバックエンドに返却。
• 注釈サポート: ラベル付きバウンディングボックスを作成するための特別な labeled_rect モードを含む。
• カスタマイズ可能な背景: ストレッチまたはコンテインする方法で背景画像をサポート。