diff --git a/DESCRIPTION b/DESCRIPTION index f8f4afd..66ef701 100644 --- a/DESCRIPTION +++ b/DESCRIPTION @@ -1,5 +1,5 @@ Package: apexcharter -Version: 0.1.8.910 +Version: 0.1.8.9100 Title: Create Interactive Chart with the JavaScript 'ApexCharts' Library Description: Provides an 'htmlwidgets' interface to 'apexcharts.js'. 'Apexcharts' is a modern JavaScript charting library to build interactive charts and visualizations with simple API. diff --git a/NAMESPACE b/NAMESPACE index a1c38c2..a8b2349 100644 --- a/NAMESPACE +++ b/NAMESPACE @@ -86,6 +86,7 @@ importFrom(htmltools,resolveDependencies) importFrom(htmltools,tagList) importFrom(htmltools,tags) importFrom(htmlwidgets,JS) +importFrom(htmlwidgets,JSEvals) importFrom(htmlwidgets,createWidget) importFrom(htmlwidgets,getDependency) importFrom(htmlwidgets,shinyRenderWidget) diff --git a/R/proxy.R b/R/proxy.R index bcd7425..69318ba 100644 --- a/R/proxy.R +++ b/R/proxy.R @@ -1,28 +1,28 @@ #' @title Proxy for \code{apexchart} -#' +#' #' @description Allow to update a chart in Shiny application. #' #' @param shinyId single-element character vector indicating the output ID of the #' chart to modify (if invoked from a Shiny module, the namespace will be added #' automatically) #' @param session the Shiny session object to which the chart belongs; usually the -#' default value will suffice +#' default value will suffice #' #' @export -#' +#' #' @importFrom shiny getDefaultReactiveDomain #' apexchartProxy <- function(shinyId, session = shiny::getDefaultReactiveDomain()) { - + if (is.null(session)) { stop("apexchartProxy must be called from the server function of a Shiny app") } - + if (!is.null(session$ns) && nzchar(session$ns(NULL)) && substring(shinyId, 1, nchar(session$ns(""))) != session$ns("")) { shinyId <- session$ns(shinyId) } - + structure( list( session = session, @@ -43,7 +43,7 @@ apexchartProxy <- function(shinyId, session = shiny::getDefaultReactiveDomain()) #' @return A \code{apexchartProxy} \code{htmlwidget} object. #' @noRd .ax_proxy <- function(proxy, name, ...) { - if (!"apexchart_Proxy" %in% class(proxy)) + if (!"apexchart_Proxy" %in% class(proxy)) stop("This function must be used with a apexchartProxy object", call. = FALSE) proxy$session$sendCustomMessage( type = sprintf("update-apexchart-%s", name), @@ -52,7 +52,7 @@ apexchartProxy <- function(shinyId, session = shiny::getDefaultReactiveDomain()) proxy } .ax_proxy2 <- function(proxy, name, l) { - if (!"apexchart_Proxy" %in% class(proxy)) + if (!"apexchart_Proxy" %in% class(proxy)) stop("This function must be used with a apexchartProxy object", call. = FALSE) proxy$session$sendCustomMessage( type = sprintf("update-apexchart-%s", name), @@ -64,9 +64,9 @@ apexchartProxy <- function(shinyId, session = shiny::getDefaultReactiveDomain()) -#' @title Proxy for updating series. -#' -#' @description Allows you to update the series array overriding the existing one. +#' @title Proxy for updating series. +#' +#' @description Allows you to update the series array overriding the existing one. #' #' @param proxy A \code{apexchartProxy} \code{htmlwidget} object. #' @param newSeries The series array to override the existing one. @@ -75,10 +75,10 @@ apexchartProxy <- function(shinyId, session = shiny::getDefaultReactiveDomain()) #' @export #' #' @examples -#' +#' #' if (interactive()) { #' library(shiny) -#' +#' #' ui <- fluidPage( #' fluidRow( #' column( @@ -88,15 +88,15 @@ apexchartProxy <- function(shinyId, session = shiny::getDefaultReactiveDomain()) #' ) #' ) #' ) -#' +#' #' server <- function(input, output, session) { -#' +#' #' rv <- reactiveValues() #' rv$df <- data.frame( #' date = Sys.Date() + 1:20, #' values = sample(10:90, 20, TRUE) #' ) -#' +#' #' observe({ #' invalidateLater(1000, session) #' df <- isolate(rv$df) @@ -109,17 +109,17 @@ apexchartProxy <- function(shinyId, session = shiny::getDefaultReactiveDomain()) #' ) #' rv$df <- df #' }) -#' +#' #' output$chart <- renderApexchart({ #' # Generate chart once -#' apex(isolate(rv$df), aes(date, values), "spline") %>% +#' apex(isolate(rv$df), aes(date, values), "spline") %>% #' ax_xaxis( #' range = 10 * 24 * 60 * 60 * 1000 #' # Fixed range for x-axis : 10 days #' # days*hours*minutes*seconds*milliseconds #' ) #' }) -#' +#' #' observe({ #' # Update chart to add new data #' apexchartProxy("chart") %>% @@ -128,24 +128,24 @@ apexchartProxy <- function(shinyId, session = shiny::getDefaultReactiveDomain()) #' T #' ) #' }) -#' +#' #' } -#' +#' #' shinyApp(ui, server) #' } -#' +#' ax_proxy_series <- function(proxy, newSeries, animate = TRUE) { .ax_proxy2( - proxy = proxy, - name = "series", + proxy = proxy, + name = "series", l = list(newSeries = newSeries, animate = animate) ) } -#' @title Proxy for updating options -#' +#' @title Proxy for updating options +#' #' @description Allows you to update the configuration object. #' #' @param proxy A \code{apexchartProxy} \code{htmlwidget} object. @@ -153,11 +153,13 @@ ax_proxy_series <- function(proxy, newSeries, animate = TRUE) { #' #' @export #' +#' @importFrom htmlwidgets JSEvals +#' #' @examples -#' +#' #' if (interactive()) { #' library(shiny) -#' +#' #' ui <- fluidPage( #' fluidRow( #' column( @@ -176,20 +178,20 @@ ax_proxy_series <- function(proxy, newSeries, animate = TRUE) { #' ) #' ) #' server <- function(input, output, session) { -#' +#' #' output$chart <- renderApexchart({ #' apexchart() %>% -#' ax_chart(type = "bar") %>% +#' ax_chart(type = "bar") %>% #' ax_series(list( #' name = "Example", #' data = c(23, 43, 76, 31) -#' )) %>% +#' )) %>% #' ax_xaxis( #' categories = c("Label A", "Label B", #' "Label C", "Label D") #' ) #' }) -#' +#' #' observe({ #' apexchartProxy("chart") %>% #' ax_proxy_options(list( @@ -201,17 +203,17 @@ ax_proxy_series <- function(proxy, newSeries, animate = TRUE) { #' ) #' )) #' }) -#' +#' #' } -#' +#' #' shinyApp(ui, server) #' } -#' +#' ax_proxy_options <- function(proxy, options) { .ax_proxy2( - proxy = proxy, - name = "options", - l = list(options = options) + proxy = proxy, + name = "options", + l = list(options = options, evals = JSEvals(options)) ) } @@ -232,8 +234,8 @@ ax_proxy_options <- function(proxy, options) { #' @example examples/proxy-toggle.R ax_proxy_toggle_series <- function(proxy, series_name) { .ax_proxy2( - proxy = proxy, - name = "toggle-series", + proxy = proxy, + name = "toggle-series", l = list(seriesName = list1(series_name)) ) } diff --git a/inst/htmlwidgets/apexcharter.js b/inst/htmlwidgets/apexcharter.js index f4b1f3b..7548d5e 100644 --- a/inst/htmlwidgets/apexcharter.js +++ b/inst/htmlwidgets/apexcharter.js @@ -4,7 +4,7 @@ * https://github.com/dreamRs/apexcharter * */ - + /*global HTMLWidgets, ApexCharts, Shiny */ /// Functions @@ -19,14 +19,14 @@ var apexcharter = { } return widgetObj; }, - + isSingleSerie: function(options) { var typeLabels = ["pie", "radialBar", "donut"]; var lab = typeLabels.indexOf(options.w.config.chart.type) > -1; var single = options.w.config.series.length === 1; return lab | single; }, - + isDatetimeAxis: function(chartContext) { if ( chartContext.hasOwnProperty("w") && @@ -39,7 +39,7 @@ var apexcharter = { return false; } }, - + getSelection: function(chartContext, selectedDataPoints, serieIndex) { var typeLabels = ["pie", "radialBar", "donut"]; var typeXY = ["scatter", "bubble"]; @@ -79,7 +79,7 @@ var apexcharter = { } return selected; }, - + getYaxis: function(axis) { var yzoom = { min: null, max: null }; if (typeof axis.yaxis !== "undefined" && axis.yaxis !== null) { @@ -98,7 +98,7 @@ var apexcharter = { } return yzoom; }, - + getXaxis: function(axis) { var xzoom = { min: null, max: null }; if (typeof axis.xaxis !== "undefined") { @@ -112,7 +112,7 @@ var apexcharter = { } return xzoom; }, - + exportChart: function(x, chart) { if (x.hasOwnProperty("shinyEvents") & HTMLWidgets.shinyMode) { if (x.shinyEvents.hasOwnProperty("export")) { @@ -332,10 +332,16 @@ if (HTMLWidgets.shinyMode) { Shiny.addCustomMessageHandler("update-apexchart-options", function(obj) { var chart = apexcharter.getWidget(obj.id); if (typeof chart != "undefined") { - chart.updateOptions(obj.data.options); + var options = obj.data.options; + var evals = obj.data.evals; + if (!(evals instanceof Array)) evals = [evals]; + for (var k = 0; evals && k < evals.length; k++) { + window.HTMLWidgets.evaluateStringMember(options, evals[k]); + } + chart.updateOptions(options); } }); - + // toggle series Shiny.addCustomMessageHandler("update-apexchart-toggle-series", function(obj) { var chart = apexcharter.getWidget(obj.id); diff --git a/man/ax_proxy_options.Rd b/man/ax_proxy_options.Rd index b7684b5..c74da96 100644 --- a/man/ax_proxy_options.Rd +++ b/man/ax_proxy_options.Rd @@ -18,7 +18,7 @@ Allows you to update the configuration object. if (interactive()) { library(shiny) - + ui <- fluidPage( fluidRow( column( @@ -37,20 +37,20 @@ if (interactive()) { ) ) server <- function(input, output, session) { - + output$chart <- renderApexchart({ apexchart() \%>\% - ax_chart(type = "bar") \%>\% + ax_chart(type = "bar") \%>\% ax_series(list( name = "Example", data = c(23, 43, 76, 31) - )) \%>\% + )) \%>\% ax_xaxis( categories = c("Label A", "Label B", "Label C", "Label D") ) }) - + observe({ apexchartProxy("chart") \%>\% ax_proxy_options(list( @@ -62,9 +62,9 @@ if (interactive()) { ) )) }) - + } - + shinyApp(ui, server) } diff --git a/man/ax_proxy_series.Rd b/man/ax_proxy_series.Rd index 166f693..b97c22b 100644 --- a/man/ax_proxy_series.Rd +++ b/man/ax_proxy_series.Rd @@ -20,7 +20,7 @@ Allows you to update the series array overriding the existing one. if (interactive()) { library(shiny) - + ui <- fluidPage( fluidRow( column( @@ -30,15 +30,15 @@ if (interactive()) { ) ) ) - + server <- function(input, output, session) { - + rv <- reactiveValues() rv$df <- data.frame( date = Sys.Date() + 1:20, values = sample(10:90, 20, TRUE) ) - + observe({ invalidateLater(1000, session) df <- isolate(rv$df) @@ -51,17 +51,17 @@ if (interactive()) { ) rv$df <- df }) - + output$chart <- renderApexchart({ # Generate chart once - apex(isolate(rv$df), aes(date, values), "spline") \%>\% + apex(isolate(rv$df), aes(date, values), "spline") \%>\% ax_xaxis( range = 10 * 24 * 60 * 60 * 1000 # Fixed range for x-axis : 10 days # days*hours*minutes*seconds*milliseconds ) }) - + observe({ # Update chart to add new data apexchartProxy("chart") \%>\% @@ -70,9 +70,9 @@ if (interactive()) { T ) }) - + } - + shinyApp(ui, server) }