Rmarkdown

class: title-slide, middle, center
background-image: url(data:image/png;base64,#logo-unam.png)
background-position: 10% 45%
background-size: 25%

.center-column[
# Rmarkdown
### VieRnes de Bioinformatica

####Alejandra Schafer 
#### 2024/02/23
]

---
## .center[Sobre mí]
.left-col[ 
### <svg aria-hidden="true" role="img" viewBox="0 0 448 512" style="height:1em;width:0.88em;vertical-align:-0.125em;margin-left:auto;margin-right:auto;font-size:inherit;fill:#181818;overflow:visible;position:relative;"><path d="M416 0c17.7 0 32 14.3 32 32c0 59.8-30.3 107.5-69.4 146.6c-28 28-62.5 53.5-97.3 77.4l-2.5 1.7c-11.9 8.1-23.8 16.1-35.5 23.9l0 0 0 0 0 0-1.6 1c-6 4-11.9 7.9-17.8 11.9c-20.9 14-40.8 27.7-59.3 41.5H283.3c-9.8-7.4-20.1-14.7-30.7-22.1l7-4.7 3-2c15.1-10.1 30.9-20.6 46.7-31.6c25 18.1 48.9 37.3 69.4 57.7C417.7 372.5 448 420.2 448 480c0 17.7-14.3 32-32 32s-32-14.3-32-32H64c0 17.7-14.3 32-32 32s-32-14.3-32-32c0-59.8 30.3-107.5 69.4-146.6c28-28 62.5-53.5 97.3-77.4c-34.8-23.9-69.3-49.3-97.3-77.4C30.3 139.5 0 91.8 0 32C0 14.3 14.3 0 32 0S64 14.3 64 32H384c0-17.7 14.3-32 32-32zM338.6 384H109.4c-10.1 10.6-18.6 21.3-25.5 32H364.1c-6.8-10.7-15.3-21.4-25.5-32zM109.4 128H338.6c10.1-10.7 18.6-21.3 25.5-32H83.9c6.8 10.7 15.3 21.3 25.5 32zm55.4 48c18.4 13.8 38.4 27.5 59.3 41.5c20.9-14 40.8-27.7 59.3-41.5H164.7z"/></svg> Alejandra Schafer

Estudiante del [Programa de Doctorado en Ciencias Biomedicas](https://www.pdcb.unam.mx/)

Estudiante de doctorado en [RegGenoLab](https://liigh.unam.mx/amedina/)

Licenciada en [Ciencias genomicas](https://www.lcg.unam.mx/), Cuernavaca
]

.center-col[
### <svg aria-hidden="true" role="img" viewBox="0 0 576 512" style="height:1em;width:1.12em;vertical-align:-0.125em;margin-left:auto;margin-right:auto;font-size:inherit;fill:#181818;overflow:visible;position:relative;"><path d="M287.9 0c9.2 0 17.6 5.2 21.6 13.5l68.6 141.3 153.2 22.6c9 1.3 16.5 7.6 19.3 16.3s.5 18.1-5.9 24.5L433.6 328.4l26.2 155.6c1.5 9-2.2 18.1-9.6 23.5s-17.3 6-25.3 1.7l-137-73.2L151 509.1c-8.1 4.3-17.9 3.7-25.3-1.7s-11.2-14.5-9.7-23.5l26.2-155.6L31.1 218.2c-6.5-6.4-8.7-15.9-5.9-24.5s10.3-14.9 19.3-16.3l153.2-22.6L266.3 13.5C270.4 5.2 278.7 0 287.9 0zm0 79L235.4 187.2c-3.5 7.1-10.2 12.1-18.1 13.3L99 217.9 184.9 303c5.5 5.5 8.1 13.3 6.8 21L171.4 443.7l105.2-56.2c7.1-3.8 15.6-3.8 22.6 0l105.2 56.2L384.2 324.1c-1.3-7.7 1.2-15.5 6.8-21l85.9-85.1L358.6 200.5c-7.8-1.2-14.6-6.1-18.1-13.3L287.9 79z"/></svg> Miembro

- [Proyecto JAGUAR](https://jaguar.liigh.unam.mx/)
]

---
class: center, middle

---

## ¿Que es y para que sirve Rmarkdown?

Es una herramienta que permite escribir documentos dinamicos con código de R, de manera fácil y legible.

**¿Por qué realizar un Rmarkdown?**

.center[
<img src = "photo1.jpeg", height = "350">]

---
.center[
## ¿Cómo creamos un archivo Rmarkdown?

Vayamos a la parte superior al menú **Archivos > Nuevo documento**.

<img src = "photo2.png", height = "350">
]
---
.center[

### Lo primero que vamos a tener será un archivo vacio así:

]
---
.center[

### Y para poder generar los documentos hay que knitearlo así:

<img src = "photo4.png", height = "350">]

**Los archivos que se pueden generar son:**
* PDF (Tesis o curriculum vitae)
* html (página web o presentaciones)
* Word

---
## Organización de la información:

** División de titulos:**

```r
# Titulo principal
## Subtitulo 1
### Subtitulo 2
#### Subtitulo 3
##### Subtitulo 4
```

# Titulo principal
## Subtitulo 1
### Subtitulo 2
#### Subtitulo 3
##### Subtitulo 4

---

## Organización de la información:

** Estilos de las letras:** para modificar el estilo hay que agregar un '*' antes y despúes del texto.

```{}
*italica*
**negritas**
***ambos***
~~tachado~~
<span style="color:blue">Texto azul</span> 
```

*italica*.    
**negritas**.     
***ambos***.     
~~tachado~~.   
<span style="color:blue">Texto azul</span> 
---

## Organización de la información:

** Listas:**

```{}
* uno
* dos
  - 2a
#    - 2b
# * tres
#    - 3a
#        + 3rd layer
#    - 2b
# * cuatro
```

* uno
* dos
    - 2a
    - 2b
* tres
    - 3a
        + 3rd layer
    - 2b
* cuatro

---

## Diferentes lenguajes de programación

### Existen varios lenguajes de programación que se pueden usar en un Rmarkdown

.center[
<img src = "photo5.png", height = "350">]

---
## Diferentes lenguajes de programación

### R

```r
x = 'hello, world!'
x
# [1] "hello, world!"
```

### Bash

```bash
x=$(echo 'hello, world!')
echo $x
# hello, world!
```

---

## Visualización de datos

Vamos a usar un set de data predeterminado de R, este se llama pressure. Y vamos a visualizar los datos con la función head()

```r
head(pressure)
#   temperature pressure
# 1           0   0.0002
# 2          20   0.0012
# 3          40   0.0060
# 4          60   0.0300
# 5          80   0.0900
# 6         100   0.2700
```

Para ver las estadisticas de estos datos usamos la función summary()

```r
summary(pressure)
#   temperature     pressure       
#  Min.   :  0   Min.   :  0.0002  
#  1st Qu.: 90   1st Qu.:  0.1800  
#  Median :180   Median :  8.8000  
#  Mean   :180   Mean   :124.3367  
#  3rd Qu.:270   3rd Qu.:126.5000  
#  Max.   :360   Max.   :806.0000
```

---

## Visualización de datos

Ahora haremos un plot con los datos.

```r
plot(pressure, type="l", main="Grafica muestra", xlab="Eje X", ylab="Eje Y")
```

---

class: center, middle

---

## Ejercicio:

1. Crea un Rmarkdown

2. Carga el siguente set de datos

```r
datos <- read.csv("https://raw.githubusercontent.com/rpizarrog/Curso-Titulacion-Data-Science-/master/2020/datos/starwars.csv", encoding = "UTF-8")
```

* Visualiza los datos usando la funcion (head)

* Crea Titulos y subtitulos en el archivo usando la tematica del dataset.

---

## Generacion de tablas

La forma más sencilla es de la siguiente manera:

```{}
Cabecera A | Cabecera B
-- | --
Campo A1 | Campo B1
Campo A2 | Campo B2
```

Cabecera A | Cabecera B
-- | --
Campo A1 | Campo B1
Campo A2 | Campo B2

---
## Generacion de tablas

Si queremos modificar la alineación de las columnas. Se pueden poner dos puntos para especificar el orden.

```{}
| Objetos a la izquierda    | Obetos centrados   | Objetos a la derecha   |
| :------- | :------: | -------: |
| 1   | a  | i   |
| 2   | b  | ii  |
```

| Objetos a la izquierda    | Obetos centrados   | Objetos a la derecha   |
| :------- | :------: | -------: |
| 1   | a  | i   |
| 2   | b  | ii  |

---
## Generacion de tablas

Tambien podemos generar tablas en formato de html

<table class="table table-hover">
  <thead>
    <tr>
      <th scope="col"><center>Num</center></th>
      <th scope="col"><center>Header</center></th>
      <th scope="col"><center>Header2</center></th>
      <th scope="col"><center>Header3</center></th>
    </tr>
  </thead>
  <tbody>
  </tr>
    <tr class="table-light">
      <th scope="row">1</th>
      <td><center>first</center></td>
      <td><center>1st</center></td>
      <td><center>One</center></td>
  </tr>
   </tr>
    <tr class="table-light">
      <th scope="row">2</th>
      <td><center>second</center></td>
      <td><center>2nd</center></td>
      <td><center>Two</center></td>
  </tr>
  </tr>
    <tr class="table-light">
      <th scope="row">3</th>
      <td><center>third</center></td>
      <td><center>3rd</center></td>
      <td><center>Three</center></td>
  </tr>
  </tbody>
</table>

---
## Generacion de tablas

```r
iris %>%
  head(3) %>%
  DT::datatable()
```

<div class="datatables html-widget html-fill-item-overflow-hidden html-fill-item" id="htmlwidget-ae610ca1a52dfaaee4c9" style="width:100%;height:auto;"></div>
<script type="application/json" data-for="htmlwidget-ae610ca1a52dfaaee4c9">{"x":{"filter":"none","vertical":false,"data":[["1","2","3"],[5.1,4.9,4.7],[3.5,3,3.2],[1.4,1.4,1.3],[0.2,0.2,0.2],["setosa","setosa","setosa"]],"container":"<table class=\"display\">\n  <thead>\n    <tr>\n      <th> <\/th>\n      <th>Sepal.Length<\/th>\n      <th>Sepal.Width<\/th>\n      <th>Petal.Length<\/th>\n      <th>Petal.Width<\/th>\n      <th>Species<\/th>\n    <\/tr>\n  <\/thead>\n<\/table>","options":{"columnDefs":[{"className":"dt-right","targets":[1,2,3,4]},{"orderable":false,"targets":0},{"name":" ","targets":0},{"name":"Sepal.Length","targets":1},{"name":"Sepal.Width","targets":2},{"name":"Petal.Length","targets":3},{"name":"Petal.Width","targets":4},{"name":"Species","targets":5}],"order":[],"autoWidth":false,"orderClasses":false}},"evals":[],"jsHooks":[]}</script>

---

class: center, middle

---
## Ejercicio:

Has una tabla con la siguiente informacion:

```r
head(datos[,1:5])
#   X           name height mass  hair_color
# 1 1 Luke Skywalker    172   77       blond
# 2 2          C-3PO    167   75        <NA>
# 3 3          R2-D2     96   32        <NA>
# 4 4    Darth Vader    202  136        none
# 5 5    Leia Organa    150   49       brown
# 6 6      Owen Lars    178  120 brown, grey
```

---

#Respuesta del ejericicio

```{}
X | name | height | mass | hair_color
-- | -- | -- | -- | -- 
1	| Luke Skywalker | 172 | 77 | blond
2	| C-3PO | 167 | 75 | NA
3 |	R2-D2 |	96 |	32 |	NA
4	| Darth Vader |	202 |	136 |	none
5 |	Leia Organa |	150 |	49 |	brown
6 |	Owen Lars |	178 |	120 |	brown, grey
```

X | name | height | mass | hair_color
-- | -- | -- | -- | -- 
1	| Luke Skywalker | 172 | 77 | blond
2	| C-3PO | 167 | 75 | NA
3 |	R2-D2 |	96 |	32 |	NA
4	| Darth Vader |	202 |	136 |	none
5 |	Leia Organa |	150 |	49 |	brown
6 |	Owen Lars |	178 |	120 |	brown, grey

---

## Agregar imagenes en un reporte
### Desde internet
```{}
![Example](https://i.imgur.com/kDAxKFz.png) 
```
.center[
![Example](data:image/png;base64,#https://i.imgur.com/kDAxKFz.png)]
---

# Agregar imagenes en un reporte

### Desde un archivo de nuestra computadora
```{}
<img src = "photo6.png", height = "350">
```

.center[
<img src = "photo6.png", height = "350">]

---

# Realizar calculos en un texto

Podemos realizar calculos matematicos en el texto usando comillas invertidas (` `) en ambos extremos.

```{}
La suma de 4 mas 5 es 'r 4+5'
La division de 4 entre 5 es 'r 4/5'
La multiplicacion de 4 por 5 es 'r 4*5'
Si 4^5 cuanto es? 'r 4^5'
Redondear valores, 9.44 se redondea a 'r round(9.44,1)'
```

La suma de 4 mas 5 es 9.

La division de 4 entre 5 es 0.8.

La multiplicacion de 4 por 5 es 20.

Si 4^5 cuanto es? 1024.

Redondear valores, 9.44 se redondea a 9.4.

---

## Agregar una ecuacion matematica

```{}
En la misma linea: $A = \pi*r^{2}$

Aparte:

$$y = \mu + \sum_{i=1}^p \beta_i x_i + \epsilon$$

Agregar subindices para formulas CO~2~, alternativamente con `html` CO<sub>2</sub>

Agregar super indice E=MC^2^ o $E=MC^2$, alternativamente con `html` E=MC<sup>2</sup>

```

* En la misma linea: `$A = \pi*r^{2}$`

* Aparte:

`$$y = \mu + \sum_{i=1}^p \beta_i x_i + \epsilon$$`
* Agregar subindices para formulas CO~2~, alternativamente con `html` CO<sub>2</sub>

* Agregar super indice E=MC^2^ o `$E=MC^2$`, alternativamente con `html` E=MC<sup>2</sup>

---

## Agregar un indice en el reporte

* Informacion incial
 
```{}
title: "Introduccion a Rmarkdown"
author: "Alejandra Schafer"
date: "2024-02-23"
output: html_document
```
 
* Informacion modificada para agregar el indice

```{}
title: "Introduccion a Rmarkdown"
author: "Alejandra Schafer"
date: "2024-02-23"
output: 
  - html_document:
  - toc: yes
  - toc_float: yes
  - toc_depth: 6
  - theme: cerulean 
```

---

## Agregar un indice en el reporte

```{}
title: "Introduccion a Rmarkdown"
author: "Alejandra Schafer"
date: "2024-02-23"
output: 
  - html_document:
  - toc: yes
  - toc_float: yes
  - toc_depth: 6
  - theme: cerulean 
```

* **toc** es para indicar que vas a agregar un indice en el reporte. 
* **toc_float** es para indicar si el indice va a ser flotante o no, si indicas `yes` el indice se localizara a la izquiera de la pantalla y la informacion se desplegara cuando se coloques sobre ella. 
* **toc_depth** es para indicar el numero de subtitulos que puedes tener en el archivo.
* **theme** es la decoracion del archivo.

Para mas temas puedes entrar al siguiente link: https://www.datadreaming.org/post/r-markdown-theme-gallery/

---

## Configuracion de los chunks

En los chunks algunas cosas que se pueden especificar son: {r setup1, include = FALSE, echo= FALSE, eval=FALSE}:

* **include** = FALSE: no muestra el código.
* **echo** = FALSE: no muestra el resultado en el documento final.
* **warning** = FALSE: no muestra los warnings.
* **error** = FALSE: no muestra los mensajes de error.
* **message** = FALSE: no muestra los mensajes.
* **collapse** = TRUE: de ser posible colapsa la fuente y outputs de los bloques de código.
* **eval** = FALSE: no evalúa los códigos, sirve para mostrar bloques de código sin que emita resultados.
* **fig.dim** = c(n,m): vector numérico para el tamaño de los plots.
* **fig.cap** = "message": para colocar un caption a los plots.

Pueden encontrar mas opciones para los chunks en el siguiente link: https://yihui.org/knitr/options/#chunk-options

---
class: center, middle

---

# Ejercicio

1. Agrega una imagen de internet en el archivo de Rmarkdown que creaste previamente. 
2. Suma la la columna de "height" de la tabla que generaste. 
3. Agrega un indice en el documento.