Hermosas presentaciones con Quarto

Evento R-Ladies Santa Rosa - Marzo de 2024

Yani Bellini Saibene

Hola, les doy la bienvenida

Hoy vamos a:

realizar desde cero una presentacion usando Quarto y Reveal.js
incluir imagenes, codigo y su resultado.
separacion en columnas de contenido
presentacion incremental de texto y codigo
resaltar contenido.
personalizar la presentacion

Me cuentan

Han usado Quarto antes ?
Han usado rmarkdown antes?
tienen alguna idea de presentacion que quieran hacer ?

Vamos a crear slides !

Agregando slides

Para agregar una slide nueva podemos usar:

el encabezado de segundo nivel.
el encabezado de primer nivel genera una seccion nueva.

El codigo seria asi:

## Esta es la primera slide

## Esta es la segunda slide

# Esta es una seccion

## Esta es una tercera slide

Mostrar elementos de forma incremental

Para mostar los elementos de una lista de forma incremental (como la slide de las preguntas)


::: incremental
-   Primer item de la lista
-   Segundo 
-   y tercero 
:::

Agregando imagenes

Podemos agregar imagenes con texto alternativo.

Es muy importante para la accesibilidad de nuestras presentaciones.

El codigo:


![](nombre-imagen){fig-alt = "alt text"}

![](r-ladies-logo.png){fig-alt = "R-Ladies logo que dice R-Ladies en Argentina con un mate color purpura del lado izquierdo"}

]

Agregando columnas

Esta slide esta dividida en dos columnas.

Se puede dividir al slides en muchas columnas mas.

Se puede indicar que porcion de las slides ocupa cada columna.


:::: {.columns}

::: {.column width="40%"}
Columna izquierda
:::

::: {.column width="60%"}
Columna derecha
:::

::::

Ahora juguemos con codigo en nuestras slides

Agregando codigo

Se utilizan chunks de codigo.
Tiene estilos muy bonitos para formatear el codigo

pinguinos %>% 
  filter(especie == "Papúa") %>% 
  ggplot(aes(x = largo_pico_mm, y = alto_pico_mm)) +
  geom_point(color = "darkorange",
             size = 3,
             alpha = 0.8) +
  geom_smooth(method = "lm", se = FALSE, color = "darkorange") +
  theme_minimal()

Animacion del codigo

Se utilizan chunks de codigo.
Tiene estilos muy bonitos para formatear el codigo

pinguinos %>% 
  filter(especie == "Papúa") %>% 
  ggplot(aes(x = largo_pico_mm, y = alto_pico_mm)) +
  geom_point(color = "darkorange",
             size = 3,
             alpha = 0.8) +
  geom_smooth(method = "lm", se = FALSE, color = "darkorange") +
  theme_minimal() +
  labs(title = "Dimensiones del pico de los pingüinos",
       subtitle = "Alto y largo del pico de pingüinos Papúa en la Estación Palmer LTER",
       x = "Largo del pico (mm)",
       y = "Alto del pico (mm)",
       color = "Especie")

Resaltar lineas de codigo

Son utiles para explicar codigo o enfocar la atencion en una parte del codigo.

pinguinos %>% 
  filter(especie == "Papúa") %>% 
  ggplot(aes(x = largo_pico_mm, y = alto_pico_mm)) +
  geom_point(color = "darkorange",
             size = 3,
             alpha = 0.8) +
  geom_smooth(method = "lm", se = FALSE, color = "darkorange") +
  theme_minimal() +
  labs(title = "Dimensiones del pico de los pingüinos",
       subtitle = "Alto y largo del pico de pingüinos Papúa en la Estación Palmer LTER",
       x = "Largo del pico (mm)",
       y = "Alto del pico (mm)",
       color = "Especie")

Codigo ejecutable

Podemos ejecutar codigo y mostrar su resultado. Este es el grafico que genera el codigo que vimos antes.

Latex

Ecuaciones en LaTeX

MathJax renderiza las ecuaciones a HTML

\begin{gather*}
a_1=b_1+c_1\\
a_2=b_2+c_2-d_2+e_2
\end{gather*}

\begin{align}
a_{11}& =b_{11}&
  a_{12}& =b_{12}\\
a_{21}& =b_{21}&
  a_{22}& =b_{22}+c_{22}
\end{align}

\[\begin{gather*} a_1=b_1+c_1\\ a_2=b_2+c_2-d_2+e_2 \end{gather*}\] \[\begin{align} a_{11}& =b_{11}& a_{12}& =b_{12}\\ a_{21}& =b_{21}& a_{22}& =b_{22}+c_{22} \end{align}\]

Vamos a personalizar nuestra presentacion: el YAML!

y otras cositas.