Highcharter messes up colors once shiny app published

I'm trying to build some kind of time line with the package highcharter. I chose to use a stacked column chart for that and i want the colors to be defined as gradients derived from the value (basically 0 -> white, 100 -> darkest color). I already prepared the hexadecimal code for these colors. Even though it's working fine locally (the colors get assigned as i want), once published online, the colors go back to the standards ones and therefore don't follow any gradient. I really don't get what's wrong. I'm still new to highcharter, have worked a lot more with ggplot, maybe i miss something in the highcharter structure, i find the definition of colors in highcharter way less intuitive than with ggplot.

In the code:
Chart 1, working fine locally but colors messed up once published
Chart 2, I tried to use colorize, it also worked fine locally once published, the app doesn't even load 'Contact the author' so i assume shiny doesn't 'handle' colorize?
Chart 3, i tried to use rgba notations. Doesn't work at all even locally, the colors are messed up.
(I commented my second and third attempt)

library(shiny)
library(highcharter)
library(dplyr)

# Data preparation
Date<-c(rep(c("01/01/2021",
               "02/01/2021",
               "03/01/2021",
               "04/01/2021",
               "05/01/2021",
               "06/01/2021",
               "07/01/2021",
               "08/01/2021",
               "09/01/2021",
               "10/01/2021",
               "11/01/2021",
               "12/01/2021",
               "13/01/2021",
               "14/01/2021",
               "15/01/2021",
               "16/01/2021",
               "17/01/2021",
               "18/01/2021",
               "19/01/2021",
               "20/01/2021",
               "21/01/2021",
               "22/01/2021",
               "23/01/2021",
               "24/01/2021",
               "25/01/2021",
               "26/01/2021",
               "27/01/2021",
               "28/01/2021",
               "29/01/2021",
               "30/01/2021",
               "31/01/2021",
               "01/02/2021",
               "02/02/2021"),3))

Index<-c(rep('Index_1',33),rep('Index_2',33),rep('Index_3',33))

value<-c(rep(10,5),rep(30,4),rep(40,8),rep(10,10),rep(60,6),rep(100,3),rep(80,3),rep(50,11),
         rep(80,12),rep(20,7),rep(50,2),rep(70,5),rep(20,10),rep(50,8),rep(100,5))

col<-c(rep("#e6f0f3",5),
       rep("#b5d2db",4),
       rep("#9dc3d0",8),
       rep("#e6f0f3",10),
       rep("#6ca5b8",6),
       rep("#a1078b",3),
       rep("#b338a2",3),
       rep("#d083c5",11),
       rep("#b338a2",12),
       rep("#eccde7",7),
       rep("#d6857f",2),
       rep("#c5544c",5),
       rep("#eececc",10),
       rep("#d6857f",8),
       rep("#ad0c00",5))

DummyData<-data.frame(Date,Index,value,col)

DummyData$Index<-factor(DummyData$Index,c('Index_1','Index_2','Index_3'))

#Second attempt
# DummyData_2<-DummyData
# DummyData_2$col<-factor(DummyData_2$col,unique(DummyData_2$col))
# DummyData_2$col<-colorize(DummyData_2$col,unique(DummyData_2$col))

# 
# ##Third attempt
# 
#DummyData_3<-DummyData
#DummyData_3<-DummyData_3 %>% mutate (col=hex_to_rgba(col)) 


# Define UI for application that draws a histogram
ui <- fluidPage(
  highchartOutput("chart",height='200px'),
  #highchartOutput("chart2",height='200px'),
  #highchartOutput("chart3",height='200px')
)

#' Title
#'
#' @param input 
#' @param output 
#'
#' @return
#' @export
#'
#' @examples
server <- function(input, output) {
  
  output$chart <- renderHighchart({

    hchart(DummyData, "column", hcaes(x = Date, y = 100,group=Index,color=col)) %>%
     hc_plotOptions(column=list(pointWidth=40,stacking='normal')) %>%
     hc_colors(c('#0a698a','#a1078b','#ad0c00')) %>%
     hc_yAxis(
         title = FALSE,
          labels=FALSE) %>%
      hc_tooltip(
        pointFormat = "
          Index: {point.Index:,.0f}<br>
          value: {point.value:,.0f}<br>")
  })
  
  # output$chart2 <- renderHighchart({
  # 
  #   hchart(DummyData_2, "column", hcaes(x = Date, y = 100,group=Index,color=col)) %>%
  #     hc_plotOptions(column=list(pointWidth=40,stacking='normal')) %>%
  #     hc_colors(c('#0a698a','#a1078b','#ad0c00')) %>%
  #     hc_yAxis(
  #       title = FALSE,
  #       labels=FALSE) %>%
  #     hc_tooltip(
  #       pointFormat = "
  #         Index: {point.Index:,.0f}<br>
  #         value: {point.value:,.0f}<br>")
  # })
  
  
  # output$chart3 <- renderHighchart({
  # 
  #   hchart(DummyData_3, "column", hcaes(x = Date, y = 100,group=Index,color=col)) %>%
  #     hc_plotOptions(column=list(pointWidth=40,stacking='normal')) %>%
  #     hc_colors(c('#0a698a','#a1078b','#ad0c00')) %>%
  #     hc_yAxis(
  #       title = FALSE,
  #       labels=FALSE) %>%
  #     hc_tooltip(
  #       pointFormat = "
  #         Index: {point.Index:,.0f}<br>
  #         value: {point.value:,.0f}<br>")
  # })
  # 
}

# Run the application 
shinyApp(ui = ui, server = server)

Thanks in advance for the help!

Local result:

Once published:

This topic was automatically closed 54 days after the last reply. New replies are no longer allowed.

If you have a query related to it or one of the replies, start a new topic and refer back with a link.