-
Notifications
You must be signed in to change notification settings - Fork 4
/
example.qmd
87 lines (69 loc) · 2.74 KB
/
example.qmd
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
---
title: Example Lightbox Document
filters:
- lightbox
lightbox: auto
---
## Chilmark
Here is a simple image with a description. This also overrides the
description position and places it to the left of the image.
![Beach in
Chilmark](images/mv-0.jpg){description="Chilmark has a reputation as having some of the best beaches on Martha's Vineyard. Chilmark beaches are resident only in the summer, so be sure to have your proof of residency ready if you'd like to visit one of these special places. _credit:_ [Chilmark Beach](https://unsplash.com/photos/VBDJGOMCwps)"
desc-position="left"}
## Elsewhere
The below demonstrates placing more than one image in a gallery. Note
the usage of the `layout-ncol` which arranges the images on the page
side by date. Adding the `group` attribute to the markdown images places
the images in a gallery grouped together based upon the group name
provided.
::: {layout="[[1, 1], [1]]"}
![Aquinnah](images/mv-1.jpg){group="elsewhere"
description="The waves break off the coast of Aquinnah on a beautiful summer day."}
![Oak Bluffs](images/mv-3.jpg){group="elsewhere"
description="Oak Bluffs is famous for its Gingerbread cottages, busy town center, and party like atmosphere."}
![Vineyard lighthouse](images/mv-2.jpg){group="elsewhere"
description="The Edgartown Lighthouse is a short walk from downtown and has beautiful views over the entrance to Edgartown Harbor."}
:::
## With computation code chunks
Options for lightbox can be passed using chunk options.
```{r}
#| fig-cap: Simple demo R plot
#| lightbox:
#| group: r-graph
#| description: This is 1 to 10 plot
plot(1:10, rnorm(10))
```
```{r}
#| fig-cap: Plot about cars data
#| lightbox:
#| group: r-graph
#| description: We see our cars data above
plot(cars)
```
It is possible to create several plots, and group them in a lightbox gallery. Use list in YAML for options when you have several plots, on per plot.
```{r}
#| fig-cap:
#| - Caption for first plot
#| - Caption for second plot
#| lightbox:
#| group: cars
#| description:
#| - This is the decription for first graph
#| - This is the decription for second graph
plot(mtcars)
plot(cars)
```
When `lightbox: auto` in main YAML config, you can opt-out lightbox on a plot by setting `lightbox: false`
```{r}
#| fig-cap: mtcars
#| lightbox: false
plot(mtcars)
```
## Credits
The images in this example were used under the [Unsplash
license](https://unsplash.com/license), view originals below:
- [Chilmark Beach](https://unsplash.com/photos/VBDJGOMCwps)
- [Aquinnah](https://unsplash.com/photos/2iQnDPLIXwU)
- [Gingerbread House](https://unsplash.com/photos/HQEtvlNzUyA)
- [Edgartown Light](https://unsplash.com/photos/f59MyOfLpi8)
- [Edgartown Sailboat](https://unsplash.com/photos/IiLiz7XpQpI)