Linevis Graph Timelines

Interactive Time Series Visualizations

Create interactive time series visualizations. ‘linevis’ includes an extensive API to manipulate a timeline after creation, and supports getting data out of the visualization. Based on the ‘vis.js’ Timeline JavaScript library and the ‘timevis’ package.

Basic call

Let’s assume you have the following time serie you want to display:

  library(linevis)

  df_data = data.frame(x = c('2014-06-11',
                             '2014-06-12',
                             '2014-06-13',
                             '2014-06-14',
                             '2014-06-15',
                             '2014-06-16'),
                       y = c(0,
                             1,
                             30000,
                             10,
                             150,
                             30000))

The minimum call to create a linevis time-series visualization is:

  linevis(df_data)

We can add a group, e.g. to set a threshold. To style them with CSS, we use the className column in the group data frame.

  df_data$group = 0

  df_threshold = data.frame(x = c('2014-06-09', '2014-06-18'),
                            y = c(20, 20),
                            group = 1)

  df_data = rbind(df_data, df_threshold)

  df_group = data.frame(id = 0:1,
                        content = c('Time-serie', 'Threshold'),
                        className = c('grp1', 'grp2'))

  /* CSS styling, to include either inline or as a separate file */

  .grp1 {
    fill: #0df200;
    fill-opacity: 0;
    stroke-width: 2px;
    stroke: #0df200;
  }

  .grp2 {
    fill: #f23303;
    fill-opacity: 0;
    stroke-width: 2px;
    stroke: #f23303;
  }

  linevis(df_data, groups = df_group)

Finally we can set options, as:

Minimum and maximum date ranges
Log scaling
Interpolation
Legend position

  linevis_options = list(min = '2014-06-11', max = '2014-06-18',
                         interpolation = FALSE,
                         legend = list(left = list(position = 'bottom-left')))

  linevis(df_data, groups = df_group, log_scale = TRUE,
          options = linevis_options)

Linevis Graph Timelines

Thomas Charlon

2025-01-09

Linevis Graph Timelines

Interactive Time Series Visualizations

Basic call