Drawnix: ein Open-Source-Whiteboard-Tool mit integriertem Mind Mapping und Flowcharting

Drawnix ist ein leistungsfähiges Open-Source-Online-Whiteboard-Tool, das Mindmapping-, Flowcharting- und Handzeichnungsfunktionen auf einer unendlichen Leinwand integriert und den Benutzern die Freiheit gibt, etwas zu schaffen. Drawnix wurde auf der Grundlage einer Plug-in-Architektur entwickelt, wodurch es in hohem Maße erweiterbar ist und verschiedene Front-End-Frameworks und Rich-Text-Editoren unterstützen kann. Das Tool unterstützt Autosave, das Daten im Browser-Cache speichert und so Datenverluste effektiv verhindert. Darüber hinaus unterstützt es den Export von Inhalten in mehrere Formate und bietet sowohl auf dem Desktop als auch auf mobilen Geräten eine gleichbleibend gute Darstellung. Für Benutzer, die es gewohnt sind, Code zur Erstellung von Diagrammen zu verwenden, unterstützt Drawnix auch die direkte Konvertierung in Flussdiagramme und Mind Maps über Mermaid-Syntax und Markdown-Text.

Funktionsliste

• frei und quelloffenBenutzer können alle Funktionen kostenlos nutzen, sowie sekundäre Entwicklung und privaten Einsatz nach ihren Bedürfnissen.
• multifunktionale Integration:: Unterstützt Mindmapping, Flussdiagramme, Handzeichnungen, Formzeichnungen, Linien- und Textwerkzeuge, um verschiedene Zeichenanforderungen zu erfüllen.
• Plug-in-ArchitekturDas Framework basiert auf dem Plait-Framework, das die Integration einer Vielzahl von UI-Frameworks (z.B. Angular, React) und Rich-Text-Frameworks unterstützt.
• Unbegrenzte LeinwandUnbegrenzter kreativer Spielraum: Die Benutzer können die Leinwand nach Belieben vergrößern und verschieben.
• automatische SpeicherungPlotting-Inhalte werden automatisch im Browser-Cache gespeichert, um Datenverluste durch unvorhergesehene Umstände zu vermeiden.
• Mehrere ExportformateUnterstützung des Exports von Werken in Bildformaten wie PNG, JPG, usw. oder.drawnixder JSON-Datei.
• Theme-ModusVerschiedene Themen sind integriert, darunter die Modi Standard, Bunt, Weich, Retro, Dunkle Nacht und Sternennacht, zwischen denen der Benutzer je nach Vorliebe wechseln kann.
• Plattformübergreifende NutzungResponsive Design sorgt für ein großartiges Betriebserlebnis auf Desktop- und Mobilgeräten.
• Codegenerierte DiagrammeUnterstützung für die Konvertierung von Codeblöcken in Flussdiagramme mit der Mermaid-Syntax und für die Konvertierung von Markdown-Text in eine Mindmap (neue Unterstützung 🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥).
• Umfangreiche Editierfunktionen:: Bietet grundlegende Bearbeitungsfunktionen wie Rückgängig machen, Wiederherstellen, Kopieren und Einfügen.

Hilfe verwenden

Drawnix ist so konzipiert, dass die Benutzer direkt auf die offizielle Website https://drawnix.com gehen können, um loszulegen, ohne Software herunterladen oder installieren zu müssen.

Lokale Installation und Bereitstellung

Für diejenigen, die eine sekundäre Entwicklung oder einen privaten Einsatz durchführen möchten, können Sie die folgenden Schritte befolgen, um Drawnix in Ihrer lokalen Umgebung zu installieren.

Umweltanforderungen.
Bevor Sie beginnen, vergewissern Sie sich, dass Ihr Computer über dieNode.js.

Installationsschritte.

