手描き風の図を描けるオープンソースのバーチャルホワイトボード。React向けの埋め込み可能なnpmパッケージも提供します。
plait-board/drawnix
Plaitフレームワーク上に構築された、マインドマップ、フローチャート、フリーハンド描画、画像に対応するオープンソースのオールインワンホワイトボードです。
代替できる製品:Miro
Lucidchart
Excalidraw
- スター
- 14,960
- フォーク
- 1,300
- 未解決の Issue
- 35
- 最終コミット
- 先月
これは何?
Drawnixは、ズームやスクロールが可能な無限キャンバス上で、マインドマップやフローチャート、フリーハンドのスケッチを作成できる無料のオープンソースホワイトボードです。Mermaid構文をフローチャートに、Markdownテキストをマインドマップに変換でき、作成した内容はPNGまたは.drawnix拡張子のJSONファイルとしてエクスポートできます。
エディターはブラウザーのキャッシュに自動保存し、取り消し、やり直し、コピー、貼り付けに対応しています。また、ライトテーマとダークテーマを切り替えられます。モバイルデバイスにも対応しており、drawnix.comで利用するか、Dockerイメージを使ってセルフホストできます。
Drawnixは内部で、図表作成フレームワークのPlaitとプラグインアーキテクチャを採用しています。コードベースはTypeScriptで、既存のReactビューレイヤーとSlateベースのテキスト描画モジュールを備えています。
主な機能
- 01無限キャンバス上でのマインドマップやフローチャートの作成
- 02フリーハンド描画と画像の挿入
- 03Mermaid構文からフローチャートへの変換
- 04Markdownテキストからマインドマップへの変換
- 05PNGまたはJSON(.drawnix)へのエクスポート
- 06ブラウザーのキャッシュへの自動保存と、取り消し・やり直し
ユースケース
- マインドマップを使ったブレインストーミングやアイデアの整理
- システムアーキテクチャや業務フローのスケッチ
- ソフトウェアをインストールせずに、ブラウザーですぐにホワイトボードを利用
- Dockerを使ったプライベートなホワイトボードのセルフホスト
クイックスタート
- 1
npmで依存関係をインストールする
npm install - 2
開発サーバーを起動する
npm run start - 3
またはDockerイメージを実行する
docker pull pubuzhixing/drawnix:latest
使う前に知っておきたいこと
- READMEでは、このプロジェクトはSaaS型ツールとして紹介されており、Webアプリのdrawnix.comは「Dawn」リリース前に頻繁に変更される最小限のアプリとして説明されています。
- MermaidとMarkdown変換機能はREADMEに記載されていますが、どの程度完成しているかは明記されていません。
トピック
よくある質問
- drawnix とは?
- Plaitフレームワーク上に構築された、マインドマップ、フローチャート、フリーハンド描画、画像に対応するオープンソースのオールインワンホワイトボードです。 Drawnixは、ズームやスクロールが可能な無限キャンバス上で、マインドマップやフローチャート、フリーハンドのスケッチを作成できる無料のオープンソースホワイトボードです。Mermaid構文をフローチャートに、Markdownテキストをマインドマップに変換でき、作成した内容はPNGまたは.drawnix拡張子のJSONファイルとしてエクスポートできます。
- drawnix は無料で使えますか?ライセンスは?
- drawnix は MIT ライセンスのオープンソースです。商用製品で使う前にライセンス条件を確認してください。
- drawnix は今もメンテナンスされていますか?
- 半年以内に更新あり。drawnix の最終コミットは 2026年9月8日 です。
- drawnix は何に使えますか?
- マインドマップを使ったブレインストーミングやアイデアの整理 システムアーキテクチャや業務フローのスケッチ ソフトウェアをインストールせずに、ブラウザーですぐにホワイトボードを利用 Dockerを使ったプライベートなホワイトボードのセルフホスト
- drawnix のインストール方法は?
- npmで依存関係をインストールする: npm install 開発サーバーを起動する: npm run start またはDockerイメージを実行する: docker pull pubuzhixing/drawnix:latest
- drawnix はどこで入手できますか?
- ソースコードとインストール手順は GitHub にあります:https://github.com/plait-board/drawnix
概要はプロジェクトの README をもとに AI が生成しています。GitHub の数値は毎日更新されます。
関連プロジェクト
tldrawエンジンを基盤に、リアルタイムのチーム共同作業とAI機能を備えたオープンソースのホワイトボードアプリ。
React、React Native、素のJavaScriptアプリ向けのMITライセンスの無限キャンバス型ホワイトボードSDK。tldrawの無料代替として利用できます。
ドキュメント、ホワイトボード、テーブルを1つのワークスペースに統合する、NotionやMiroに代わるローカルファーストのオープンソース知識ベース。
Reactとcytoscape.jsで構築された、プレーンテキストのアウトラインをフローチャートや図に変換するWebアプリ。
手書き、テキスト、Markdown、図形、画像、PDFを無限キャンバス上で扱える、オープンソースのクロスプラットフォーム・ノートアプリ。