Help us understand the problem. What is going on with this article?

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

More than 3 years have passed since last update.

この記事の目的

私が大好きな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.cssBootstrap.jsが組み込まれていて、各種テーマ・機能が利用可能です1。この辺りの流れについては、こちらの記事をご覧ください。

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機能もあり、これも使えそうなのですが、残念なことにうまくいきません。残念です。対処法は浮かんでいるのですが、そこまでして実装するものでもないと判断しました2。すみません普通に使えました。

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

<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. コメントにより指摘を受けテストしたところ、普通に使えました。失礼しました…。 

Why do not you register as a user and use Qiita more conveniently?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
Comments
Sign up for free and join this conversation.
If you already have a Qiita account
Why do not you register as a user and use Qiita more conveniently?
You need to log in to use this function. Qiita can be used more conveniently after logging in.
You seem to be reading articles frequently this month. Qiita can be used more conveniently after logging in.
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away