GitHub, Mermaid oluşturucuyu kullanarak md dosyalarına dinamik grafikler ekleme özelliğini ekledi. Bundan önce, çizelgeler resim olarak eklendi veya bir ASCII tablosundan karakterler kullanılarak "çizildi". Şimdi, Markdown'ın biçimlendirme sözdizimine şemalar için tam destek eklendi.

Mermaid, JavaScript tabanlı bir çizelge ve grafik aracıdır. Bununla dinamik olarak akış çizelgeleri, UML şemaları, kesinleştirme grafikleri ve Gantt çizelgeleri oluşturabilirsiniz. GitHub ekibi, platforma yerel Mermaid sözdizimi desteğini getirmek için CommonMark'taki geliştiricilerle birlikte çalıştı.

md dosyasında deniz kızı olarak işaretlenmiş bir kod bloğu ile her karşılaşıldığında, sistem yeni bir iframe oluşturur, ham kodu bloktan alır, Mermaid.js'ye iletir ve kodu bir grafiğe dönüştürür. Bütün bunlar kullanıcının tarayıcısında yerel olarak gerçekleşir.

Aşağıdaki kod bloğu, içeriği dinamik olarak değiştirilebilen tam teşekküllü bir grafiğe dönüştürülecektir:

``` deniz kızı grafiği TD; A--B; A--C; B--D; C--D;```Bir iframe etiketine bir grafik eklemek, sayfayı düzgün bir şekilde oluşturmanıza ve dosyanın içeriğini bozmamanıza olanak tanır ve eşzamansız oluşturma, aynı anda birkaç grafiğin görüntülenmesini kolaylaştırır.

bbabo.Net