mirror of https://github.com/grafana/grafana
Docs: Organize basic concepts and getting started (#21859)
* Update shortcuts.md Removed content that was out-of-date and redundant with the UI. * Added panels.md * Added dashboards.md * Added data-sources.md * Update data-sources.md * Sorted basic concepts into other topics * Update docs/sources/menu.yaml Co-Authored-By: Marcus Olsson <accounts+github@marcus.se.net> * Update panels.md * Update data-sources.md Co-authored-by: Marcus Olsson <accounts+github@marcus.se.net>pull/22192/head
parent
2c9b321c48
commit
961cb6b284
@ -0,0 +1,64 @@ |
||||
+++ |
||||
title = "Dashboard overview" |
||||
type = "docs" |
||||
[menu.docs] |
||||
identifier = "dashboards" |
||||
parent = "features" |
||||
weight = 1 |
||||
+++ |
||||
|
||||
# Dashboard overview |
||||
|
||||
A *dashboard* is a set of one or more panels organized and arranged into one or more rows. 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 Graphite, Prometheus, Elasticsearch, InfluxDB, OpenTSDB, MySQL, PostgreSQL, Microsoft SQL Server and AWS Cloudwatch). |
||||
|
||||
## Dashboard UI |
||||
|
||||
<img src="/img/docs/v50/dashboard_annotated.png" class="no-shadow" width="700px"> |
||||
|
||||
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. |
||||
3. Manual refresh button. Will cause all panels to refresh (fetch new data). |
||||
4. Dashboard panel. You edit panels by clicking the panel title. |
||||
5. Graph legend. You can change series colors, y-axis and series visibility directly from the legend. |
||||
|
||||
## Dashboard header |
||||
|
||||
Click 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/v50/top_nav_annotated.png" width="580px"> |
||||
|
||||
The image above shows you the top header for a Dashboard. |
||||
|
||||
1. Side menubar toggle: This toggles the side menu, allowing you to focus on the data presented in the dashboard. The side menu provides access to features unrelated to a Dashboard such as Users, Organizations, and Data Sources. |
||||
2. Dashboard dropdown: This dropdown shows you which Dashboard you are currently viewing, and allows you to easily switch to a new Dashboard. From here you can also create a new Dashboard or folder, Import existing Dashboards, and manage Dashboard playlists. |
||||
3. Add Panel: Adds a new panel to the current Dashboard |
||||
4. Star Dashboard: Star (or unstar) the current Dashboard. Starred Dashboards will show up on your own Home Dashboard by default, and are a convenient way to mark Dashboards that you're interested in. |
||||
5. Share Dashboard: Share the current dashboard by creating a link or create a static Snapshot of it. Make sure the Dashboard is saved before sharing. |
||||
6. Save dashboard: The current Dashboard will be saved with the current Dashboard name. |
||||
7. Settings: Manage Dashboard settings and features such as Templating and Annotations. |
||||
|
||||
## Manage dashboards |
||||
|
||||
The time period for the dashboard can be controlled by the [Time range controls]({{< relref "../reference/timerange.md" >}}) in the upper right of the dashboard. |
||||
|
||||
Dashboards can use [templating]({{< relref "../reference/templating.md" >}}) to make them more dynamic and interactive. |
||||
|
||||
Dashboards can use [annotations]({{< relref "../reference/annotations.md" >}}) to display event data across panels. This can help correlate the time series data in the panel with other events. |
||||
|
||||
Dashboards can be [shared]({{< relref "../reference/share_dashboard.md" >}}) easily in a variety of ways. |
||||
|
||||
Dashboards can be tagged, and the dashboard picker provides quick, searchable access to all dashboards in a particular organization. |
||||
|
||||
## Rows |
||||
|
||||
A *row* is a logical divider within a dashboard. It is used to group panels together. |
||||
|
||||
Rows are always 12 “units” wide. These units are automatically scaled dependent on the horizontal resolution of your browser. You can control the relative width of panels within a row by setting their specific width. |
||||
|
||||
We use a unit abstraction so that Grafana looks great on all screens sizes. |
||||
|
||||
> Note: With MaxDataPoint functionality, Grafana can show you the perfect number of data points, regardless of resolution or time range. |
||||
|
||||
Collapse a row by clicking on the row title. If you save a dashboard with a row collapsed, then it saves in that state and does not load those graphs until you expand the row. |
||||
|
||||
Use the [repeating rows]({{< relref "../reference/templating.md#repeating-rows" >}}) functionality to dynamically create or remove entire rows, which can be filled with panels, based on the template variables selected. |
||||
@ -0,0 +1,22 @@ |
||||
+++ |
||||
title = "Data sources overview" |
||||
description = "Overview of data sources in Grafana" |
||||
keywords = ["grafana", "data sources"] |
||||
type = "docs" |
||||
[menu.docs] |
||||
name = "Data sources overview" |
||||
parent = "datasources" |
||||
weight = 1 |
||||
+++ |
||||
|
||||
# Data sources |
||||
|
||||
Grafana can visualize, explore, and alert on data from many different databases and cloud services. Each database or service type is accessed from a *data source*. |
||||
|
||||
Each data source has a specific query editor that is customized for the features and capabilities that the particular data source exposes. The query language and capabilities of each data source are obviously very different. You can combine data from multiple data sources into a single dashboard, but each panel is connected to a specific data source that belongs to a particular organization. |
||||
|
||||
Use the query editor to build one or more queries in your time series database. The panel instantly updates, allowing you to effectively explore your data in real time and build a perfect query for that particular panel. |
||||
|
||||
You can use [template variables]({{< relref "../../reference/templating.md" >}}) in the query editor within the queries themselves. This provides a powerful way to explore data dynamically based on the templating variables selected on the dashboard. |
||||
|
||||
Grafana allows you to reference queries in the query editor by the row that they’re on. If you add a second query to graph, you can reference the first query by typing in #A. This provides an easy and convenient way to build compound queries. |
||||
@ -0,0 +1,46 @@ |
||||
+++ |
||||
title = "Panel overview" |
||||
keywords = ["grafana", "panel", "documentation", "guide"] |
||||
type = "docs" |
||||
[menu.docs] |
||||
name = "Panels" |
||||
parent = "panels" |
||||
weight = 1 |
||||
+++ |
||||
|
||||
# Panel overview |
||||
|
||||
The *panel* is the basic visualization building block in Grafana. Each panel has a Query Editor specific to the data source selected in the panel. The query editor allows you to extract the perfect visualization to display on the panel. |
||||
|
||||
There are a wide variety of styling and formatting options for each panel. Panels can be dragged and dropped and rearranged on the Dashboard. They can also be resized. |
||||
|
||||
Panels like the [Graph]({{< relref "graph.md" >}}) panel allow you to graph as many metrics and series as you want. Other panels like [Singlestat]({{< relref "singlestat.md" >}}) require a reduction of a single query into a single number. |
||||
|
||||
Panels can be made more dynamic with [Dashboard Templating]({{< relref "../../reference/templating.md" >}}) variable strings within the panel configuration. The template can include queries to your data source configured in the Query Editor. |
||||
|
||||
Panels can be [shared]({{< relref "../../reference/share_panel.md" >}}) easily in a variety of ways. |
||||
|
||||
## Adding and editing graphs and panels |
||||
|
||||
 |
