2

I am experimenting with Highcharter's Gantt chart possibilities and I wrote a little test app to learn how this library works.

I would like to be able to move a node in the chart. For example, I like to move the same first node to a few days earlier.

My questions are:

  1. How do I add this (moving the node) functionality to the chart?
  2. In an extension to the previous question, how do I move only the start / end time of a node?
  3. How can I capture this update information in my input$ variables in the Shiny server?

Here I is my code:


library(shiny)
library(tidyverse)
library(lubridate)
library(highcharter)


data <- tibble(
  start = (today()+0.12) %>% as_datetime(), 
  end = (today()+1) %>% as_datetime(), 
  name = "Nissan Leaf", 
  id = "#1"
) %>% 
  add_row(
    start = (today()-2.2) %>% as_datetime(), 
    end = (today()+0) %>% as_datetime(), 
    name = "Tesla", 
    id = "#2"
  ) %>% 
  add_row(
    start = (today()+1.5) %>% as_datetime(), 
    end = (today()+2.2) %>% as_datetime(), 
    name = "Nissan Leaf", 
    id = "#3"
  ) %>% 
  mutate_if(is.POSIXct, datetime_to_timestamp) 

ui <- fluidPage(
  highchartOutput("hc_gantt"), 
  hr(), 
  uiOutput("click_ui")
)

server <- function(input, output) {

output$hc_gantt <- renderHighchart({
  hc_gantt <- highchart(
    type = "gantt"
  ) %>% 
    hc_add_series(
      name = "Program",
      data = data,
      grouping = list(
        groupPadding = 0.2,
        pointPadding = 0.1,
        borderWidth = 0,
        shadow = FALSE
      )
    ) %>% 
    hc_yAxis(
      uniqueNames = TRUE
    ) %>% 
    hc_add_event_point(event = "click") %>%
    hc_add_event_point(event = "mouseOver")

  hc_gantt %>% return()
})  

observe({
  print(names(input))
})

output$click_ui <- renderUI({
  if (is.null(input$hc_gantt_click)) {
    return()
  }
  
  wellPanel(
    data %>% 
      filter(
        name == input$hc_gantt_click$name,
        start == input$hc_gantt_click$x
      ) %>% 
      # print() %>% 
      return()
  )
})

}

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

Jochem
  • 3,295
  • 4
  • 30
  • 55
  • Sorry if this is a dumb question, but what do you mean by node? – Russ Mar 28 '23 at 16:55
  • @Russ: With the 'node' I am referring to the bar in the chart that the code above produces, which connects the vertical and horizontal axis. Essentially indicating the time that one resource (car in this case) is booked. – Jochem Mar 29 '23 at 07:06

0 Answers0