Skip to contents

Create an image gallery

Source: R/pixgallery.R
pixgallery.Rd

Create an image gallery

Usage

pixgallery(
  path,
  caption = NULL,
  caption_valign = "none",
  caption_halign = "left",
  link = TRUE,
  caption_lightbox = TRUE,
  h = NULL,
  w = NULL,
  gap = "5px",
  border_radius = "0px",
  layout = "grid",
  shuffle = FALSE,
  lightbox = list(),
  width = "100%",
  height = "100%",
  elementId = NULL
)

Arguments

path

A character vector of full paths to images.

caption

A character vector of captions for the images. If used, it must be equal to the length of path.

caption_valign

A character denoting position of the caption. Options are 'none', 'top', 'center', 'bottom' or 'below'.

caption_halign

A character denoting horizontal justification of the caption. Options are 'left', 'center' or 'right'.

A logical or character vector. What happens when you click on the thumbnail? TRUE opens up the lightbox, FALSE to disable the lightbox. A character vector of custom URLs equal to length of path.

caption_lightbox

A logical or character vector. TRUE shows caption in lightbox, FALSE disables caption in lightbox. A character vector of characters equal to length of path.

h

A character denoting height of the image thumbnails in valid CSS units.

w

A character denoting width of the image thumbnails in valid CSS units.

gap

A character denoting spacing between thumbnails in valid CSS units.

border_radius

A character denoting corner radius of image thumbnails in valid CSS units.

layout

A character denoting gallery layout type. Options are "grid", "fixed", "mosaic", "masonry", "justified", "scroll", "elastic", "rhombus" or "hexagon". See details.

shuffle

A logical indicating whether images are randomly shuffled.

lightbox

A list of options to customize the lightbox. See details.

width

A character denoting width of the widget in valid CSS units.

height

A character denoting height of the widget in valid CSS units.

elementId

A character string denoting parent container ID.

Details

layout options
grid: Grid responsive layout. Width is fluid to fit parent. When using caption_valign options 'top', 'bottom' or 'center', height cannot be adjusted.
fixed: Same as grid but with strictly fixed dimensions. Defaults to square image. When using caption_valign options 'top', 'bottom' or 'center', note that long captions may overflow. Manually set height in this case.
mosaic: Grid layout with mixed sizes.
masonry: Column layout where images flow vertically. Image height cannot be set.
justified: Similar to masonry but images flow horizontally. Image width cannot be set. When using caption_valign options 'top', 'bottom' or 'center', note that long captions are clipped. Option 'below' may cause images to be stretched if captions are too long.
elastic: Single row layout where images are magnified on hover. Image width cannot be set. Captions cannot be displayed on thumbnails.
scroll: Single row layout with horizontal scrolling. Images go offscreen. Thumbnail height and width can be set.
rhombus: Diamond shaped layout. When using caption_valign options 'top', 'bottom' or 'center', long captions are clipped. Option 'below' is disabled.
hexagon: Hexagon shaped layout. When using caption_valign options 'top', 'bottom' or 'center', long captions are clipped. Option 'below' is disabled.

lightbox options
The lightbox can be customized by passing a list of options to the lightbox parameter. Here is an example; 

pixgallery(
 paths,
 lightbox = list(
   touchNavigation = FALSE,
   loop = TRUE
 )
)

The available options for glightbox can be found at https://github.com/biati-digital/glightbox?tab=readme-ov-file#lightbox-options.

Examples

library(pixture)
paths <- c(
 "https://images.pexels.com/photos/572897/pexels-photo-572897.jpeg",
 "https://images.pexels.com/photos/7604425/pexels-photo-7604425.jpeg",
 "https://images.pexels.com/photos/4666748/pexels-photo-4666748.jpeg",
 "https://images.pexels.com/photos/4932184/pexels-photo-4932184.jpeg",
 "https://images.pexels.com/photos/4210900/pexels-photo-4210900.jpeg",
 "https://images.pexels.com/photos/3126574/pexels-photo-3126574.jpeg",
 "https://images.pexels.com/photos/167699/pexels-photo-167699.jpeg",
 "https://images.pexels.com/photos/1376201/pexels-photo-1376201.jpeg"
)
pixgallery(paths)



# local example
if (FALSE) { # \dontrun{
library(pixture)
paths <- list.files(path=system.file("extdata/images",package="pixture"),full.names=TRUE)
pixgallery(paths)
} # }