Timelion is a time series data visualizer that enables you to combine totally
independent data sources within a single visualization. It's driven by a simple
expression language you use to retrieve time series data, perform calculations
to tease out the answers to complex questions, and visualize the results.
For example, Timelion enables you to easily get the answers to questions like:
* <<time-series-intro, What is the real-time percentage of CPU time spent in user space to the results offset by one hour?>>
* <<mathematical-functions-intro, What does my inbound and outbound network traffic look like?>>
* <<timelion-conditional-intro, How much memory is my system actually using?>>
[float]
[[time-series-before-you-begin]]
=== Before you begin
In this tutorial, you'll use the time series data from https://www.elastic.co/guide/en/beats/metricbeat/current/index.html[Metricbeat]. To ingest the data locally, link:https://www.elastic.co/downloads/beats/metricbeat[download Metricbeat].
<1> `.lines()` changes the appearance of the chart lines. In this example, `.lines(fill=1,width=0.5)` sets the fill level to `1`, and the border width to `0.5`.
image::images/timelion-customize02.png[]
{nbsp}
[float]
[[time-series-change-color]]
=== Change the line colors
To make the current hour data stand out, change the line colors:
<1> `.color()` changes the color of the data. Supported color types include standard color names, hexadecimal values, or a color schema for grouped data. In this example, `.color(gray)` represents the last hour, and `.color(#1E90FF)` represents the current hour.
<1> `.legend()` sets the position and style of the legend. In this example, `.legend(columns=2, position=nw)` places the legend in the north west position of the visualization with two columns.
image::images/timelion-customize04.png[]
{nbsp}
[float]
[[mathematical-functions-intro]]
== Create visualizations with mathematical functions
To create a visualization for inbound and outbound network traffic, use mathematical functions.
[float]
[[mathematical-functions-define-functions]]
=== Define the functions
To start tracking the inbound and outbound network traffic, enter the following in the *Timelion Expression* field:
<1> `.multiply()` multiplies the data series by a number, the result of a data series, or a list of data series. For this example, `.multiply(-1)` converts the outbound network traffic to a negative value since the outbound network traffic is leaving your machine.
image::images/timelion-math03.png[]
{nbsp}
[float]
[[mathematical-functions-convert-data]]
=== Change the data metric
To make the visualization easier to analyze, change the data metric from bytes to megabytes:
<1> `.label()` adds custom labels to the visualization.
<2> `.title()` adds a title with a meaningful name.
<3> `.lines()` changes the appearance of the chart lines. In this example, `.lines(fill=2, width=1)` sets the fill level to `2`, and the border width to `1`.
<4> `.color()` changes the color of the data. Supported color types include standard color names, hexadecimal values, or a color schema for grouped data. In this example, `.color(green)` represents the inbound network traffic, and `.color(blue)` represents the outbound network traffic.
<5> `.legend()` sets the position and style of the legend. For this example, `legend(columns=2, position=nw)` places the legend in the north west position of the visualization with two columns.
image::images/timelion-math05.png[]
{nbsp}
[float]
[[timelion-conditional-intro]]
== Create visualizations with conditional logic and tracking trends
To easily detect outliers and discover patterns over time, modify time series data with conditional logic and create a trend with a moving average.
With Timelion conditional logic, you can use the following operator values to compare your data:
[horizontal]
`eq`:: equal
`ne`:: not equal
`lt`:: less than
`lte`:: less than or equal to
`gt`:: greater than
`gte`:: greater than or equal to
[float]
[[conditional-define-functions]]
=== Define the functions
To chart the maximum value of `system.memory.actual.used.bytes`, enter the following in the *Timelion Expression* field:
<1> Timelion conditional logic for the _greater than_ operator. In this example, the warning threshold is 11.3GB (`11300000000`), and the severe threshold is 11.375GB (`11375000000`). If the threshold values are too high or low for your machine, adjust the values accordingly.
<2> `if()` compares each point to a number. If the condition evaluates to `true`, adjust the styling. If the condition evaluates to `false`, use the default styling.
<1> `mvavg()` calculates the moving average over a specified period of time. In this example, `.mvavg(10)` creates a moving average with a window of 10 data points.
image::images/timelion-conditional03.png[]
{nbsp}
[float]
[[conditional-format-visualization]]
=== Customize and format the visualization
Customize and format the visualization using functions:
<1> `.label()` adds custom labels to the visualization.
<2> `.title()` adds a title with a meaningful name.
<3> `.color()` changes the color of the data. Supported color types include standard color names, hexadecimal values, or a color schema for grouped data.
<4> `.lines()` changes the appearance of the chart lines. In this example, .lines(width=5) sets border width to `5`.
<5> `.legend()` sets the position and style of the legend. For this example, `(columns=4, position=nw)` places the legend in the north west position of the visualization with four columns.
image::images/timelion-conditional04.png[]
{nbsp}
For additional information on Timelion conditional capabilities, go to https://www.elastic.co/blog/timeseries-if-then-else-with-timelion[I have but one .condition()].