Mermaid Gantt şeması editörü
Gantt şeması işi takvimin üzerine yerleştirir: ne ne kadar sürüyor, ne nerede örtüşüyor, ne bitmeden ne başlayamıyor. Tarihler ve bağımlılıklar asıl konuysa buna uzanın. Yalnızca sıraya ihtiyacınız varsa ve tarihlere yoksa, akış şeması daha hafiftir ve plan her kaydığında çürümez.
Bağımlılıkları ve kilometre taşı olan bir sürüm planı
Bunu paslardan ibaret bir resim olmaktan çıkarıp Gantt şeması yapan şey `after a1`: bağımlılık bildirildiği için ilk işi kaydırmak ardından gelen her şeyi kaydırır. Kilometre taşı ise zaman tutmayan sabit bir tarihi işaretler. İlk satırdaki `dateFormat DD.MM.YYYY` isteğe bağlı değil — onsuz aşağıda anlatılan tarih tuzağına düşersiniz.
gantt
title Sürüm 2.4
dateFormat DD.MM.YYYY
axisFormat %d.%m
excludes weekends
section Geliştirme
API sözleşmesi :done, a1, 07.01.2026, 10d
Uygulama :active, a2, after a1, 20d
İç testler : a3, after a2, 8d
section Sürüm
Kararlılık süresi : b1, after a3, 5d
Sürüm kararı :milestone, m1, after b1, 0d
Üretime alma :crit, b2, after m1, 3dÇözümlü örnekler
1. En basit doğru şema
`dateFormat` Mermaid'e yazdığınız tarihleri NASIL OKUYACAĞINI söyler; `axisFormat` ise eksende NASIL GÖSTERİLECEĞİNİ. Bunlar iki ayrı ayardır ve karıştırılmaları Gantt'ta yaşanan sıkıntının en yaygın kaynağıdır.
gantt
title Sprint 14
dateFormat DD.MM.YYYY
section İş
Arama motorunu kur :02.03.2026, 10d2. Görev kimlikleri ve bağımlılıklar
Göreve kimlik vermek sonrakilerin `after <kimlik>` yazmasına izin verir. Bağımlılıklar bildirildiğinde başlangıç tarihini tek yerde değiştirirsiniz, planın geri kalanı peşinden gelir.
gantt
title Veri taşıma
dateFormat DD.MM.YYYY
section Hazırlık
Şema incelemesi :a1, 02.02.2026, 5d
Eşleme kurallarını yaz :a2, after a1, 8d
section Uygulama
Prova geçişi :a3, after a2, 3d
Anahtarı çevir :a4, after a3, 1d3. Durum anahtar sözcükleri
`done`, `active` ve `crit` çubuğun çizimini değiştirir. Şemanın yalnızca «plan neydi» sorusuna değil «neredeyiz» sorusuna da cevap vermesinin en ucuz yolu budur.
gantt
title Platform, ilk çeyrek
dateFormat DD.MM.YYYY
section Altyapı
Terraform temizliği :done, t1, 05.01.2026, 12d
Kubernetes yükseltme :active, t2, 19.01.2026, 15d
Maliyet gözden geçirme : t3, after t2, 5d
section Güvenlik
Bağımlılık denetimi :crit, s1, 12.01.2026, 6d4. Kilometre taşları
Kilometre taşı bir aralık değil bir noktadır: ona `0d` verin. Bunları projenin dışından belirlenen tarihler için kullanın — bir fuar, sözleşmeden gelen bir süre, kod dondurma.
gantt
title Lansman planı
dateFormat DD.MM.YYYY
section Mühendislik
Kapsam dondurma :milestone, m1, 01.04.2026, 0d
Hata avı : e1, 01.04.2026, 5d
Sürüm dalı :milestone, m2, after e1, 0d
section İletişim
Basın ambargosu biter :milestone, m3, 15.04.2026, 0d5. Hafta sonlarını ve resmî tatilleri çıkarmak
`excludes weekends` sürelerin cumartesi ve pazarı saymamasını sağlar, böylece 10 günlük iş hafta sonunun ortasında bitmek yerine iki iş haftası sürer. Resmî tatiller ise tarih tarih çıkarılır; Türkiye'de nisan ve mayısta bunun etkisi hatırı sayılır olur.
gantt
title Yeni servisin devreye alınması
dateFormat DD.MM.YYYY
excludes weekends, 23.04.2026, 01.05.2026, 19.05.2026
section Kurulum
Altyapıyı ayağa kaldır :p1, 20.04.2026, 5d
CI/CD bağla :p2, after p1, 5d
section Devir
Kılavuz ve eğitim :p3, after p2, 4dGantt şeması sözdizimi özeti
Altı tip içinde Gantt tek bir yerde — görev satırında — en katı, geri kalan her şeyde en hoşgörülüdür. Bu kadar çok hatanın fark edilmeden geçmesinin nedeni tam olarak budur.
| Sözdizimi | Anlamı |
|---|---|
| gantt | Diyagramı açar. |
| title Metin | Şemanın başlığı. Noktalı i ile yazılmalıdır. |
| dateFormat DD.MM.YYYY | Yazdığınız tarihlerin NASIL AYRIŞTIRILACAĞI. Türkçe için doğru satır budur. |
| dateFormat YYYY-MM-DD | ISO biçimi, öntanımlı ayar. |
| axisFormat %d.%m.%Y | Tarihlerin eksende NASIL GÖSTERİLECEĞİ. dateFormat'tan ayrı bir ayardır. |
| excludes weekends | Süre hesabında cumartesi ve pazarı atla. |
| excludes 29.10.2026 | Belirli bir tarihi çıkar. Resmî tatiller böyle kaldırılır. |
| section Ad | Görevleri adlandırılmış bir şeride toplar. |
| Görev :id, 01.01.2026, 10d | Açık başlangıcı ve süresi olan görev. |
| Görev :id, after diğer, 10d | `diğer` bittikten sonra başlayan görev. |
| Görev :done, id, ... | Tamamlandı — soluk çizilir. |
| Görev :active, id, ... | Sürüyor — vurgulu çizilir. |
| Görev :crit, id, ... | Kritik — vurgu rengiyle çizilir. |
| Ad :milestone, id, tarih, 0d | Aralık değil, zamanda bir nokta. |
| 10d / 3w / 2h | Gün, hafta, saat cinsinden süre. Birim zorunludur. |
Gantt'ın altı tuzağı — yalnızca ikisi hata verir
Gantt'ı diğer beş tipten ayıran şey budur. Mermaid 11.12.2 üzerinde yeniden üretildi: aşağıdaki altıdan yalnızca ikisi çizimi durdurur. Kalan dördü gayet inandırıcı ve yanlış bir takvim üretir; bu çok daha tehlikelidir, çünkü çizilmiş bir şemayı kimse yeniden denetlemez.
Ne görüyorsunuz
Parse error, sonu: Expecting 'taskData', got 'NL'
Neden
`title` sözcüğünde noktasız ı var. Bu Türkçe yazarken en kolay düşülen tuzaktır ve hata iletisi sizi tamamen yanlış yere gönderir. Ölçüldü: `tıtle Sürüm 2.4` anahtar sözcük olarak tanınmaz, bu yüzden Mermaid satırı iki noktası eksik bir görev satırı sanır ve tam olarak yukarıdaki iletiyi verir. Yani ileti başlıktan hiç söz etmez; sizi görev satırlarını incelemeye yollar, oysa oralarda bir sorun yoktur.
Çözüm
Başlığı noktalı i ile yazın. Aynısı `sequenceDiagram`, `classDiagram`, `stateDiagram-v2` ve `erDiagram` için de geçerlidir.
gantt
tıtle Sürüm 2.4
dateFormat DD.MM.YYYY
section İş
Tasarım :a1, 07.01.2026, 5dgantt
title Sürüm 2.4
dateFormat DD.MM.YYYY
section İş
Tasarım :a1, 07.01.2026, 5dNe görüyorsunuz
Parse error, sonu: Expecting 'taskData', got 'NL'
Neden
İki noktası olmayan bir görev satırı. İki nokta, görünen adı görev verisinden ayırır; onsuz ayrıştırılacak bir şey kalmaz. İletinin bir öncekiyle harfi harfine aynı olduğuna dikkat edin — Mermaid bu iki ayrı hatayı birbirinden ayırt etmez, bu yüzden bu iletiyi gördüğünüzde ilk satırdaki anahtar sözcükleri de görev satırlarını da denetlemeniz gerekir.
Çözüm
Ad ile kimlik arasına iki nokta koyun.
gantt
dateFormat DD.MM.YYYY
section İş
Tasarım a1, 07.01.2026, 5dgantt
dateFormat DD.MM.YYYY
section İş
Tasarım :a1, 07.01.2026, 5dNe görüyorsunuz
Şema çizilir, ama tarihler iki ay öne düşer
Neden
Türkçe yazarken karşılaşılan en pahalı hata budur. Tarihi 01.03.2026 diye yazarız ve 1 Mart'ı kastederiz, ama öntanımlı `dateFormat` ISO'dur ve ayraçlı bir tarihi Mermaid Amerikan sırasıyla, önce ay olarak okur. Ölçüldü: `dateFormat YYYY-MM-DD` altında `01.03.2026` görevi 3 Ocak'a yerleştirir; eksende beliren ilk tarih 03.01.2026 olur. Hiçbir uyarı yoktur; şema kusursuz görünür ve iki ay kaymıştır. Eğik çizgi kullanmak da bir şey değiştirmez.
Çözüm
`dateFormat DD.MM.YYYY` bildirin ve tarihleri her zamanki gibi yazın. Sınandı: bu biçimle `01.03.2026` tam olarak 1 Mart'a düşer.
gantt
dateFormat YYYY-MM-DD
axisFormat %d.%m.%Y
section S
Tasarım :a1, 01.03.2026, 10dgantt
dateFormat DD.MM.YYYY
axisFormat %d.%m.%Y
section S
Tasarım :a1, 01.03.2026, 10dNe görüyorsunuz
Görev adı ilk iki noktada kesilir
Neden
Görev adının içinde iki nokta var. İlk iki nokta ayraçtır, bu yüzden ondan sonrası görev verisi diye okunur. Ölçüldü: `Aşama 1: tasarım` adlı bir görev şemaya yalnızca `Aşama 1` olarak çıkar, «tasarım» sözcüğü yok olur. Bölüm adları bundan etkilenmez — sınandı.
Çözüm
Görev adlarında iki nokta kullanmayın. Uzun çizgi koyun ya da ayrıntıyı bölüm adına taşıyın.
gantt
dateFormat DD.MM.YYYY
section S
Aşama 1: tasarım :a1, 07.01.2026, 10dgantt
dateFormat DD.MM.YYYY
section S
Aşama 1 — tasarım :a1, 07.01.2026, 10dNe görüyorsunuz
Çubuk hiçliğe doğru büzülür
Neden
Birimsiz süre. `5` beş gün demek değildir: birim zorunludur ve onsuz görev anlamlı bir uzunluk almaz. Şema yine de çizilir, görev ise zaman tutmuyormuş izlenimi verir.
Çözüm
Birimi her zaman yazın: `5d`, `3w`, `2h`.
gantt
dateFormat DD.MM.YYYY
section S
Tasarım :a1, 07.01.2026, 5gantt
dateFormat DD.MM.YYYY
section S
Tasarım :a1, 07.01.2026, 5dNe görüyorsunuz
Süreler doğru, ama bitiş tarihleri gerçekle uyuşmuyor
Neden
`excludes weekends` eksik. Öntanımlı olarak 10 günlük iş, hafta sonları dahil on takvim günüdür, bu yüzden bir iş haftasından uzun her şey şemada gerçekte olduğundan erken biter. Türkiye'de buna nisan ve mayısa sıkışan resmî tatiller eklenir; bir çeyrek boyunca biriken sapma toplantıda savunulması güç bir hale gelir.
Çözüm
Başlara `excludes weekends` ekleyin, ardından resmî tatil tarihlerini yazın — iş gerçekten haftanın yedi günü yürümüyorsa.
gantt
dateFormat DD.MM.YYYY
section S
Taşıma :a1, 20.04.2026, 10dgantt
dateFormat DD.MM.YYYY
excludes weekends, 23.04.2026, 01.05.2026
section S
Taşıma :a1, 20.04.2026, 10dÇizim üzerine notlar
Bu sitenin kullandığı Mermaid 11.12.2 üzerinde ölçüldü. Gantt bütün diğer tiplerden farklı davranır.
Çizim genişliği sabit olan tek tip
Bu sitedeki diğer bütün diyagramlar içerikleri hangi yöne büyüyorsa o yöne büyür. Gantt şemasının viewBox genişliği ise üç görevde de kırk görevde de her zaman 1264 pikseldir; yalnızca yükseklik değişir, ölçülen aralık yaklaşık 172 ile 1060 piksel arasıdır. Eksen bu sabit genişliğe sığmak için sıkıştırılır ya da gerilir; iki yıllık planla iki haftalık planın aynı yoğunlukta görünmesinin nedeni budur. Çubuklar okunamayacak kadar inceyse sorun görev sayısı değil, tarih aralığıdır.
Tarihteki noktalar yardımcı olmaz — ayrıştırma yine Amerikan sırasıyla yapılır
Bunu burada yineliyorum, çünkü Türkçe yazarken en pahalı tuzak budur. Ölçüldü: `dateFormat YYYY-MM-DD` altında `01.03.2026` ne hata ne uyarı verir, yalnızca 3 Ocak'a oturur — ayraç olarak nokta kullanmak motora bunun gün ve ay olduğunu hiçbir biçimde sezdirmez. Eğik çizgiyle de aynısı olur. Bildirilen `dateFormat DD.MM.YYYY` sorunu tümüyle çözer. Her Türkçe Gantt'a eklenecek ilk satır budur.
Noktasız ı burada hata iletisini de yanıltıcı kılar
Diğer diyagram tiplerinde noktasız ı «No diagram type detected» verir ve bu en azından ilk satıra bakmanız gerektiğini söyler. Gantt'ta durum daha kötüdür: ölçüldü, `tıtle` yazmak `Expecting 'taskData', got 'NL'` verir, yani iki noktası unutulmuş bir görev satırıyla aynı iletiyi. Bu iletiyi alıp görev satırlarında hiçbir sorun bulamıyorsanız, ilk satırlardaki anahtar sözcüklerin noktalı i ile yazıldığına bakın.
PNG dışa aktarımı piksel piksel doğru
Gantt etiketlerini gömülü HTML olarak değil sıradan SVG metniyle çizer, bu yüzden — akış şeması ile sınıf, durum ve ER diyagramlarının aksine — doğrudan rasterlenebilir. Dışa aktarılan PNG ekrandakine birebir karşılık gelir, araya yeniden çizim girmez ve metin dizgisinde kayma olmaz.
Dilbilgisi iki nokta dışında her yerde hoşgörülü
Eksik bölümler, tanınmayan durum anahtar sözcükleri, yanlış biçimli tarihler ve birimsiz süreler — hepsi çizilir. Doğrudan geri çevrilen tek şey iki noktası olmayan görev satırıdır. Bu asimetri, Gantt şeması yazmak konusunda bilinebilecek en yararlı şeydir: şemanın çizilmiş olması, doğru olup olmadığı hakkında neredeyse hiçbir şey söylemez.
Başka bir diyagramın daha uygun olduğu durumlar
Tarihler tahminse, Gantt şeması onları hak etmedikleri bir kesinlikle sunar ve bunu sonra size hatırlatan biri çıkar. Tarihsiz olarak sırayı gösteren bir akış şeması daha dürüsttür ve plan kaydığında düzeltme istemez.
Plan her hafta değişiyorsa, sürüm denetimi altındaki metin tabanlı Gantt gerçekten iyidir — neyin kaydığı diff'ten görülür — ama kimsenin güncellemediği bir diyagram, diyagramsızlıktan kötüdür. İkisinden hangisini yaptığınızı serinkanlılıkla değerlendirin.
İş yükü dengeleme, kapasite ya da kişi bazında atama söz konusuysa bu yanlış araçtır. Mermaid takvimin üzerine çubuk çizer; işi kimin yaptığını ya da o kişinin zaten dolu olup olmadığını bilmez.
Diğer diyagram türleri
Yazan Dominik Malsch · Son güncelleme: