Commit 4294009b by Patrick O'Carroll

changed some img-links, updated text for annotated img, more work on whats new in v5.0

parent 45cd3730
...@@ -20,7 +20,7 @@ to add and configure a `notification` channel (can be email, PagerDuty or other ...@@ -20,7 +20,7 @@ to add and configure a `notification` channel (can be email, PagerDuty or other
## Notification Channel Setup ## Notification Channel Setup
{{< imgbox max-width="30%" img="/img/docs/v5/alerts-notifications-menu.png" caption="Alerting Notification Channels" >}} {{< imgbox max-width="30%" img="/img/docs/v5/alerts_notifications_menu.png" caption="Alerting Notification Channels" >}}
On the Notification Channels page hit the `New Channel` button to go the page where you On the Notification Channels page hit the `New Channel` button to go the page where you
can configure and setup a new Notification Channel. can configure and setup a new Notification Channel.
......
...@@ -26,7 +26,7 @@ Read the [Basic Concepts](/guides/basic_concepts) document to get a crash course ...@@ -26,7 +26,7 @@ Read the [Basic Concepts](/guides/basic_concepts) document to get a crash course
Let's start with creating a new Dashboard. You can find the new Dashboard link on the right side of the Dashboard picker. You now have a blank Dashboard. Let's start with creating a new Dashboard. You can find the new Dashboard link on the right side of the Dashboard picker. You now have a blank Dashboard.
<img class="no-shadow" src="/img/docs/v5/top-nav-annotated.png" width="580px"> <img class="no-shadow" src="/img/docs/v50/top_nav_annotated.png" width="580px">
The image above shows you the top header for a Dashboard. The image above shows you the top header for a Dashboard.
...@@ -42,7 +42,7 @@ The image above shows you the top header for a Dashboard. ...@@ -42,7 +42,7 @@ The image above shows you the top header for a Dashboard.
Dashboards are at the core of what Grafana is all about. Dashboards are composed of individual Panels arranged on a grid. Grafana ships with a variety of Panels. Grafana makes it easy to construct the right queries, and customize the display properties so that you can create the perfect Dashboard for your need. Each Panel can interact with data from any configured Grafana Data Source (currently InfluxDB, Graphite, OpenTSDB, Prometheus and Cloudwatch). The [Basic Concepts](/guides/basic_concepts) guide explores these key ideas in detail. Dashboards are at the core of what Grafana is all about. Dashboards are composed of individual Panels arranged on a grid. Grafana ships with a variety of Panels. Grafana makes it easy to construct the right queries, and customize the display properties so that you can create the perfect Dashboard for your need. Each Panel can interact with data from any configured Grafana Data Source (currently InfluxDB, Graphite, OpenTSDB, Prometheus and Cloudwatch). The [Basic Concepts](/guides/basic_concepts) guide explores these key ideas in detail.
<img src="/img/docs/v5/dashboard-annotated.png" class="no-shadow"> <img src="/img/docs/v50/dashboard_annotated.png" class="no-shadow">
1. Zoom out time range 1. Zoom out time range
2. Time picker dropdown. Here you can access relative time range options, auto refresh options and set custom absolute time ranges. 2. Time picker dropdown. Here you can access relative time range options, auto refresh options and set custom absolute time ranges.
......
...@@ -12,19 +12,25 @@ weight = -6 ...@@ -12,19 +12,25 @@ weight = -6
# What's New in Grafana v5.0 # What's New in Grafana v5.0
Grafana v5.0 is here and with it comes the new feature: Dashboard folders. Grafana has never looked this good. Grafana v5.0 is here and with it comes a new dashboard engine and the new feature: Dashboard folders. Grafana has never looked this good.
## New dashboard engine
The new grid system for the dashboards are more flexible than ever and are no longer dependent on rows. The panels can be organized in any way you want simply by dragging and dropping and stretching and contracting.
The rows are still there but have taken on a new role.
## UX improvements ## UX improvements
Grafana v5.0 brings big changes to UX/UI. Grafana v5.0 brings big changes to UX/UI.
The grid system for the dashboards are more flexible than ever.
Rows takes on a new role.
There is now a dashboard settings page. There is now a dashboard settings page.
## Dashboard folders
The big new feature that comes with Grafana v5.0 is Dashboard folders. Now you can organize your dashbords into folders which is very useful if you have a lot of dashboards or multiple teams using the same Grafana instance.
## Dashboard folders Each folder has its own page where you can set permisions for the folder or single dashboards within the folder. Here you can also delete and move dashboards.
The big new feature that comes with Grafana v5.0 is Dashboard folders. Now you can organize your dashbords into folders. ## Teams
## Teams Teams are a new concept for Grafana. Teams are simply a group of users that can be given persmisions for folders or dashboards. Only an admin can create teams.
\ No newline at end of file \ No newline at end of file
...@@ -54,7 +54,8 @@ Annotation events are fetched via annotation queries. To add a new annotation qu ...@@ -54,7 +54,8 @@ Annotation events are fetched via annotation queries. To add a new annotation qu
open the dashboard settings menu, then select `Annotations`. This will open the dashboard annotations open the dashboard settings menu, then select `Annotations`. This will open the dashboard annotations
settings view. To create a new annotation query hit the `New` button. settings view. To create a new annotation query hit the `New` button.
![](/img/docs/annotations/new_query.png) <!--![](/img/docs/v50/annotation_new_query.png)-->
{{< docs-imagebox img="/img/docs/v50/annotation_new_query.png" max-width="600px" >}}
Specify a name for the annotation query. This name is given to the toggle (checkbox) that will allow Specify a name for the annotation query. This name is given to the toggle (checkbox) that will allow
you to enable/disable showing annotation events from this query. For example you might have two you to enable/disable showing annotation events from this query. For example you might have two
......
...@@ -16,7 +16,7 @@ Since Grafana automatically scales Dashboards to any resolution they're perfect ...@@ -16,7 +16,7 @@ Since Grafana automatically scales Dashboards to any resolution they're perfect
## Creating a Playlist ## Creating a Playlist
{{< docs-imagebox img="/img/docs/v3/playlist.png" max-width="25rem" class="docs-image--right">}} {{< docs-imagebox img="/img/docs/v50/playlist.png" max-width="25rem" class="docs-image--right">}}
The Playlist feature can be accessed from Grafana's sidemenu, in the Dashboard submenu. The Playlist feature can be accessed from Grafana's sidemenu, in the Dashboard submenu.
......
...@@ -12,12 +12,14 @@ weight = 5 ...@@ -12,12 +12,14 @@ weight = 5
Dashboards can be searched by the dashboard name, filtered by one (or many) tags or filtered by starred status. The dashboard search is accessed through the dashboard picker, available in the dashboard top nav area. Dashboards can be searched by the dashboard name, filtered by one (or many) tags or filtered by starred status. The dashboard search is accessed through the dashboard picker, available in the dashboard top nav area.
<img class="no-shadow" src="/img/docs/v2/dashboard_search.png"> <img class="no-shadow" src="/img/docs/v50/dashboard_search_annotated.png">
1. `Dashboard Picker`: The Dashboard Picker is your primary navigation tool to move between dashboards. It is present on all dashboards, and open the Dashboard Search. The dashboard picker also doubles as the title of the current dashboard. 1. `Search Bar`: The search bar allows you to enter any string and search both database and file based dashboards in real-time.
2. `Search Bar`: The search bar allows you to enter any string and search both database and file based dashboards in real-time. 2. `Starred`: Here you find all your starred dashboards.
3. `Starred`: The starred link allows you to filter the list to display only starred dashboards. 3. `Recent`: Here you find the latest created dashboards.
4. `Tags`: The tags filter allows you to filter the list by dashboard tags. 4. `Folders`: The tags filter allows you to filter the list by dashboard tags.
5. `Root`: The root contains all dashboards that are not placed in a folder.
6. `Tags`: The tags filter allows you to filter the list by dashboard tags.
When using only a keyboard, you can use your keyboard arrow keys to navigate the results, hit enter to open the selected dashboard. When using only a keyboard, you can use your keyboard arrow keys to navigate the results, hit enter to open the selected dashboard.
......
+++ +++
title = "Templating" title = "Variables"
keywords = ["grafana", "templating", "documentation", "guide"] keywords = ["grafana", "templating", "documentation", "guide"]
type = "docs" type = "docs"
[menu.docs] [menu.docs]
name = "Templating" name = "Variables"
parent = "dashboard_features" parent = "dashboard_features"
weight = 1 weight = 1
+++ +++
# Templating # Variables
Templating allows for more interactive and dynamic dashboards. Instead of hard-coding things like server, application Variables allows for more interactive and dynamic dashboards. Instead of hard-coding things like server, application
and sensor name in you metric queries you can use variables in their place. Variables are shown as dropdown select boxes at the top of and sensor name in you metric queries you can use variables in their place. Variables are shown as dropdown select boxes at the top of
the dashboard. These dropdowns make it easy to change the data being displayed in your dashboard. the dashboard. These dropdowns make it easy to change the data being displayed in your dashboard.
<img class="no-shadow" src="/img/docs/v4/templated_dash.png"> <!--<img class="no-shadow" src="/img/docs/v50/variables_dashboard.png">-->
{{< docs-imagebox img="/img/docs/v50/variables_dashboard.png" >}}
## What is a variable? ## What is a variable?
...@@ -43,7 +44,8 @@ is the set of values you can choose from. ...@@ -43,7 +44,8 @@ is the set of values you can choose from.
## Adding a variable ## Adding a variable
<img class="no-shadow" src="/img/docs/v4/templating_var_list.png"> <!--<img class="no-shadow" src="/img/docs/v50/variables_var_list.png">-->
{{< docs-imagebox img="/img/docs/v50/variables_var_list.png" max-width="800px" >}}
You add variables via Dashboard cogs menu > Templating. This opens up a list of variables and a `New` button to create a new variable. You add variables via Dashboard cogs menu > Templating. This opens up a list of variables and a `New` button to create a new variable.
...@@ -133,7 +135,8 @@ Option | Description ...@@ -133,7 +135,8 @@ Option | Description
*Tags query* | Data source query that should return a list of tags *Tags query* | Data source query that should return a list of tags
*Tag values query* | Data source query that should return a list of values for a specified tag key. Use `$tag` in the query to refer the currently selected tag. *Tag values query* | Data source query that should return a list of values for a specified tag key. Use `$tag` in the query to refer the currently selected tag.
![](/img/docs/v4/variable_dropdown_tags.png) <!--![](/img/docs/v50/variable_dropdown_tags.png)-->
{{< docs-imagebox img="/img/docs/v50/variable_dropdown_tags.png" max-width="300px" >}}
### Interval variables ### Interval variables
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment