kibana/docs/getting-started/tutorial-visualizing.asciidoc

[[tutorial-visualizing]]
=== Visualize your data

In the Visualize application, you can shape your data using a variety
of charts, tables, and maps, and more. In this tutorial, you'll create four
visualizations: 

* <<tutorial-visualize-pie, Pie chart>>
* <<tutorial-visualize-bar, Bar chart>>
* <<tutorial-visualize-map, Coordinate map>>
* <<tutorial-visualize-markdown, Markdown widget>>

[float]
[[tutorial-visualize-pie]]
=== Pie chart

You'll use the pie chart to
gain insight into the account balances in the bank account data.

. Open *Visualize* to show the overview page.
. Click *Create new visualization*. You'll see all the visualization
types in Kibana.
+
[role="screenshot"]
image::images/tutorial-visualize-wizard-step-1.png[]
. Click *Pie*.

. In *Choose a source*, select the `ba*` index pattern. 
+
Initially, the pie contains a single "slice."
That's because the default search matched all documents.
+
To specify which slices to display in the pie, you use an Elasticsearch
{ref}/search-aggregations.html[bucket aggregation]. This aggregation
sorts the documents that match your search criteria into different
categories. You'll use a bucket aggregation to establish
multiple ranges of account balances and find out how many accounts fall into
each range.

. In the *Buckets* pane, click *Add > Split slices.*
+
.. In the *Aggregation* dropdown, select *Range*.
.. In the *Field* dropdown, select *balance*.
.. Click *Add range* four times to bring the total number of ranges to six.
.. Define the following ranges:
+
[source,text]
0             999
1000         2999
3000         6999
7000        14999
15000       30999
31000       50000

. Click *Apply changes* image:images/apply-changes-button.png[].
+
Now you can see what proportion of the 1000 accounts fall into each balance
range.
+
[role="screenshot"]
image::images/tutorial-visualize-pie-2.png[]

. Add another bucket aggregation that looks at the ages of the account
holders.

.. At the bottom of the *Buckets* pane, click *Add*.
.. For *sub-bucket type,* select *Split slices*.
.. In the *Sub aggregation* dropdown, select *Terms*.
.. In the *Field* dropdown, select *age*.

. Click  *Apply changes* image:images/apply-changes-button.png[].
+
Now you can see the break down of the ages of the account holders, displayed
in a ring around the balance ranges.
+
[role="screenshot"]
image::images/tutorial-visualize-pie-3.png[]

. To save this chart so you can use it later, click *Save* in 
the top menu bar and enter `Pie Example`.

[float]
[[tutorial-visualize-bar]]
=== Bar chart

You'll use a bar chart to look at the Shakespeare data set and compare
the number of speaking parts in the plays.

. Create a *Vertical Bar* chart and set the search source to `shakes*`.
+
Initially, the chart is a single bar that shows the total count
of documents that match the default wildcard query.

. Show the number of speaking parts per play along the Y-axis.

.. In the *Metrics* pane, expand *Y-axis*.
.. Set *Aggregation* to *Unique Count*.
.. Set *Field* to *speaker*.
.. In the *Custom label* box, enter `Speaking Parts`.

. Click  *Apply changes* image:images/apply-changes-button.png[].

. Show the plays along the X-axis.

.. In the *Buckets* pane, click *Add > X-axis*.
.. Set *Aggregation* to *Terms*.
.. Set *Field* to *play_name*.
.. To list plays alphabetically, in the *Order* dropdown, select *Ascending*.
.. Give the axis a custom label, `Play Name`.

. Click  *Apply changes* image:images/apply-changes-button.png[].
+
[role="screenshot"]
image::images/tutorial-visualize-bar-1.5.png[]
. *Save* this chart with the name `Bar Example`.
+
Hovering over a bar shows a tooltip with the number of speaking parts for
that play.
+
Notice how the individual play names show up as whole phrases, instead of
broken into individual words. This is the result of the mapping
you did at the beginning of the tutorial, when you marked the `play_name` field
as `not analyzed`.

[float]
[[tutorial-visualize-map]]
=== Coordinate map

Using a coordinate map, you can visualize geographic information in the log file sample data.

. Create a *Coordinate map* and set the search source to `logstash*`.
+
You haven't defined any buckets yet, so the visualization is a map of the world.

. Set the time.
.. In the time filter, click *Show dates*.
.. Click the start date, then *Absolute*.
.. Set the *Start date* to May 18, 2015.
.. In the time filter, click *now*, then *Absolute*.
.. Set the *End date* to May 20, 2015.

. Map the geo coordinates from the log files.

.. In the *Buckets* pane, click *Add > Geo coordinates*.
.. Set *Aggregation* to *Geohash*.
.. Set *Field* to *geo.coordinates*.

. Click *Apply changes* image:images/apply-changes-button.png[].
+
The map now looks like this:
+
[role="screenshot"]
image::images/tutorial-visualize-map-2.png[]

. Navigate the map by clicking and dragging.  Use the controls
on the left to zoom the map and set filters.
. *Save* this map with the name `Map Example`.

[float]
[[tutorial-visualize-markdown]]
=== Markdown

The final visualization is a Markdown widget that renders formatted text.

. Create a *Markdown* visualization.
. Copy the following text into the text box.
+
[source,markdown]
# This is a tutorial dashboard!
The Markdown widget uses **markdown** syntax.
> Blockquotes in Markdown use the > character.

. Click *Apply changes* image:images/apply-changes-button.png[].
+
The Markdown renders in the preview pane.
+
[role="screenshot"]
image::images/tutorial-visualize-md-2.png[]

. *Save* this visualization with the name `Markdown Example`.