要创建这样的表格，你需要安装 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); // The target line

const chartData = {
  type: 'line',
  data: {
    labels: labels,
    datasets: [
      {
        label: "Weight (kg)",
        data: values,
        borderColor: "blue",
        fill: false,
        tension: 0.3
      },
      {
        label: "Goal (80 kg)",
        data: goals,
        borderColor: "green",
        borderDash: [5, 5],
        pointRadius: 0,
        fill: false
      }
    ]
  },
  options: {
    responsive: true,
    plugins: {
      title: {
        display: true,
        text: "📈 Weight growth towards the goal"
      },
      legend: {
        position: "bottom"
      }
    },
    scales: {
      y: {
        title: {
          display: true,
          text: "Weight (kg)"
        },
        suggestedMin: 65,
        suggestedMax: 85
      },
      x: {
        title: {
          display: true,
          text: "Date"
        }
      }
    }
  }
};

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); // The target line

🔹 它的作用：

• 我们设定一个目标，比如 80 公斤。

• 在图表上再画第二条线，它是一条直线，这样你就能看出离目标还有多远。

---

🧱 配置图表本身

const chartData = {
  type: 'line',
  data: {
    labels: labels,
    datasets: [
      {
        label: "Weight (kg)",
        data: values,
        borderColor: "blue",
        fill: false,
        tension: 0.3
      },
      {
        label: "Goal (80 kg)",
        data: goals,
        borderColor: "green",
        borderDash: [5, 5],
        pointRadius: 0,
        fill: false
      }
    ]
  },

🔹 它的作用：

• 绘制两条线：

  • 蓝线：你的实际进展；

  • 绿色虚线：目标体重。

• tension: 0.3：让线条更平滑（看起来更美观）。

• borderDash：给目标线设置虚线，以便在视觉上区分。

---

⚙️ 配置外观

  options: {
    responsive: true,
    plugins: {
      title: {
        display: true,
        text: "📈 Weight growth towards the goal"
      },
      legend: {
        position: "bottom"
      }
    },
    scales: {
      y: {
        title: {
          display: true,
          text: "Weight (kg)"
        },
        suggestedMin: 65,
        suggestedMax: 85
      },
      x: {
        title: {
          display: true,
          text: "Date"
        }
      }
    }
  }
};

🔹 它的作用：

• 添加标题。

• 把图例放在底部。

• 限制 Y 轴范围（65 到 85 公斤），这样图表就不会显得太“平”。

• 为坐标轴添加标签。

---

window.renderChart(chartData, this.container);

🔹 这条命令会把做好的图表直接插入到 Obsidian 笔记中。