Для создания вот такой таблицы, вам нужны установить плагин Dataview, а также включить в заметке YAML

Как выглядит простая таблица, которая берет информацию из YAML:

Код для вставки:

```dataviewjs
const pages = dv.pages('"2. Areas/Занятие спортом/Динамика веса"')
  .where(p => p.Вес && p.date)
  .sort(p => p.date);

const labels = pages.map(p => new Date(p.date).toLocaleDateString()).array();
const values = pages.map(p => p.Вес).array();
const goal = 80;
const goals = labels.map(() => goal); // Целевая линия

const chartData = {
  type: 'line',
  data: {
    labels: labels,
    datasets: [
      {
        label: "Вес (кг)",
        data: values,
        borderColor: "blue",
        fill: false,
        tension: 0.3
      },
      {
        label: "Цель (80 кг)",
        data: goals,
        borderColor: "green",
        borderDash: [5, 5],
        pointRadius: 0,
        fill: false
      }
    ]
  },
  options: {
    responsive: true,
    plugins: {
      title: {
        display: true,
        text: "📈 Рост веса к цели"
      },
      legend: {
        position: "bottom"
      }
    },
    scales: {
      y: {
        title: {
          display: true,
          text: "Вес (кг)"
        },
        suggestedMin: 65,
        suggestedMax: 85
      },
      x: {
        title: {
          display: true,
          text: "Дата"
        }
      }
    }
  }
};

window.renderChart(chartData, this.container);```

→ const pages = dv.pages(‘“2. Areas/Занятие спортом/Динамика веса”’) — заменить на свой путь, в котором лежат наши заметки с YAML → Последние три символа апострофа перенести на новую строку

---

🧠 Пояснение для тех, кто хочет глубже понимать о чем этот код:

🔹 Что делает код:

• Ищет все заметки из нужной папки;

• Фильтрует только те, где есть Вес и date;

• Сортирует по дате — чтобы точки шли по порядку.

📌 💡 Замените путь на свой, если у вас другая папка.

---

const labels = pages.map(p => new Date(p.date).toLocaleDateString()).array();
const values = pages.map(p => p.Вес).array();

🔹 Что делает:

• labels — это даты, по которым строим график.

• values — сами значения веса.

---

const goal = 80;
const goals = labels.map(() => goal); // Целевая линия

🔹 Что делает:

• Мы задаём цель — например, 80 кг.

• Создаём вторую линию на графике — она будет прямой, чтобы видеть, насколько ты близко к цели.

---

🧱 Настройка самого графика

const chartData = {
  type: 'line',
  data: {
    labels: labels,
    datasets: [
      {
        label: "Вес (кг)",
        data: values,
        borderColor: "blue",
        fill: false,
        tension: 0.3
      },
      {
        label: "Цель (80 кг)",
        data: goals,
        borderColor: "green",
        borderDash: [5, 5],
        pointRadius: 0,
        fill: false
      }
    ]
  },

🔹 Что делает:

• Строит две линии:

  • синяя линия — твой реальный прогресс;

  • зелёная пунктирная — целевой вес.

• tension: 0.3 — сглаживает линии (выглядит эстетично).

• borderDash — пунктир для цели, чтобы визуально отличать.

---

⚙️ Настройка внешнего вида

  options: {
    responsive: true,
    plugins: {
      title: {
        display: true,
        text: "📈 Рост веса к цели"
      },
      legend: {
        position: "bottom"
      }
    },
    scales: {
      y: {
        title: {
          display: true,
          text: "Вес (кг)"
        },
        suggestedMin: 65,
        suggestedMax: 85
      },
      x: {
        title: {
          display: true,
          text: "Дата"
        }
      }
    }
  }
};

🔹 Что делает:

• Добавляет заголовок.

• Помещает легенду внизу.

• Ограничивает ось Y (от 65 до 85 кг) — чтобы график не был слишком “плоским”.

• Подписывает оси.

---

window.renderChart(chartData, this.container);

🔹 Это команда, которая вставляет готовый график прямо в заметку Obsidian.