Gelişiminle böyle bir ilerleme çubuğu oluşturmak için günlük notlarına YAML eklemen gerekir:

ve sonra “Mayıs 2025” notuna şu kodu ekle:

```dataviewjs
const pages = dv.pages('"2. Areas/Мой дневник/1-3 Daily notes"')
  .where(p => p.date && p.date.toString().includes("-05-2025"))

const totalDays = 31
const count = (key) => pages.filter(p => p[key] === true).length

const habits = [
  { name: "Isınma", key: "разминка" },
  { name: "Spor beslenmesi", key: "спортпитание" },
  { name: "Okuma", key: "Чтениекниг" }
]

function getColor(percent) {
  if (percent >= 80) return "#4CAF50"  // yeşil
  if (percent >= 50) return "#FFC107"  // sarı
  return "#F44336"                     // kırmızı
}

if (pages.length === 0) {
  dv.paragraph("❌ Mayıs için veri yok.");
} else {
  const container = this.container

  habits.forEach(habit => {
    const current = count(habit.key)
    const percent = Math.round((current / totalDays) * 100)
    const color = getColor(percent)

    const block = document.createElement("div")
    block.style.marginBottom = "16px"

    const label = document.createElement("div")
    label.textContent = `${habit.name}: ${percent}%`
    label.style.fontWeight = "bold"
    label.style.marginBottom = "4px"

    const barContainer = document.createElement("div")
    barContainer.style.background = "#eee"
    barContainer.style.borderRadius = "6px"
    barContainer.style.height = "16px"
    barContainer.style.width = "100%"
    barContainer.style.overflow = "hidden"

    const bar = document.createElement("div")
    bar.style.background = color
    bar.style.height = "100%"
    bar.style.width = `${percent}%`
    bar.style.transition = "width 0.3s"

    barContainer.appendChild(bar)
    block.appendChild(label)
    block.appendChild(barContainer)
    container.appendChild(block)
  })
}```

→ const pages = dv.pages(‘“2. Areas/Мой дневник/1-3 Daily notes”’) — YAML’lı notlarının bulunduğu kendi yolunla değiştir → Son üç apostrof karakterini yeni bir satıra taşı

---

🧠 Bu kodu daha derin anlamak isteyenler için açıklama:

📁 1. Günlük notlarına ne eklemen gerekiyor

---

💻 2. Kod “Mayıs 2025” notunda nasıl görünüyor

Ay notunda (örn. Mayıs 2025), şu kodu ekle:

```dataviewjs
const pages = dv.pages('"2. Areas/Мой дневник/1-3 Daily notes"')
  .where(p => p.date && p.date.toString().includes("-05-2025"))

🛠 Açıklama:

• pages — klasördeki tüm günlükleri alıyoruz.

• Yalnızca Mayıs 2025 için filtreliyoruz (includes("-05-2025")).

• Yolu kendi yolunla değiştirmeyi unutma!

---

const totalDays = 31
const count = (key) => pages.filter(p => p[key] === true).length

• totalDays — aydaki toplam gün sayısı.

• count() — alışkanlığın kaç gün yapıldığı.

---

const habits = [
  { name: "Isınma", key: "разминка" },
  { name: "Spor beslenmesi", key: "спортпитание" },
  { name: "Okuma", key: "Чтениекниг" }
]

🔑 Burada takip edeceğin alışkanlık listesini belirlersin.

• name — ekranda nasıl adlandırılacağı.

• key — alanın YAML’da nasıl yazıldığı.

---

function getColor(percent) {
  if (percent >= 80) return "#4CAF50"  // yeşil
  if (percent >= 50) return "#FFC107"  // sarı
  return "#F44336"                     // kırmızı
}

🟩 Yeşil = harikasın 🟨 Sarı = çabalıyorsun 🟥 Kırmızı = disiplin lazım

---

📊 Görselleştirme

habits.forEach(...) döngüsünün içinde şunlar oluşturulur:

• alışkanlığın tamamlanma yüzdesiyle metin;

• gri çubuklu bir kapsayıcı;

• %‘ye göre dolan renkli bir ilerleme çubuğu.

---

✅ Sonuçta ne elde edersin

Ay için bir alışkanlık paneli elde edersin:

• Güzel.

• Motive edici.

• Doğrudan notunda — dış takipçilere gerek yok.