R MarkdownでBootstrapのAlert書式を当てる

この記事の目的

私が大好きなRMarkdownについて、Tipsを集中的に連載しようという思いつきの企画です。あと自分の中で進めている別企画のメモという位置づけでもあります。なので大した中身はありません。

R Markdownとは

Markdown記法をベースに、チャンクという形でRのコードを記述して評価・出力することができるものです。RStudioのクイックリファレンスでは以下のように説明してあります:

R Markdown is an easy-to-write plain text format for creating dynamic documents and reports.

R MarkdownにはBootstrapが組み込まれている

色々なところで触れられていますが、R MarkdownにはBootstrapが組み込まれています。具体的にはBootstrap.cssとBootstrap.jsが組み込まれていて、各種テーマ・機能が利用可能です¹。この辺りの流れについては、こちらの記事をご覧ください。

Alertメッセージ

Bootstrapには警告や注意をひきたいメッセージなどのためにAlertメッセージの書式が準備されています。あのパステルカラーできれいなアレです。cssが組み込まれていますので、以下のようにさくっと作ることができます:

<div class="alert alert-success">
**success**のメッセージ
</div>
<div class="alert alert-info">
**info**のメッセージ
</div>
<div class="alert alert-warning">
**warning**のメッセージ
</div>
<div class="alert alert-danger">
**danger**のメッセージ
</div>

ようするに、<div class="alert alert=*">のタグで括ったエリアがその書式となります。なおこの内部にRコードチャンクも組み込むことができます(コードチャンク前の""は無視してください):

<div class="alert alert-info">
**info**のメッセージ
\```{r}
knitr::kable(head(iris))
\```

</div>

ちょっと面白い感じになりますので、ぜひ試してみてください。

Alertと関連する他の書式

BootstrapにはPanels機能もあり、これも使えそうなのですが、残念なことにうまくいきません。残念です。対処法は浮かんでいるのですが、そこまでして実装するものでもないと判断しました²。すみません普通に使えました。

以下のように記述すると、パネルが使えます(コードチャンク前の""は無視してください):

<div class="panel panel-info">
  <div class="panel-heading">iris dataset</div>
  <div class="panel-body">
hogehoge.

\```{r}
knitr::kable(head(iris))
\```

  </div>
</div>

詳細の説明は割愛しますが、上記Bootstrap本家の説明をちょっと読めば理解できるかと思います。なおこれはおそらく<div>タグ部分のhtml直打ちじゃないと厳しいはずです。あまりこういうのを多用し始めると、せっかくのR Markdownの良さが損なわれるので難しいところです…。

Enjoy!

1. 正確にはそれ以外の書式なども組み込まれているため、たまに打ち消されてしまっているのもあります。このため使える機能と使えない機能があります。 ↩

2. コメントにより指摘を受けテストしたところ、普通に使えました。失礼しました…。 ↩