slickR (version 0.2.2)

slickR: slick.js image carousel htmlwidget

Description

use slick.js library in R

Usage

slickR(obj, slideId = "baseDiv", slideIdx = list(1:length(obj)),
  slideType = c("img"), slickOpts = list(dots = TRUE), synchSlides = NULL,
  padding = rep("1%", length(obj)), dotObj = NULL, width = NULL,
  height = NULL, elementId = NULL)

Arguments

obj

character, vector of path or url to images

slideId

character, id of slide

slideIdx

list, numeric indices which images are mapped to which slider

slideType

character, type of object to put in slide

slickOpts

list, list of attributes for each slider, see details

synchSlides

character, slideId names of sliders are synchronized

padding

character, percent of width between each image in the carousel for each slider, Default: '1%'

dotObj

list, character vectors of url or images to replace dots with (see details)

width

character, width of htmlwidget

height

character, height of htmlwidget

elementId

character, id tag of htmlwidget

Details

slick.js http://kenwheeler.github.io/slick/ is an image carousel javascript library. To find all the attributes that can be used please refer to the link. To create more than one carousel input the attributes into a nested list eg slickOpts=list(list(slidesToShow=1,slidestoScroll=1,arrows=F,fade=T), list(slidesToShow=3,slidesToScroll=1,dots=T,focusOnSelect=T,centerMode=T)). It is possible to synchronize the slides through the slickOpts calls, using asNavFor attribute. To replace the dots with icons use the dotObj argument to pass in the icon images and in the slickOpts add a customPaging attribute with the appropriate JS(.) function call. The slideType accepts the type of html DOM you want to be in the slide, eg img, iframe.

Examples

Run this code
# NOT RUN {
nba=c("ATL","BKN","BOS","CHA","CHI","CLE","DAL","DEN","DET","GSW",
"HOU","IND","LAC","LAL","MEM","MIA","MIL","MIN","NOP","NYK",
"OKC","ORL","PHI","PHX","POR","SAC","SAS","TOR","UTA","WAS")

nba_logos=sprintf("https://i.cdn.turner.com/nba/nba/.element/img/4.0/
global/logos/512x512/bg.white/svg/%s.svg",nba)

if(interactive()) 
  slickR(obj=nba_logos)
  
# }
# NOT RUN {
# }

Run the code above in your browser using DataLab