r - show/hide serie in highchart/shiny with an action button -


i want able hide/show serie in highchart plot in shiny. want have same smooth change 1 obtained when clicking on legend when clicking on button.

i want able reproduce this behaviour in shiny app.

my code far here.

library(shiny) library(shinydashboard) library(highcharter)  ui <- dashboardpage(   dashboardheader(),   dashboardsidebar(),   dashboardbody(     shinywidgets::materialswitch(       inputid = "button",       label = "button",       value = false     ),     div(id = "plotid", highchartoutput(outputid = "plot"))   ) )  server <- function(input, output, session){    output$plot <- renderhighchart({     data_plot <- data.frame(source = c("display", "email", "search", "natural"),                             serie1 = c(1563, 1458, 205, 695),                             serie2 = c(562, 258, 17, 115))     highchart() %>%       hc_chart(         type = 'bar'       ) %>%       hc_add_series(         data = data_plot$serie1,         name = 'serie 1'       ) %>%       hc_add_series(         data = data_plot$serie2,         name = 'serie 2'       ) %>%       hc_xaxis(         categories = data_plot$source,         title = list(text = 'source')       ) %>%       hc_plotoptions(bar = list(stacking = 'normal'))   })  }  shinyapp(ui = ui, server = server)

i not know javascript , not find way have want.

i tried chart object in order apply code given in link above not. know how trigger when clicking on button using 

tags$script('document.getelementbyid("button").onclick = function() { \\ code                 }'     )

thanks lot help.

my session info: 

r version 3.4.1 (2017-06-30) platform: x86_64-w64-mingw32/x64 (64-bit) running under: windows 7 x64 (build 7601) service pack 1  matrix products: default  locale: [1] lc_collate=french_france.1252  lc_ctype=french_france.1252    lc_monetary=french_france.1252 [4] lc_numeric=c                   lc_time=french_france.1252      attached base packages: [1] stats     graphics  grdevices utils     datasets  methods   base       other attached packages: [1] highcharter_0.5.0    shinydashboard_0.5.1 shiny_1.0.3           loaded via namespace (and not attached):  [1] rcpp_0.12.10      compiler_3.4.1    plyr_1.8.4        bindr_0.1         xts_0.9-7          [6] tools_3.4.1       digest_0.6.12     jsonlite_1.3      lubridate_1.6.0   tibble_1.3.3      [11] nlme_3.1-131      lattice_0.20-35   pkgconfig_2.0.1   rlang_0.1.1       psych_1.7.3.21    [16] igraph_1.0.1      parallel_3.4.1    bindrcpp_0.2      dplyr_0.7.2       stringr_1.2.0     [21] htmlwidgets_0.8   grid_3.4.1        data.table_1.10.4 glue_1.1.1        r6_2.2.0          [26] foreign_0.8-69    ttr_0.23-1        reshape2_1.4.2    tidyr_0.6.1       purrr_0.2.2.2     [31] magrittr_1.5      htmltools_0.3.5   rlist_0.4.6.1     assertthat_0.1    quantmod_0.4-7    [36] mnormt_1.5-5      mime_0.5          xtable_1.8-2      httpuv_1.3.3      stringi_1.1.3     [41] broom_0.4.2       zoo_1.7-14

edit :

to clarify question, when button clicked in shiny want first serie of plot hidden, happen if legend item "serie 1" clicked. not wnt rerender plot.

edit 2 :

adding visible = input$button hc_add_serie closest want still not same. looking same smooth/nice animation occurs when legend clicked.

after trials , errors found solution using javascript.

here code : 

library('shiny') library('shinydashboard') library('highcharter') library('shinyjs')  jscode <- " shinyjs.toggleserie = function(params) { var serietotoggle = $('#plot').highcharts().get('idserie'); if(serietotoggle.visible){ serietotoggle.setvisible(false); }  else { serietotoggle.setvisible(true); } } "  ui <- dashboardpage(   dashboardheader(),   dashboardsidebar(),   dashboardbody(     useshinyjs(),     extendshinyjs(text = jscode),     shinywidgets::materialswitch(       inputid = "button",       label = "button",       value = false     ),     highchartoutput(outputid = "plot")   ) )  server <- function(input, output, session){    output$plot <- renderhighchart({     data_plot <- data.frame(categories = c("a", "b", "c", "d"),                             serie1 = c(1563, 1458, 205, 695),                             serie2 = c(562, 258, 17, 115))     highchart() %>%       hc_chart(         type = 'bar'       ) %>%       hc_add_series(         data = data_plot$serie1,         name = 'serie hide/show',         id = 'idserie'       ) %>%       hc_add_series(         data = data_plot$serie2,         name = 'serie 2'       ) %>%       hc_xaxis(         categories = data_plot$categories,         title = list(text = 'categories')       ) %>%       hc_plotoptions(bar = list(stacking = 'normal'))   })    onclick(id = "button", expr = {     js$toggleserie()   })    session$onsessionended(stopapp) }  shinyapp(ui = ui, server = server)

it gives desired behaviour.


Comments

Post a Comment

Popular posts from this blog

php - Vagrant up error - Uncaught Reflection Exception: Class DOMDocument does not exist -

i've set bento/ubuntu-16.04 vagrant box using php 5.6, , getting following error quite few times when try , run shell script: "uncaught reflection exception: class domdocument not exist". i've tried adding following top of script (not together), each no success: "sudo apt-get install php5.6-xml", "sudo apt-get install php5-xml", "sudo apt-get install php-dom" i've tried resetting server "sudo service apache2 restart". does have suggestions?
Read more

vue.js - Create hooks for automated testing -

Image
qa guys complained can't automate frontend testing. because our html looks same outside. lazy hack did this <template> <div :role="$options.name"> ... </div> </template> <script> export default { name: 'vmcomponentname' } </script> which takes name script , applies html. in browser get: <div role="vmcomponentname"> ... </div> line :role="$options.name" goes in every component. is there dry er solutions? please share. additional details i'll explain in details looking for. imagine have vmusercreate form creates user. test case can create user . to automatically test without role, have use following selector: .wrapper > .wrapper > .wrapper > .submit-button the test extremely brittle (will break lot). if use roles can use [role="vmusercreateform"] .submit-button selector. many folds less brittle. so basically, i'm ...
Read more

Add new key value to json node in java -

i have json file : { "id":1, "name":"abc", "addressdetails": { "city":"newyork" } } i wanted add 1 more key-value ("pincode" : "414141") node 'addressdetails'. i tried using : objectmapper mapper = new objectmapper(); jsonnode root = mapper.readtree(new file("d://test.json")); objectnode node = mapper.createobjectnode(); node.with("addressdetails").put("pincode", "414141"); but it's not getting added, there way can ? you can try you should modify file path objectmapper mapper = new objectmapper(); objectnode nodes = mapper.readvalue(new file("d:\\test.txt"), objectnode.class); nodes.with("addressdetails").put("pincode", "414141"); mapper.writer().writevalue(new file("d:\\test.txt"), nodes);
Read more