Content4

qmd テンプレート集 — コード実行と動的コンテンツ

Quarto qmd ファイルのコード実行機能（Rチャンク・パラメータ化・Observable JS・インラインコード）のテンプレート集。

1 qmd テンプレート集 — コード実行と動的コンテンツ

このページでは、Quarto の .qmd ファイルが持つ コード実行機能 と 動的コンテンツ生成 を活かしたテンプレートを紹介します。

生の Markdown ではできない、qmd ならではの機能を実例で確認してください。

---

1.1 1. 基本の計算ドキュメント

コードチャンクで計算し、結果を自動埋め込みする最も基本的なパターンです。

1.1.1 テンプレート

---
title: "基本統計レポート"
format: html
execute:
  echo: true
---

# データの要約

```{r}
#| echo: true
#| fig-cap: "ヒストグラム"

# データ生成
x <- rnorm(100, mean = 50, sd = 10)

# 基本統計量
mean_x <- mean(x)
sd_x <- sd(x)

# ヒストグラム描画
hist(x, main = "ヒストグラム", col = "steelblue")
```

## 結果

平均: <code>r mean_x</code>、標準偏差: <code>r sd_x</code>

1.1.2 実行結果（このページでの出力）

x <- rnorm(100, mean = 50, sd = 10)
mean_x <- mean(x)
sd_x <- sd(x)
hist(x, main = "ヒストグラム", col = "steelblue")

ヒストグラム

平均: 50.0301525、標準偏差: 9.6352519

---

1.2 2. パラメータ化レポート

params キーで外部から値を注入し、1つのテンプレートから複数のレポートを生成するパターンです。

1.2.1 テンプレート

---
title: "パラメータ化レポート"
format: html
params:
  n: 100
  mean: 50
  sd: 10
  title: "デフォルトタイトル"
execute:
  echo: true
---

# デフォルトタイトル

## 設定値

- サンプルサイズ: 100
- 平均: 50
- 標準偏差: 10

```{r}
#| echo: true
data <- rnorm(params$n, mean = params$mean, sd = params$sd)
hist(data, main = params$title, col = "tomato")
```

異なるパラメータでレンダリングするには：

quarto render report.qmd -P n:500 -P mean:100 -P title:"500件のデータ"

1.2.2 実行結果（このページでの出力）

---

1.3 3. Observable JS 連携

Quarto は R/Python に加えて Observable JS (ojs) をネイティブサポートしています。ブラウザ上でインタラクティブな可視化が可能です。

1.3.1 テンプレート

---
title: "Observable JS デモ"
format: html
---

```{ojs}
// スライダーでサンプルサイズを変更
viewof n = Inputs.range([10, 500], {value: 100, label: "サンプルサイズ", step: 10})

// ランダムデータ生成
data = Array.from({length: n}, () => Math.random() * 100)

// ヒストグラム描画
{
  const bins = 20;
  const width = 600;
  const height = 300;
  // Plot を使用した可視化
  Plot.plot({
    y: {grid: true},
    marks: [Plot.rectY(data, Plot.binX({y: "count"}, {x: (d) => d, thresholds: bins}))]
  })
}
```

viewof n = Inputs.range([10, 500], {value: 100, label: "サンプルサイズ", step: 10})

図 1: Observable JS によるインタラクティブヒストグラム

data = Array.from({length: n}, () => Math.random() * 100)

Plot.plot({
  y: {grid: true},
  marks: [Plot.rectY(data, Plot.binX({y: "count"}, {x: (d) => d, thresholds: 20}))]
}).figure

---

1.4 4. インラインコード活用

コードチャンクを介さず、本文中に直接動的な値を埋め込む方法です。R の場合は r 式 をバッククォートで囲む構文、Python の場合は python 式 をバッククォートで囲む構文を使います。

1.4.1 テンプレート

---
title: "インラインコード活用"
format: html
---

```{r}
#| include: false
total <- 1000
passed <- 850
rate <- passed / total * 100
```

本日のテストは **<code>r total</code> 問中 <code>r passed</code> 問** 合格でした。
合格率は **<code>r round(rate, 1)</code>%** です。

1.4.2 実行結果

本日のテストは 1000 問中 850 問 合格でした。合格率は 85% です。

1.4.3 YAML 変数との組み合わせ

_quarto.yml で定義した変数は {{< var name >}} で参照できます。

# _quarto.yml
vars:
  author: "watanabe3tipapa"
  year: 2025

著者: {{< var author >}}（{{< var year >}}）

---

1.5 5. チャンクオプション見本帳

チャンクオプションを使い分けることで、出力の見た目や動作を細かく制御できます。

---
title: "チャンクオプション見本帳"
format: html
---

```{r}
#| echo: true          # コードを表示（デフォルト）
#| eval: true          # コードを実行（デフォルト）
#| include: true       # 出力を含める（デフォルト）
#| fig-cap: "図のタイトル"
#| fig-width: 6
#| fig-height: 4
#| column: margin      # 余白に配置
#| out-width: 80%      # 出力幅を制限
#| cache: true         # 結果をキャッシュ
plot(1:10)
```

1.5.1 オプション一覧

オプション	値の例	説明
echo	true / false	ソースコードの表示/非表示
eval	true / false	コードの実行/スキップ
include	true / false	出力全体の包含/除外
fig-cap	"文字列"	図のキャプション
fig-width / fig-height	数値	図の寸法（インチ）
column	"margin" / "screen-inset"	出力のレイアウト位置
out-width	"80%" / "500px"	出力幅の制限
cache	true / false	実行結果のキャッシュ制御

1.5.2 配置パターン比較

par(mar = c(3, 3, 2, 1))
barplot(1:5, col = "steelblue", main = "column: screen")

通常配置（本文幅）

余白配置（column: margin）

---

1.6 参考

• Content3: _quarto.yml テンプレート集 — プロジェクト設定のテンプレート
• Content5 — 構造化・多形式連携のテンプレート