Langsung ke konten utama
Diagram teks adalah metode menggambar berbasis sintaks yang disediakan DingTalk Docs. Melalui sintaks tertentu, Anda dapat membuat diagram alur, Lini Masa, dan bagan lain yang Anda perlukan dengan cepat. Saat ini fitur ini mendukung:
  • PlantUML
  • Mermaid

I. Cara menyisipkan

Klik ikon sisipkan di bilah alat atau tombol + di awal baris kosong, lalu pilih diagram teks. Atau, ketik “/diagram teks” atau pintasan “/wbht” untuk menyisipkannya. Mendukung bahasa Mandarin dan pinyin. Sisipkan melalui bilah alat di bagian atas. Sisipkan melalui tombol [+] di awal baris kosong. Sisipkan dengan “/wbht”. Sisipkan dengan “/diagram teks”.

II. Panduan penggunaan

Pratinjau real-time:

Pada kotak input yang disisipkan, pilih sintaks dan templat yang Anda perlukan. Masukkan sintaks di sisi kiri, lalu lihat pratinjau real-time di sisi kanan.

Menampilkan diagram sebagai kartu penuh:

Klik tombol geser di tengah untuk menampilkan diagram sebagai kartu penuh.

Tampilan layar penuh:

Klik tombol layar penuh di sudut kanan atas untuk menjelajah dalam mode layar penuh.

PlantUML

PlantUML adalah proyek open source yang mendukung pembuatan cepat diagram urutan, diagram use case, diagram kelas, diagram aktivitas, diagram komponen, diagram status, diagram objek, diagram deployment, dan lainnya. Selain itu, PlantUML juga mendukung diagram non-UML seperti Lini Masa, diagram arsitektur, dan lainnya. Contohnya diagram use case berikut:

Menyisipkan kartu diagram PlantUML

  1. Klik ikon sisipkan di bilah alat atau tombol + di awal baris kosong, lalu pilih diagram teks. Atau, ketik “/diagram teks” atau pintasan “/wbht” untuk menyisipkannya. Mendukung bahasa Mandarin dan pinyin;
  2. Di sudut kanan atas kartu diagram teks, pilih “PlantUML”;
  3. Edit dengan sintaks PlantUML di sisi kiri kartu, lalu pilih templat di sisi kanan untuk melihat pratinjau diagram secara real-time.

Dukungan lainnya

Untuk detailnya, lihat http://plantuml.com. Untuk lebih banyak contoh PlantUML yang nyata, kunjungi https://real-world-plantuml.com.

Mermaid

Mermaid adalah alat menggambar berbasis Javascript yang menggunakan sintaks mirip Markdown, sehingga pengguna dapat membuat bagan dengan mudah dan cepat melalui kode.

Sintaks

Flowcharts: https://mermaid.js.org/syntax/flowchart.html Sequence diagrams: https://mermaid.js.org/syntax/sequenceDiagram.html Gant diagrams: https://mermaid.js.org/syntax/gantt.html Pie Charts: https://mermaid.js.org/syntax/pie.html

Menyisipkan kartu diagram Mermaid

  1. Klik ikon sisipkan di bilah alat atau tombol + di awal baris kosong, lalu pilih diagram teks. Atau, ketik /diagram teks atau pintasan /wbht untuk menyisipkannya. Mendukung bahasa Mandarin dan pinyin;
  2. Di sudut kanan atas kartu diagram teks, pilih “Mermaid”;
  3. Edit dengan sintaks Mermaid di sisi kiri kartu, lalu pilih templat di sisi kanan untuk melihat pratinjau diagram secara real-time.

Contoh

Diagram alur

Diagram urutan

Diagram kelas

Diagram status

Diagram ER

Lini Masa

Pai

Diagram kebutuhan

Diagram Gitgraph