108 lines
2.0 KiB
Plaintext
108 lines
2.0 KiB
Plaintext
---
|
|
title: "Syncing charts"
|
|
output: rmarkdown::html_vignette
|
|
vignette: >
|
|
%\VignetteIndexEntry{Syncing charts}
|
|
%\VignetteEngine{knitr::rmarkdown}
|
|
%\VignetteEncoding{UTF-8}
|
|
---
|
|
|
|
```{r, include = FALSE}
|
|
knitr::opts_chunk$set(
|
|
collapse = TRUE,
|
|
comment = "#>"
|
|
)
|
|
```
|
|
|
|
```{r setup}
|
|
library(apexcharter)
|
|
data("economics", package = "ggplot2")
|
|
```
|
|
|
|
|
|
## Sync charts
|
|
|
|
With [Apexcharts](https://apexcharts.com) you can sync (tooltip, zoom) several charts together by providing a group and id to each charts. This works in Shiny and Markdown. Here a basic example :
|
|
|
|
```{r example-1, eval=FALSE}
|
|
apex(
|
|
data = tail(economics, 150),
|
|
mapping = aes(x = date, y = pce),
|
|
type = "line"
|
|
) %>%
|
|
ax_chart(
|
|
group = "economics", id = "pce" # <- define common group and unique id
|
|
) %>%
|
|
ax_yaxis(
|
|
labels = list(
|
|
minWidth = 15
|
|
)
|
|
)
|
|
|
|
apex(
|
|
data = tail(economics, 150),
|
|
mapping = aes(x = date, y = psavert),
|
|
type = "line"
|
|
) %>%
|
|
ax_chart(
|
|
group = "economics", id = "psavert" # <- define common group and unique id
|
|
) %>%
|
|
ax_yaxis(
|
|
labels = list(
|
|
minWidth = 15
|
|
)
|
|
)
|
|
```
|
|
|
|
|
|
```{r run-example-1, echo=FALSE, ref.label="example-1"}
|
|
|
|
```
|
|
|
|
|
|
|
|
## Brush chart
|
|
|
|
Create a brush chart to navigate into a synced chart.
|
|
|
|
```{r example-2, eval=FALSE}
|
|
apex(
|
|
data = economics,
|
|
mapping = aes(x = date, y = psavert),
|
|
type = "line"
|
|
) %>%
|
|
ax_chart(
|
|
id = "target-chart",
|
|
toolbar = list(
|
|
autoSelected = "pan",
|
|
show = FALSE
|
|
)
|
|
)
|
|
|
|
apex(
|
|
data = economics,
|
|
mapping = aes(x = date, y = psavert),
|
|
type = "line",
|
|
height = "130px"
|
|
) %>%
|
|
ax_chart(
|
|
brush = list(
|
|
target = "target-chart",
|
|
enabled = TRUE
|
|
),
|
|
selection = list(
|
|
enabled = TRUE,
|
|
xaxis = list(
|
|
min = format_date(economics$date[1]),
|
|
max = format_date(economics$date[100])
|
|
)
|
|
)
|
|
) %>%
|
|
ax_xaxis(labels = list(show = FALSE)) %>%
|
|
ax_yaxis(labels = list(show = FALSE))
|
|
```
|
|
|
|
|
|
```{r run-example-2, echo=FALSE, ref.label="example-2"}
|
|
|
|
``` |