Highcharts too slow when plotting 4000 bars (rCharts)

Question

We are trying to plot around 4000 data points from column a1 as bars using Highcharts. The colors of the a1 bars are based on the values of another column called a3. If a3 is negative on one row, the corresponding bar about a1 should be red, and positive a3 should give color green.

The problem is that the graph takes around 25 seconds to generate, and it takes 20 seconds just to print the graph. Could someone help us fix the code and make it faster? We tried to disable animations and shadows, but that did not help too much. Here is the code:

fun <- function(){

      ## Generate a random data set with roughly 4,000 lines
      df <- as.data.frame(cbind(x = seq(1:3900),
                                a1 = rnorm(3900, 1000000, 2000000),
                                a2 = abs(rnorm(3900, 1000000, 2000000)),
                                a3 = rnorm(3900, 20000, 30000),
                                a4 = rnorm(3900, 1000, 500),
                                a5 = rnorm(3900, 0.01, 0.02)))

      ## Modify the data set to assign colors to each bar based on the values
      ## of a3. Green bars signify positive a3's and red bars signify
      ## negative a3's
      df <- df %>% 
            mutate(a6 = cumsum(a3)) %>%
            mutate(color = ifelse(a3 > 0, 
                                  "rgba(50,205,50,0.6)", 
                                  "rgba(223,83,83,0.6)")) %>%
            mutate(y = a1,
                   a1 = comma_format()(round(a1, 0)),
                   a3 = comma_format()(round(a3, 0)),
                   a4 = comma_format()(round(a4, 4)),
                   a5 = comma_format()(round(a5, 0)),
                   a6 = comma_format()(round(a6, 0))
            )

      ## Store the data in a list so that it is readable by Highcharts
      input <- list()
      input <- lapply(unname(split(df, seq(nrow(df)))), as.list)

      ## Draw the graph with Highcharts
      a <- rCharts::Highcharts$new()
      a$series(data = input, 
               name = "a1 values", 
               type = "column")
      a$plotOptions(series = list(turboThreshold = 4000))
      a$chart(zoomType = "xy", animation = FALSE)
      a$addParams(width = 1000, height = 400, title = list(text = "The Slow Chart"))
      a$tooltip(formatter = "#! function() 
            {return 'Date:<b> ' + this.point.x + 
                        '</b> <br/>a1 values:<b> ' + this.point.a1 +
                '</b> <br/>a3 values:<b> ' + this.point.a2 +  
                '</b> <br/>a4 values:<b> ' + this.point.a3 + 
                '</b> <br/>a5 values:<b> ' + this.point.a5 + 
                '</b> <br/>a6 values:<b> ' + this.point.a6} !#")
      print(a)
}

Any help is appreciated!

Pharisaism

Isn't 4000of bars per chart a bit too much? I mean if you won't have width=4000px, then you won't be able to display all of that columns. For example using 500x500 chart, it would require to rendered 4columns in one pixel ;) Anyway, consider using Highstock with dataGrouping feature. – Resting

Thanks for the suggestions! Maybe I should try Highstock and see if that can solve the problem. The only thing I am still wondering about is that it should not be that slow to plot 4000 bars because people can actually use Highcharts to plot 1.7 million data points, as shown in the Highcharts gallery, and because some video games could do something more complicated than that in around a second. I am gonna try Highstocks tomorrow, but I am just curious if I defined something in a bad way. – Pharisaism

It's 1.7 million of points in Highstock, not Highcharts :) In Highstock, you can plot a lot of points using dataGrouping (no limit, but around 100 000 should be smooth). Or use asynchronous data loading to load even more points, as in example in 1.7million of points. – Resting

Thank you Pawel! It is actually working a lot faster than before now! :D – Pharisaism

Answer 1

First of all, please show what packages are you using in your code (dplyr, scales).

There's a boost module for highcharts. sadly rCharts dont include that module by default so you need to add manually.

By other hand. There is a new wrapper for highcharts called highcharter which have an implementation of this module. Using it dont take more than 1 second to chart the 3900 columns.

highchart2() %>% 
  hc_title(text = "Not so slow chart ;)") %>% 
  hc_subtitle(text = "Thanks boost module") %>% 
  hc_chart(zoomType = "x", animation = FALSE, type = "column") %>% 
  hc_plotOptions(series = list(turboThreshold = 4000)) %>% 
  hc_add_serie(data = input)

Check the speed/here:

http://rpubs.com/jbkunst/highcharts-too-slow-when-plotting-4000-bars-rcharts

Goforth

Terrific, amazing work! I would like to nominate you for the Nobel Prize! – Hogue

@Hogue Haha ty for that compliment. But this is only highcharts, I'm just a wrapperman ;) – Goforth