First, you should load recharts:

library(recharts)

1 Introduction

The default position of dataZoom is 6 o’clock.

The recommended approach to use setDataZoom is chart %>% setDataZoom(...).

2 Function Call

All the function names have two forms: small camel and lowercase_underscore (endorsed by Hadley Wickham). To be lazy, we also provide short forms as well (e.g., dz for dataZoom).

setDataZoom(chart, show = TRUE, pos = 6, range = NULL, width = 30,
  fill = "rgba(144,197,237,0.2)", handle = "rgba(70,130,180,0.8)",
  bgColor = "rgba(0,0,0,0)", dataBgColor = "#eee", showDetail = TRUE,
  realtime = FALSE, zoomLock = FALSE, ...)

set_datazoom(chart, show = TRUE, pos = 6, range = NULL, width = 30,
  fill = "rgba(144,197,237,0.2)", handle = "rgba(70,130,180,0.8)",
  bgColor = "rgba(0,0,0,0)", dataBgColor = "#eee", showDetail = TRUE,
  realtime = FALSE, zoomLock = FALSE, ...)

set_dz(chart, show = TRUE, pos = 6, range = NULL, width = 30,
  fill = "rgba(144,197,237,0.2)", handle = "rgba(70,130,180,0.8)",
  bgColor = "rgba(0,0,0,0)", dataBgColor = "#eee", showDetail = TRUE,
  realtime = FALSE, zoomLock = FALSE, ...)

setDZ(chart, show = TRUE, pos = 6, range = NULL, width = 30,
  fill = "rgba(144,197,237,0.2)", handle = "rgba(70,130,180,0.8)",
  bgColor = "rgba(0,0,0,0)", dataBgColor = "#eee", showDetail = TRUE,
  realtime = FALSE, zoomLock = FALSE, ...)
Arg Requirement

chart

Echarts object generated by echartR or echart.

show

logical. Show the dataZoom control if TRUE. If you want to remove dataZoom from the echarts object, set it NULL.

pos

Clock position of the dataZoom. Default 6. Refer to vecPos. Or you can define the position vector c(x, y, orient) yourself.

range

A vector of c(min, max). Cannot be out of the frame c(0, 100)

width

The width of the dataZoom bar. Default 20px.

fill

fillerColor of the dataZoom bar, in character ‘rgba(red, green, blue, alpha)’ format. Default 'rgba(144,197,237,0.2)' (“#90C5ED33”).

handle

handleColor of the dataZoom bar, in character ‘rgba(red, green, blue, alpha)’ format. Default 'rgba(70,130,180,0.8)' (“#4682B4CC”).

bgColor

background color, default transparent (‘rgba(0,0,0,0)’).

dataBgColor

background color of the data thumbnail (1st series). Default ‘#eee’.

showDetail

Logical, if show the details when zooming. Defaul TRUE.

realtime

Logical, if realtime display the changes when zooming. Default FALSE.

zoomLock

Logical, if the zoom range is locked. Deafult FALSE.

…

Elipsis.

3 Showcase

g <- echartr(iris, Sepal.Width, Petal.Width, Species)
g

Initially dataZoom is not shown. Let’s turn if on.

g %>% setDataZoom(show=TRUE)

Relocate the dataZoom

g %>% setDataZoom(pos=12)

Customize the format.

g %>% setDataZoom(bgColor='yellow', dataBgColor='gold', fill='tan',
                  handle='maroon')

Set the initial range 20% - 60%.

g %>% setDataZoom(range=c(20, 60))