5) Minimal Closeread with Equations
So far we’ve introduced a couple of basic Closeread documents. Our first example used only text. Our second example involved text and images. But what about including some math equations in our scrollytelling story? In this module, I show you a third basic example that involves text and some math equations written with LaTeX.
Recall that you need to have installed the quarto Closeread extension in your working directory. Run the following command in your Terminal:
Terminal
quarto add qmd-lab/closereadExample
Below is an example of a qmd file with some content. Copy and paste it into a qmd document so that you can preview it or render it in all its Closeread glory.
example4.qmd
---
title: My third closeread document
format: closeread-html
---
This is a scrollytelling story containing
some math equations written with LaTeX.
::::{.cr-section}
Suppose you have some amount of money $P$,
and you'll invest it for $n$
years, obtaining an annual return $r$.
How much money will you have $n$ years from now?
To find the answer you have to calculate the __Future Value__
given by the following formula: @cr-fv
:::{#cr-fv}
$$
FV = P \times (1 + r)^n
$$
:::
$FV$ is the Future Value
$P$ is the Principal, the amount of money you'll invest.
$r$ is the annual interest rate, or rate of return.
$n$ is the number of years.
What would be the future value of $10,000 invested for 10 years,
assuming an annual return of 7%? @cr-investment
:::{#cr-investment}
\begin{align*}
P &= 10,000 \\
& \\
r &= 0.07 \\
& \\
n &= 10
\end{align*}
:::
Let's do the math: @cr-math
:::{#cr-math}
\begin{align*}
FV &= 10,000 \times (1 + 0.07)^{10} \\
&
\end{align*}
:::
The answer is: @cr-answer
:::{#cr-answer}
\begin{align*}
FV &= 10,000 \times (1 + 0.07)^{10} \\
&= 19,671.51
\end{align*}
:::
::::What’s going on?
Let’s briefly discuss the content of example4.qmd focusing on the stickies and the triggers.
Sticky Elements
Compared to the previous examples, the current one has four sticky components. After careful inspection, you should be able to notice that all the stickies consists of LaTeX math equations.
The first sticky, #cr-fv, introduces the equation to calculate the Future Value (FV):
:::{#cr-fv}
$$
FV = P \times (1 + r)^n
$$
:::The second sticky, #cr-investment, introduces the symbols and values to be used in the equation of the Future Value (FV):
:::{#cr-investment}
\begin{align*}
P &= 10,000 \\
& \\
r &= 0.07 \\
& \\
n &= 10
\end{align*}
:::The third sticky, #cr-math, is dedicated to do the actual math involved in the FV equation:
:::{#cr-math}
\begin{align*}
FV &= 10,000 \times (1 + 0.07)^{10} \\
&
\end{align*}
:::And the fourth and last sticky, provides the final answer with the computed future value:
:::{#cr-answer}
\begin{align*}
FV &= 10,000 \times (1 + 0.07)^{10} \\
&= 19,671.51
\end{align*}
:::Narrative and Triggers
As for the narrative and the triggers, we encounter several paragraphs. The first paragraph (i.e. 1st paragraph inside the cr-section) is the introductory text and it has no trigger.
The next paragraph poses the main question, and it also has no trigger.
In turn, the third paragraph introduces the equation fo the Future Value, and consequently comes with the first trigger @cr-fv.
The following lines of text are one-line paragraphs listing the terms of the FV equation, none of them with triggers.
After that, we have another paragraph with the second trigger @cr-investment.
Then there is one more paragraph with the third trigger @cr-math.
And finally there is the last paragraph with the fourth trigger @cr-answer.
Take a look
You can take a look at this example here.