View Rows Over Time Panels

The Rows Over Time panels all use the rows' ROWTIMES (their timestamps) to display data as it streams. These panels use ROWTIME as the domain (usually, this is the x axis). All numerical columns, such as “number of web logins” or “number of phone logins” are displayed as the range (the y axis). They will be most useful if these columns are meaningful measurements (as opposed to account numbers or other non-measurement numbers). You can specify which columns to include by modifying the input preferences. Sometimes you may need to create a new view on a stream, in order to see only those numerical columns that are meaningful. See the subtopic Panel Development Process for advice on developing meaningful data for s-Dashboard.

For example, the Time Series panel (shown as area) lets you see the values for multiple stream columns as they change over time. Time moves from right to left, with the latest rows appearing as the visualization moves left.

Bars Over Time

A bar graph shows each numerical row as a bar. s-Dashboard displays each numerical column regardless of its range. Data will be most useful if columns are in comparable ranges.

As with other panels, you can set preferences for the bar graph panel by clicking the Preferences icon. This panel is built with Chart.js and is highly customizable. For example, this panel has a bar border width field that specifies the border width to use when drawing the bars. These properties can be a single value, such as 2, or a comma-separated list, like 2,3,2. Single values apply to all the data columns, while a list applies to each data column in turn. So if there are columns alpha, beta, gamma, and delta, and the bar border width is 2,3,2, the bar corresponding to the beta column would have a border width of 3 while the other bars would have a border width of 2.

This feature is most useful for properties that specify a color. You can specify a list of colors explicitly, such as red,green,blue, or rgba(255,0,0,1.0),rgba(0,255,0,1.0),rgba(0,0,255,1.0). You may also access the palettes provided by Rickshaw by entering a value like palette(colorwheel,1.0). colorwheel can be any of the Rickshaw palettes: classic9, colorwheel, cool, munin, spectrum14, spectrum2000, spectrum2001. 1.0 is the alpha value to apply to the colors.

.

If you enable Advanced Options, you can edit the options portion of the Chart.js spec as a JSON object. Here, you can make further adjustments to the Bar Chart using the information from chart.js here: https://www.chartjs.org/docs/latest/charts/bar.html.

Radar Chart

A radar chart shows multiple data points and the variation between them in a circular arrangement. You can use these to compare the results of multiple data sets over time, to find clusters of trending data, and to note data outliers.

The Radar Chart panel is also built with Chart.js and is highly customizable. For example, this panel has both Fill Cover and Curve Color fields that specify the color of fill and curves in the chart. These fields can be filled in with a single color, such as “blue” or “rgba)0,0,255,1.0)” or “palate(classic9)”. Scheme may be classic9, colorwheel, cool, munin, spectrum14, spectrum2000, spectrum2001.

If you enable Advanced Options, you can edit the options portion of the Chart.js spec as a JSON object. Here, you can make further adjustments to the Radar Chart using the information from chart.js here: https://www.chartjs.org/docs/latest/charts/radar.html.

Line Plot Over Time

Time Series

This chart uses one or more numerical columns and ROWTIME. This flexible panel, based on the Rickshaw demo, offers you a variety of options once you enable its control panel.

This panel lets you choose which columns to display, whether to display an area, bar, line, or scatter visualization, as well as options for how to display these:

You can also use Panel Preferences to choose from a variety of color schemes.

Finally, you can choose how often this panel updates. It may improve performance to increase the default setting of one second.

Area Over Time

This chart uses one or more numerical columns and ROWTIME. An area chart or area graph displays graphically quantitative data. It is based on the line chart. The area between axis and line are commonly emphasized with colors, textures and hatchings.

This panel is also built in Rickshaw, and displays data as an area chart. It is useful for quickly creating an area chart.

Lines

This chart uses one or more numerical columns and ROWTIME. A line chart displays data over time as a line.

Scatter

This chart uses one or more numerical columns and ROWTIME. Like the Lines panel, but uses single points instead of lines.

For more information on scatter plot charts, see https://en.wikipedia.org/wiki/Scatter_plot.

For more information on customizing charts built in Rickshaw, see https://github.com/shutterstock/rickshaw