Title: Compare Raster Images Side by Side with a Slider
Version: 0.2.1
Maintainer: Tim Appelhans <tim.appelhans@gmail.com>
Description: Create a side-by-side view of raster(image)s with an interactive slider to switch between regions of the images. This can be especially useful for image comparison of the same region at different time stamps.
License: MIT + file LICENSE
Encoding: UTF-8
Depends: R (≥ 2.10), methods
Imports: htmltools, htmlwidgets, lattice, raster, terra, viridisLite
Suggests: jpeg
RoxygenNote: 7.3.2
URL: https://r-spatial.github.io/slideview/, https://github.com/r-spatial/slideview
BugReports: https://github.com/r-spatial/slideview/issues
NeedsCompilation: no
Packaged: 2025-08-21 09:40:56 UTC; tim
Author: Tim Appelhans [cre, aut], Stefan Woellauer [aut]
Repository: CRAN
Date/Publication: 2025-08-21 10:20:02 UTC

slideView

Description

Two images are overlaid and a slider is provided to interactively compare the two images in a before-after like fashion. img1 and img2 can either be two RasterLayers, two RasterBricks/Stacks or two character strings. In the latter case it is assumed that these point to .png images on the disk.

NOTE: In case you want to include multiple slideviews in one page in a Rmd or flexdashboard we highly recommend using package widgetframe. Also, make sure to use different image names and/or labels for each of the RasterLayers/Bricks/Stacks. Otherwise things will likely not work properly.

This is a modified implementation of http://bl.ocks.org/rfriberg/8327361

Usage

## S4 method for signature 'SpatRaster,SpatRaster'
slideView(
  img1,
  img2,
  label1 = deparse(substitute(img1, env = parent.frame())),
  label2 = deparse(substitute(img2, env = parent.frame())),
  r = 1,
  g = 2,
  b = 3,
  col.regions = viridisLite::inferno(256),
  legend = TRUE,
  na.color = "#BEBEBE",
  maxpixels = 1e+07,
  sliderInfoCSS = list(),
  ...
)

## S4 method for signature 'Raster,Raster'
slideView(
  img1,
  img2,
  label1 = deparse(substitute(img1, env = parent.frame())),
  label2 = deparse(substitute(img2, env = parent.frame())),
  ...
)

## S4 method for signature 'RasterStackBrick,RasterStackBrick'
slideView(
  img1,
  img2,
  label1 = deparse(substitute(img1, env = parent.frame())),
  label2 = deparse(substitute(img2, env = parent.frame())),
  ...
)

## S4 method for signature 'Raster,RasterStackBrick'
slideView(
  img1,
  img2,
  label1 = deparse(substitute(img1, env = parent.frame())),
  label2 = deparse(substitute(img2, env = parent.frame())),
  ...
)

## S4 method for signature 'RasterStackBrick,Raster'
slideView(
  img1,
  img2,
  label1 = deparse(substitute(img1, env = parent.frame())),
  label2 = deparse(substitute(img2, env = parent.frame())),
  ...
)

## S4 method for signature 'character,character'
slideView(
  img1,
  img2,
  label1 = deparse(substitute(img1, env = parent.frame())),
  label2 = deparse(substitute(img2, env = parent.frame())),
  sliderInfoCSS = list()
)

## S4 method for signature 'ANY'
slideview(...)

Arguments

img1

a RasterStack/Brick, RasterLayer or path to a .png file

img2

a RasterStack/Brick, RasterLayer or path to a .png file

label1

slider label for img1 (defaults to object name)

label2

slider label for img2 (defaults to object name)

r

integer. Index of the Red channel, between 1 and nlayers(x)

g

integer. Index of the Green channel, between 1 and nlayers(x)

b

integer. Index of the Blue channel, between 1 and nlayers(x)

col.regions

color (palette).See levelplot for details.

legend

whether to plot legends for the two images (ignored for RatserStacks/*Bricks).

na.color

the color to be used for NA pixels

maxpixels

integer > 0. Maximum number of cells to use for the plot. If maxpixels < ncell(x), sampleRegular is used before plotting.

sliderInfoCSS

list of valid css key-value pairs for the slider info at the top of the window.

...

additional arguments passed on to respective functions.

color

the color palette to be used for visualising RasterLayers

Details

Compare two images trough interactive swiping overlay

For slideView a few keyboard shortcuts are defined:

Methods (by class)

Author(s)

Tim Appelhans

Stephan Woellauer

Examples

if (interactive()) {
### example taken from
### http://www.news.com.au/technology/environment/nasa-images-reveal-
### aral-sea-is-shrinking-before-our-eyes/story-e6frflp0-1227074133835

library(jpeg)
library(terra)

web_img2000 <- "http://cdn.newsapi.com.au/image/v1/68565a36c0fccb1bc43c09d96e8fb029"

jpg2000 <- readJPEG(readBin(web_img2000, "raw", 1e6))

img2000 <- rast(jpg2000)

web_img2013 <- "http://cdn.newsapi.com.au/image/v1/5707499d769db4b8ec76e8df61933f2a"

jpg2013 <- readJPEG(readBin(web_img2013, "raw", 1e6))

img2013 <- rast(jpg2013)

slideView(img2000, img2013, label1 = "before", label2 = "after", legend = FALSE)

## adjust layout of the info slider
slideView(
  img2000
  , img2013
  , sliderInfoCSS = list(
    "background-color" = "#00ffff"
    , "color" = "#ff00ff"
    , opacity = 0.8
    , "font-size" = "30px"
    , "font-family" = "courier"
  )
  , legend = FALSE
)

}