1. Quellcode herunterladen:
   Besuchen Sie die GitHub-Repository-Seite von Drawnix (https://github.com/plait-board/drawnix), klicken Sie auf der Seite auf die Schaltfläche "Code", und wählen Sie dann "Download ZIP ", um den Quellcode des Projekts lokal herunterzuladen.
2. Entpacken Sie die Datei:
   Entpacken Sie die heruntergeladene ZIP-Datei in einen beliebigen Ordner Ihrer Wahl.
3. Installation von Abhängigkeiten:
   Öffnen Sie ein Befehlszeilentool (z. B. Terminal oder CMD) und wechseln Sie in das Stammverzeichnis des extrahierten Projekts. Führen Sie den folgenden Befehl aus, um die erforderlichen Abhängigkeitspakete für das Projekt zu installieren:

npm install

Dieser Vorgang kann einige Zeit in Anspruch nehmen, da alle erforderlichen Abhängigkeiten heruntergeladen und installiert werden müssen.

4. Initiierung von Projekten:
   Sobald die Installation der Abhängigkeiten abgeschlossen ist, führen Sie den folgenden Befehl in der Befehlszeile aus, um die Drawnix-Anwendung zu starten:

npm run start

Nachdem der Befehl erfolgreich ausgeführt wurde, sehen Sie in der Befehlszeile, dass die Anwendung erfolgreich gestartet wurde, und Sie werden aufgefordert, auf diehttp://localhost:4200(oder ein anderer Anschluss wie angegeben).

5. Zugang zu Anwendungen:
   Öffnen Sie Ihren Browser und geben Sie die obige Adresse ein, um die volle Funktionalität von Drawnix in Ihrer lokalen Umgebung zu nutzen.

Kernfunktionen Betriebsanleitung

1. denkende Karten

• Knotenpunkte erstellenDoppelklicken Sie mit der Maus auf eine leere Stelle auf der Leinwand, um einen Wurzelknoten zu erstellen.
• Hinzufügen von KindknotenMarkieren Sie einen Knoten und Sie sehen ein "+"-Symbol um den Knoten herum. Klicken Sie darauf, um einen untergeordneten Knoten unterhalb des Knotens zu erstellen.
• Text bearbeitenDoppelklicken Sie auf einen beliebigen Knoten, um in den Textbearbeitungsmodus zu gelangen. Sie können den Textinhalt des Knotens ändern.
• Ziehen und Ablegen (Datenverarbeitung)Ziehen eines Knotens bei gedrückter linker Maustaste verändert seine Position in der Mind Map. Wenn Sie ihn auf einen anderen Knoten ziehen, ändert sich seine Eltern-Kind-Beziehung.

2. ein Flussdiagramm

• Grafiken erstellenWählen Sie die gewünschte Form des Flussdiagramms (z. B. Rechteck, Raute, Kreis usw.) aus der Symbolleiste auf der linken Seite aus und ziehen Sie sie dann auf die Leinwand, um sie zu zeichnen.
• AnschlussleitungWählen Sie ein Diagramm aus und fahren Sie mit der Maus über die Ränder des Diagramms, woraufhin Verbindungspunkte erscheinen. Halten Sie die linke Maustaste gedrückt und ziehen Sie vom Verbindungspunkt eines Diagramms zum Verbindungspunkt eines anderen Diagramms, um eine Verbindungslinie zu erstellen.
• Hinzufügen von PfeilenWenn Sie eine Linie vom Rand einer Figur ziehen, können Sie Pfeile mit Richtungen erstellen, um die Richtung des Flusses anzuzeigen.

3. freihändiges Zeichnen und Formwerkzeuge

• PinselwerkzeugPinsel: Wählen Sie das Pinselwerkzeug in der linken Werkzeugleiste, um direkt auf der Leinwand freihändig zu zeichnen, was sich für Skizzen und schnelle Beschriftungen eignet.
• Form-ToolsDie Symbolleiste bietet eine Vielzahl von Grundformen wie Rechtecke, Kreise, Dreiecke usw., die ausgewählt und direkt auf der Leinwand gezeichnet werden können.
• Bild einfügenDurch Anklicken des Bildsymbols in der Symbolleiste können Sie ein lokales Bild hochladen und an einer beliebigen Stelle auf der Leinwand einfügen.

4. die Unterstützung der Mermaid- und Markdown-Syntax

• Markdown zu Mind MapWählen Sie das Markdown-Werkzeug in der Werkzeugleiste, fügen Sie den geschriebenen Markdown-Text ein und Drawnix wandelt ihn automatisch in eine strukturierte Mind Map um.
• Meerjungfrau zum FlussdiagrammIn ähnlicher Weise kann durch die Auswahl des Mermaid-Werkzeugs und das Einfügen des Codes für die Mermaid-Syntax schnell das entsprechende Flussdiagramm erstellt werden.

5. leinwandbezogene Vorgänge

• SchwenkenHalten Sie die mittlere Maustaste gedrückt oder drücken Sie die linke Maustaste, während Sie die Leertaste gedrückt halten, um die Leinwand zum Schwenken zu ziehen.
• Zoom (Grafik)Mit dem Mausrad können Sie ganz einfach in die Leinwand hinein- und aus ihr herauszoomen und so stufenlos navigieren.

Anwendungsszenario

1. Teamarbeit und Brainstorming
   In Teambesprechungen können die Mitglieder mit Drawnix gemeinsam auf einer unendlichen Leinwand ein Brainstorming durchführen, Ideen in Echtzeit aufzeichnen, Mind Maps zeichnen und die Ergebnisse der Diskussion in einem Flussdiagramm organisieren, was die Effizienz der Zusammenarbeit erheblich verbessert.
2. Projektplanung und -management
   Projektmanager können mit Drawnix Projektflussdiagramme und Mindmaps des Projektstrukturplans (WBS) erstellen und die Verbindungen und Abhängigkeiten zwischen den verschiedenen Projektphasen klar darstellen, so dass sie für die Teammitglieder leicht zu verstehen und auszuführen sind.
3. Lernen und Wissensorganisation
   Studenten und Forscher können Drawnix verwenden, um ihre Unterrichtsnotizen zu organisieren, Mindmaps ihres Wissensbestands zu erstellen oder komplexe wissenschaftliche Flussdiagramme zu zeichnen, um abstraktes Wissen visuell zugänglich zu machen.
4. Softwareentwurf und -architektur
   Software-Entwickler und -Architekten können Drawnix verwenden, um Systemarchitekturdiagramme, UML-Diagramme und Datenflussdiagramme zu zeichnen, um Teams zu helfen, Software-Design und Interaktionslogik zwischen Modulen besser zu verstehen.

QA

1. Ist Drawnix völlig kostenlos?
   Ja, Drawnix ist ein völlig kostenloses und quelloffenes Werkzeug. Sie können alle Funktionen kostenlos nutzen, und es steht Ihnen auch frei, es zweimal zu entwickeln oder privat einzusetzen.
2. Sind meine Daten sicher?
   Drawnix speichert Ihre Zeichnungsdaten automatisch und standardmäßig im lokalen Cache Ihres Browsers. Das bedeutet, dass die Daten auf Ihrem eigenen Gerät gespeichert und nicht auf einen Cloud-Server hochgeladen werden, wodurch sie privat bleiben.
3. Welche Exportformate werden von Drawnix unterstützt?
   Derzeit können Sie den Inhalt der Leinwand in gängige Bildformate wie PNG, JPG usw. exportieren, aber auch in.drawnixJSON-Dateien für den einfachen späteren Import und die Bearbeitung.
4. Muss ich ein Konto einrichten, um es nutzen zu können?
   Nein. Drawnix ist so konzipiert, dass es "out of the box" funktioniert, d.h. Sie müssen nur die offizielle Website öffnen und können sofort mit der Erstellung beginnen, ohne Registrierung oder Anmeldung.