Diagrammer
Live PreviewVisualizer teks ke diagram interaktif untuk Mermaid, PlantUML, Graphviz, dan D2. Pan & zoom mulus, ekspor SVG/PNG tajam, dan bagikan tautan instan.
Kesalahan Sintaks Diagram
Panduan & Pertanyaan Umum
Semua hal tentang cara memvisualisasikan arsitektur sistem, alur proses, dan mengekspor diagram.
Q: Bagaimana cara kerja live preview diagram di Diagrammer?
Saat kamu mengetik atau mengubah kode diagram di editor, Diagrammer otomatis me-render ulang diagram ke canvas SVG interaktif dengan debounce ~350ms. Diagram Mermaid di-render 100% secara lokal di browser, sedangkan PlantUML dan Graphviz menggunakan generator SVG vector berkecepatan tinggi.
Q: Bagaimana cara menggeser (Pan) dan memperbesar (Zoom) canvas diagram?
Kamu bisa klik dan seret (drag) di mana saja pada area canvas untuk menggeser posisi diagram. Gunakan scroll wheel mouse atau touchpad untuk zoom in/out secara presisi. Kamu juga bisa menekan tombol '+' dan '-' di toolbar canvas, atau klik 'Reset Fit' untuk memusatkan kembali diagram ke ukuran pas.
Q: Apakah saya bisa mengekspor diagram untuk dokumentasi atau presentasi?
Tentu! Klik menu 'Export' di pojok kanan atas untuk mengunduh berkas vektor SVG tajam atau gambar PNG beresolusi tinggi. Kamu juga bisa menyalin langsung kode markup SVG mentah maupun format snippet Markdown yang siap ditempel ke GitHub, Notion, atau blog.
Q: Bagaimana cara kerja fitur Bagikan Link (Share Link)?
Saat kamu menekan 'Share Link', mesin diagram dan teks kode kamu akan dikompresi serta disematkan langsung ke dalam hash URL (#). Siapa pun yang membuka tautan tersebut akan langsung melihat kode dan visual diagram yang sama tanpa perlu login atau database server.
Q: Apakah kode diagram saya aman dan terjaga privasinya?
Sangat aman! Untuk diagram Mermaid, seluruh proses kompilasi dijalankan 100% di browser lokal kamu. Pada mesin PlantUML/Graphviz, teks diagram dikonversi menjadi gambar SVG melalui koneksi terenkripsi HTTPS tanpa menyimpan data pribadi atau kode kamu di server luar.