Real-time Line Plot Test

1. Single Series

Correctly render a single series plot of y = cos(x) + 1 over the range [0, 2π].

2. Single Series Single Transition

Correctly render a single series plot of y = sin(x) + 1. When the button is pressed push a new data point to the chart and correctly animate/render the transiton.

Next

3. Single Seires Stream

Correctly play / pause a single series stream of values from the plot y = cos(x) + 1.

Play

4. Multi Series

Correctly render a multi series plot of the following functions:

• y = log(x+1)
• y = 2*log(x+1)
• y = 3*log(x+1)

5. Multi Series Single Transition

Correctly render a multi series plot of the following functions:

• y = x
• y = x1.25
• y = x1.5

and correctly render/animate the transiton after pressing the "Next" button.

Next

6. Multi Seires Stream

Correctly play / pause a multi series stream of values over the following plots:

• x
• x * log(x)
• x * log2(x)

Play

7. Color Override

The first layer should pink, the second green, and the third blue.

8. Categorical Colors

Correctly render and switch between different categorical colors. Unlike with the basic charts this doesn't occur just by switching the class name on the containing element. The CSS query engine must be purge and the plot must be manually redrawn, like so:

Epoch.QueryCSS.purge();
chart.draw();

category10 category20 category20b category20c

9. Show/Hide Layers

Toggle A Toggle B Toggle C | Play

10. Fixed Range

Render a single series plot of y = cos(x). Instead of automatically setting the range to [-1, 1], the range is manually set to [-2, 5].

11. Multi-axes

Render a plot that uses independent axes ranges for the left and right sides.

12. Multi-axes with Labeled Ranges

Render a plot that uses independent axes ranges for the left and right sides that are associated to labels in the chart data.