IntenseWebs/grafana
3
0
Fork 0
mirror of https://github.com/grafana/grafana.git synced 2025-02-25 18:55:37 -06:00
Code Issues Packages Projects Releases Wiki Activity

docs: add datasource selector content (#69280)

Browse Source 
* updated create dashboard topic including adding screenshot of DS selector

* finished editing build dashboards - create dashboards

* finished data source selection edits'
:

* updated tutorials

* reverted tutorial to old nav to match reality and added that prom DS is preselected

* wording edits

* Apply suggestions from code review

Co-authored-by: Christopher Moyer <35463610+chri2547@users.noreply.github.com>

* add that configure DS is only for admins

---------

Co-authored-by: Christopher Moyer <35463610+chri2547@users.noreply.github.com>
This commit is contained in:
Isabel 2023-06-05 14:45:36 -04:00 committed by GitHub
parent 9d2f4786c7
commit 865636993f
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
6 changed files with 43 additions and 27 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
docs/sources/dashboards/build-dashboards/create-dashboard/index.md
View File

@ -29,11 +29,21 @@ Dashboards and panels allow you to show your data in visual form. Each panel nee
![Empty dashboard state](/media/docs/grafana/dashboards/empty-dashboard-9.5.png)
1. In the first line of the **Query** tab, click the dropdown list and select a data source.
1. Write or construct a query in the query language of your data source.
1. In the modal that opens, do one of the following:
- Select one of your existing data sources.
- Select one of the Grafana's [built-in special data sources]({{< relref "../../../datasources/#special-data-sources" >}}).
- Click **Configure a new data source** to set up a new one (Admins only).
{{< figure class="float-right" src="/media/docs/grafana/dashboards/screenshot-data-source-selector-10.0.png" max-width="800px" alt="Select data source modal" >}}
The **Edit panel** view opens with your data source selected.
You can change the panel data source later using the dropdown in the **Query** tab of the panel editor if needed.
For more information about data sources, refer to [Data sources]({{< relref "../../../datasources/" >}}) for specific guidelines.
1. Write or construct a query in the query language of your data source.
1. Click the Refresh dashboard icon to query the data source.
![Refresh dashboard icon](/media/docs/grafana/dashboards/screenshot-refresh-dashboard-9.5.png)
@ -64,7 +74,9 @@ Dashboards and panels allow you to show your data in visual form. Each panel nee
1. Click **Save**.
1. To add more panels to the dashboard, click **Add** in the dashboard header and select **Visualization** in the dropdown.
![Add dropdown](/media/docs/grafana/dashboards/screenshot-add-dropdown-9.5.png)
![Add dropdown](/media/docs/grafana/dashboards/screenshot-add-dropdown-10.0.png)
When you add additional panels to the dashboard, you're taken straight to the **Edit panel** view.
## Configure repeating rows

9
docs/sources/getting-started/build-first-dashboard.md
View File

@ -43,7 +43,7 @@ We strongly recommend that you change the default administrator password.
If you've already set up a data source that you know how to query, refer to [Create a dashboard]({{< relref "../dashboards/build-dashboards/create-dashboard" >}}) instead.
To create your first dashboard using the built-in `Grafana` data source:
To create your first dashboard using the built-in `-- Grafana --` data source:
1. Click **Dashboards** in the left-side menu.
1. On the Dashboards page, click **New** and select **New Dashboard** from the dropdown menu.
@ -51,10 +51,11 @@ To create your first dashboard using the built-in `Grafana` data source:
![Empty dashboard state](/media/docs/grafana/dashboards/empty-dashboard-9.5.png)
1. In the New dashboard/Edit panel view, go to the **Query** tab.
1. Configure your [query]({{< relref "../panels-visualizations/query-transform-data#add-a-query" >}}) by selecting `-- Grafana --` from the data source selector.
1. In the modal that opens, click `-- Grafana --`:
This generates the Random Walk dashboard.
{{< figure class="float-right" src="/media/docs/grafana/dashboards/screenshot-data-source-selector-10.0.png" max-width="800px" alt="Select data source modal" >}}
This configures your [query]({{< relref "../panels-visualizations/query-transform-data#add-a-query" >}}) and generates the Random Walk dashboard.
1. Click the Refresh dashboard icon to query the data source.

4
docs/sources/panels-visualizations/panel-editor-overview/index.md
View File

@ -30,7 +30,7 @@ In the panel editor, you can update all the elements of a visualization includin
To add a panel in a new dashboard click **+ Add visualization** in the middle of the dashboard. To add a panel to an existing dashboard, click **Add** in the dashboard header and select **Visualization** in the dropdown:
![Add dropdown](/media/docs/grafana/dashboards/screenshot-add-dropdown-9.5.png)
![Add dropdown](/media/docs/grafana/dashboards/screenshot-add-dropdown-10.0.png)
## Panel editor
@ -51,7 +51,7 @@ This section describes the areas of the Grafana panel editor.
1. Data section: The data section contains tabs where you enter queries, transform your data, and create alert rules (if applicable).
- **Query tab:** Select your data source and enter queries here. For more information, refer to [Add a query]({{< relref "../query-transform-data/#add-a-query" >}}).
- **Query tab:** Select your data source and enter queries here. For more information, refer to [Add a query]({{< relref "../query-transform-data/#add-a-query" >}}). When you create a new dashboard, you'll be prompted to select a data source before you get to the panel editor. You set or update the data source in existing dashboards using the dropdown in the **Query** tab.
- **Transform tab:** Apply data transformations. For more information, refer to [Transform data]({{< relref "../query-transform-data/transform-data/" >}}).
- **Alert tab:** Write alert rules. For more information, refer to [Overview of Grafana 8 alerting]({{< relref "../../alerting/" >}}).

3
docs/sources/panels-visualizations/query-transform-data/_index.md
View File

@ -101,6 +101,9 @@ When you create a panel, Grafana automatically selects the default data source.
1. Edit the panel to which you're adding a query.
1. Click the **Query** tab.
1. Click the **Data source** drop-down menu and select a data source.
If you're creating a new dashboard, you'll be prompted to select a data source when you add the first panel.
1. Click **Query options** to configure the maximum number of data points you need.
For more information about query options, refer to [Query options]({{< relref "#query-options" >}}).
1. Write the query using the query editor.

17
docs/sources/tutorials/grafana-fundamentals/index.md
View File

@ -117,7 +117,7 @@ The sample application exposes metrics which are stored in [Prometheus](https://
To be able to visualize the metrics from Prometheus, you first need to add it as a data source in Grafana.
1. In the sidebar, hover your cursor over the **Configuration** (gear) icon, and then click **Data sources**.
1. In the sidebar, hover over the **Configuration** (gear) icon, and then click **Data sources**.
1. Click **Add data source**.
1. In the list of data sources, click **Prometheus**.
1. In the URL box, enter **http\://prometheus:9090**.
@ -131,7 +131,7 @@ Grafana Explore is a workflow for troubleshooting and data exploration. In this
> Ad-hoc queries are queries that are made interactively, with the purpose of exploring data. An ad-hoc query is commonly followed by another, more specific query.
1. In the sidebar, click the **Explore** (compass) icon.
1. In the sidebar, click the **Explore** (compass) icon. The Prometheus data source that you added will already be selected.
1. In the **Query editor**, where it says _Enter a PromQL query…_, enter `tns_request_duration_seconds_count` and then press Shift + Enter.
A graph appears.
1. In the top right corner, click the dropdown arrow on the **Run Query** button, and then select **5s**. Grafana runs your query and updates the graph every 5 seconds.
@ -166,7 +166,7 @@ Depending on your use case, you might want to group on other labels. Try groupin
Grafana supports log data sources, like [Loki](/oss/loki/). Just like for metrics, you first need to add your data source to Grafana.
1. In the sidebar, hover your cursor over the **Configuration** (gear) icon, and then click **Data Sources**.
1. In the sidebar, hover over the **Configuration** (gear) icon, and then click **Data Sources**.
1. Click **Add data source**.
1. In the list of data sources, click **Loki**.
1. In the URL box, enter [http://loki:3100](http://loki:3100).
@ -215,9 +215,8 @@ Dashboards consist of _panels_, each representing a part of the story you want y
Every panel consists of a _query_ and a _visualization_. The query defines _what_ data you want to display, whereas the visualization defines _how_ the data is displayed.
1. Click **Dashboard** in the left-side menu.
1. On the Dashboards page, click **New** and select **New Dashboard** in the dropdown.
1. Click **+ Add visualization**.
1. In the sidebar, hover over the **Create** (plus sign) icon and then click **Dashboard**.
1. Click **Add new panel**. The Prometheus data source that you added will already be selected.
1. In the **Query** tab below the graph, enter the query from earlier and then press Shift + Enter:
```
@ -300,7 +299,7 @@ Your request bin is now waiting for the first request.
Next, let's configure a Contact Point in Grafana's Alerting UI to send notifications to our Request Bin.
1. Return to Grafana. In Grafana's sidebar, hover your cursor over the **Alerting** (bell) icon and then click **Contact points**.
1. Return to Grafana. In Grafana's sidebar, hover over the **Alerting** (bell) icon and then click **Contact points**.
1. Click **+ New contact point**.
1. In **Name**, write **RequestBin**.
1. In **Contact point type**, choose **Webhook**.
@ -315,7 +314,7 @@ We have now created a dummy webhook endpoint and created a new Alerting Contact
Now that Grafana knows how to notify us, it's time to set up an alert rule:
1. In Grafana's sidebar, hover the cursor over the **Alerting** (bell) icon and then click **Alert rules**.
1. In Grafana's sidebar, hover over the **Alerting** (bell) icon and then click **Alert rules**.
1. Click **+ New alert rule**.
1. For **Section 1**, name the rule `fundamentals-test`, and set **Rule type** to **Grafana Managed Alert**. For **Folder** type `fundamentals` and in the box that appears, press **Create: fundamentals**.
1. For **Section 2**, find the **query A** box. Choose your Prometheus datasource and enter the same query that we used in our earlier panel: `sum(rate(tns_request_duration_seconds_count[5m])) by(route)`. Press **Run queries**. You should see some data in the graph.
@ -323,7 +322,7 @@ Now that Grafana knows how to notify us, it's time to set up an alert rule:
1. In **Section 3**, enter `30s` for the **Evaluate every** field. For the purposes of this tutorial, the evaluation interval is intentionally short. This makes it easier to test. In the **for** field, enter `0m`. This setting makes Grafana wait until an alert has fired for a given time before Grafana sends the notification.
1. In **Section 4**, you can add some sample text to your summary message. [Read more about message templating here](/docs/grafana/latest/alerting/unified-alerting/message-templating/).
1. Click **Save and exit** at the top of the page.
1. In Grafana's sidebar, hover the cursor over the **Alerting** (bell) icon and then click **Notification policies**.
1. In Grafana's sidebar, hover over the **Alerting** (bell) icon and then click **Notification policies**.
1. Under **Default policy**, select **...** &rsaquo; **Edit** and change the **Default contact point** to **RequestBin**.
As a system grows, admins can use the **Notification policies** setting to organize and match alert rules to
specific contact points.

19
docs/sources/tutorials/stream-metrics-from-telegraf-to-grafana/index.md
View File

@ -29,9 +29,9 @@ In this tutorial, you'll:
## Run Grafana and create admin token
1. Run Grafana following [installation instructions](/docs/grafana/latest/installation/) for your operating system
1. Log in and go to Configuration -> API Keys
1. Press "Add API key" button and create a new API token with **Admin** role
1. Run Grafana following [installation instructions](/docs/grafana/latest/installation/) for your operating system.
1. Log in and go to Configuration -> API Keys.
1. Press "Add API key" button and create a new API token with **Admin** role.
## Configure and run Telegraf
@ -65,12 +65,13 @@ The only thing left here is to create a dashboard with streaming data.
## Create dashboard with streaming data
1. Create new dashboard
1. Press Add empty panel
1. Select `-- Grafana --` datasource
1. Select `Live Measurements` query type
1. Find and select `stream/custom_stream_id/cpu` measurement for Channel field
1. Save dashboard changes
1. Click **Dashboards** in the left-side menu.
1. Click **New** and select **New Dashboard**.
1. On the empty dashboard, click **+ Add visualization**.
1. In the modal that opens, select the `-- Grafana --` data source.
1. Select `Live Measurements` query type.
1. Find and select `stream/custom_stream_id/cpu` measurement for Channel field.
1. Save dashboard changes.
After making these steps Grafana UI should subscribe to the channel `stream/custom_stream_id/cpu` and you should see CPU data updates coming from Telegraf in near real-time.