rshinyr-leafletrcharts

R Shiny clusterOptions not displayed on a tabPanel - conflict with rCharts?


I am sort of struggling to display clusters of positions on a tabPanel map, when on another tabPanel, a heatmap is active.

The weird thing is that when I remove the second tabPanel (heatmap) in the ui.R, then the clusters are shown ok on the first tabPanel.

If I keep the heatmap tabPanel in the ui.R and remove "clusterOptions = markerClusterOptions()" in the server.R then the positions are displayed on the first tabPanel and heat map is OK.

Here is my code so you can easily reproduce the problem:

global.R

library(shiny)
library(shinydashboard)
library(leaflet)
library(dplyr)
library(plyr)
library(rCharts)

Lat <- c(48.89612,48.87366,48.88739,48.88558,48.87561)
Long <- c(2.383857,2.383921,2.387161,2.386701,2.387337)
data_test <- data.frame(Lat,Long)
data_test <- ddply(data_test, .(Lat, Long), summarise, count = length(Lat))

server.R

library(rCharts)
library(shiny)
library(shinydashboard)
library(leaflet)
library(dplyr)
library(plyr)

    shinyServer(function (input, output){
  
      output$map1 <- renderLeaflet({ 
       leaflet() %>% setView(lng = 2.3488000, lat = 48.8534100, zoom = 12) %>%
       addProviderTiles('CartoDB.Positron') %>%
       addTiles() %>%
       addCircleMarkers(lng = data_test$Long, lat = data_test$Lat,color= 
                       'red', 
                        clusterOptions = markerClusterOptions()) 
          })

      output$baseMap <- renderMap({  
       map2 = Leaflet$new() 
       map2$setView(c(48.85341,2.34880,13))
       map2$addParams(height = 590, width = 880, zoom = 12)
       map2$set(dcom = "baseMap")
       return(map2)
          })

      output$heatMap <- renderUI({

        j <- paste0("[",data_test[,"Lat"], ",", data_test[,"Long"],  
             ",",data_test[,"count"], "]", collapse=",")
        j <- paste0("[",j,"]")

        tags$body(tags$script(HTML(sprintf("
                                   var addressPoints = %s
                                   if (typeof heat === typeof undefined) {
                                   heat = L.heatLayer(addressPoints, {radius:
                                   50,blur: 20,maxZoom: 5,max: 6.0,
                                   gradient: {0.0: 'green',0.5: 'yellow',1.0:
                                   'red' }}),
                                   heat.addTo(map)} 
                                   else {heat.setLatLngs(addressPoints)}", j
                                   ))))                                                  

          })
        })
  
  

ui.R

library(rCharts)
library(shiny)
library(shinydashboard)
library(leaflet)
library(dplyr)
library(plyr)

   header <- dashboardHeader(
    title = "Test Paris", titleWidth = 450
     )

    body <- dashboardBody(
    fluidRow(
      column(width = 12,
       
           tabBox(width = 12,               
           id = "CartePrincipale",                
           tabPanel("Map of Accidents",leafletOutput("map1", height="590px")),
           tabPanel("HeatMap of Accidents",
                       showOutput("baseMap", "Leaflet"),
                       tags$style(' .leaflet {height: "590px";}'),      
  tags$head(tags$script(src="http://leaflet.github.io/Leaflet.heat/dist/leaflet-heat.js")),    
                       uiOutput("heatMap"))
           
                         )))
    )

    dashboardPage(
      header,
      dashboardSidebar(disable = TRUE),
      body)

Is there a conflict somewhere with rCharts?


Solution

  • Well, I finally came across the answer, thanks to a few posts and replies from Ramnath to other people issues in the website.

    In the ui.r, for the second tabPanel, the trick was just to replace

    showOutput("baseMap", "Leaflet")
    

    by :

    htmlOutput("baseMap")
    

    Clusters are now displayed Ok on the first tabPanel !