||||
|
||||
1. You add panels by clicking the Add panel icon on the top menu. |
||||
1. To edit the graph you click on the graph title to open the panel menu, then `Edit`. |
||||
1. This should take you to the `Metrics` tab. In this tab you should see the editor for your default data source. |
||||
|
||||
When you click the `Metrics` tab, you are presented with a Query Editor that is specific to the Panel Data Source. Use the Query Editor to build your queries and Grafana will visualize them in real time. |
||||
|
||||
## Move panels |
||||
|
||||
You can drag and drop panels by clicking and holding the panel title, then dragging it to its new location. You can also easily resize panels by clicking the (-) and (+) icons. |
||||
|
||||
 |
||||
|
||||
## Tips and shortcuts |
||||
|
||||
* Click the graph title and in the dropdown menu quickly change span or duplicate the panel. |
||||
* Click the Save icon in the menu to save the dashboard with a new name. |
||||
* Click the Save icon in the menu and then advanced to export the dashboard to json file, or set it as your default dashboard. |
||||
* Click the colored icon in the legend to select series color. |
||||
* Click series name in the legend to hide series. |
||||
* Ctrl/Shift/Meta + click legend name to hide other series. |
||||
@ -1,95 +0,0 @@ |
||||
+++ |
||||
title = "Basic Concepts" |
||||
description = "Grafana intro and concept guide" |
||||
keywords = ["grafana", "intro", "guide", "concepts"] |
||||
type = "docs" |
||||
[menu.docs] |
||||
name = "Basic concepts" |
||||
identifier = "basic_concepts" |
||||
parent = "guides" |
||||
weight = 2 |
||||
+++ |
||||
|
||||
# Basic concepts |
||||
|
||||
This document is an introduction to basic concepts in Grafana. Use it as a starting point to get familiar with core Grafana features. |
||||
|
||||
## Dashboard |
||||
|
||||
The *dashboard* is where it all comes together. A dashboard is a set of one or more panels organized and arranged into one or more rows. |
||||
|
||||
The time period for the dashboard can be controlled by the [Time range controls]({{< relref "../reference/timerange.md" >}}) in the upper right of the dashboard. |
||||
|
||||
Dashboards can use [templating]({{< relref "../reference/templating.md" >}}) to make them more dynamic and interactive. |
||||
|
||||
Dashboards can use [annotations]({{< relref "../reference/annotations.md" >}}) to display event data across panels. This can help correlate the time series data in the panel with other events. |
||||
|
||||
Dashboards can be [shared]({{< relref "../reference/share_dashboard.md" >}}) easily in a variety of ways. |
||||
|
||||
Dashboards can be tagged, and the dashboard picker provides quick, searchable access to all dashboards in a particular organization. |
||||
|
||||
## Data source |
||||
|
||||
Grafana can visualize, explore, and alert on data from many different databases and cloud services. Each database or service type is accessed from a *data source*. |
||||
|
||||
Each data source has a specific query editor that is customized for the features and capabilities that the particular data source exposes. The query language and capabilities of each data source are obviously very different. You can combine data from multiple data sources into a single dashboard, but each panel is connected to a specific data source that belongs to a particular organization. |
||||
|
||||
Refer to the [Data sources section]({{< relref "../features/datasources" >}}) for a list of data sources that Grafana officially supports. |
||||
|
||||
## Organization |
||||
|
||||
Grafana supports multiple *organizations* in order to support a wide variety of deployment models, including using a single Grafana instance to provide service to multiple potentially untrusted organizations. |
||||
|
||||
In most cases, Grafana is deployed with a single organization. |
||||
|
||||
Each organization can have one or more data sources. |
||||
|
||||
All dashboards are owned by a particular organization. |
||||
|
||||
> Note: Most metric databases do not provide per-user series authentication. This means that organization data sources and dashboards are available to all users in a particular organization. |
||||
|
||||
Refer to [Organization roles]({{< relref "../permissions/organization_roles.md" >}}) for more information. |
||||
|
||||
## Panel |
||||
|
||||
The *panel* is the basic visualization building block in Grafana. Each panel has a Query Editor specific to the data source selected in the panel. The query editor allows you to extract the perfect visualization to display on the panel. |
||||
|
||||
There are a wide variety of styling and formatting options for each panel. Panels can be dragged and dropped and rearranged on the Dashboard. They can also be resized. |
||||
|
||||
Panels like the [Graph]({{< relref "../features/panels/graph.md" >}}) panel allow you to graph as many metrics and series as you want. Other panels like [Singlestat]({{< relref "../features/panels/singlestat.md" >}}) require a reduction of a single query into a single number. |
||||
|
||||
Panels can be made more dynamic with [Dashboard Templating]({{< relref "../reference/templating.md" >}}) variable strings within the panel configuration. The template can include queries to your data source configured in the Query Editor. |
||||
|
||||
Panels can be [shared]({{< relref "../reference/share_panel.md" >}}) easily in a variety of ways. |
||||
|
||||
## Query editor |
||||
|
||||
The *query editor* exposes capabilities of your data source and allows you to query the metrics that it contains. |
||||
|
||||
Use the query editor to build one or more queries in your time series database. The panel instantly updates, allowing you to effectively explore your data in real time and build a perfect query for that particular panel. |
||||
|
||||
You can use [template variables]({{< relref "../reference/templating.md" >}}) in the query editor within the queries themselves. This provides a powerful way to explore data dynamically based on the templating variables selected on the dashboard. |
||||
|
||||
Grafana allows you to reference queries in the query editor by the row that they’re on. If you add a second query to graph, you can reference the first query by typing in #A. This provides an easy and convenient way to build compound queries. |
||||
|
||||
## Row |
||||
|
||||
A *row* is a logical divider within a dashboard. It is used to group panels together. |
||||
|
||||
Rows are always 12 “units” wide. These units are automatically scaled dependent on the horizontal resolution of your browser. You can control the relative width of panels within a row by setting their specific width. |
||||
|
||||
We use a unit abstraction so that Grafana looks great on all screens sizes. |
||||
|
||||
> Note: With MaxDataPoint functionality, Grafana can show you the perfect number of data points, regardless of resolution or time range. |
||||
|
||||
Collapse a row by clicking on the row title. If you save a dashboard with a row collapsed, then it saves in that state and does not load those graphs until you expand the row. |
||||
|
||||
Use the [repeating rows]({{< relref "../reference/templating.md#repeating-rows" >}}) functionality to dynamically create or remove entire rows, which can be filled with panels, based on the template variables selected. |
||||
|
||||
## User |
||||
|
||||
A *user* is a named account in Grafana. A user can belong to one or more organizations and can be assigned different levels of privileges through roles. |
||||
|
||||
Grafana supports a wide variety of internal and external ways for users to authenticate themselves. These include from its own integrated database, from an external SQL server, or from an external LDAP server. |
||||
|
||||
Refer to the [Permissions overview](docs\sources\permissions\overview.md) for information about roles and permissions. |
||||
Loading…
Reference in new issue