moxious / triage

testing triage actions for issues
0 stars 1 forks source link

Chart loses selected data type on every refresh #258

Open tonypowa opened 7 months ago

tonypowa commented 7 months ago

What happened?

I have a dashboard which contains many charts. The dashboards refreshes every 10s. This works well for any charts except one. The chart also doesn't show any data on initial load.

Initial load and after 10s:

image

Clicking on _value and/or velocitykmh:

image

influxdb query


from(bucket: "home-telemetry")

 |> range(start: v.timeRangeStart, stop: v.timeRangeStop)

 |> filter(fn: (r) => r["_measurement"] == "weather")

 |> filter(fn: (r) => r["location"] == "Wind")

 |> map(fn: (r) => ({r with velocitykmh: r._value ISSUE_TRIAGE.md README.md copy-issue.sh grafana-labels.txt grafana-triage-labels.txt 3.6}))

 |> aggregateWindow(every: 10m, fn: max, createEmpty: false)

Basically what I am trying here is to convert m/s to km/h for better human readability.

Unfortunately with the map function in place I don't see any data on the chart. I only see any data once I click on either of those ion the chart's legend:

However after 10s (dashboard refresh) whatever I selected (typically velocitykmh) is deselected again and the chart does not show any data anymore.

Bug? Or what is it I'm doing wrong?

What did you expect to happen?

Charts remembers the desired data field to show.

Did this work before?

As I said... any other chart (not containg a map()) is working.

How do we reproduce it?

  1. use the query from above

  2. automatically refresh the dashboard every 10s

Is the bug inside a dashboard panel?

| Key | Value |

|--|--|

| Panel | timeseries @ 10.2.0 (895fbafb7a) |

| Grafana | 10.2.0 (895fbafb7a) // Open Source |

Panel debug snapshot dashboard ```json { "panels": [ { "datasource": { "type": "grafana", "uid": "grafana" }, "fieldConfig": { "defaults": { "custom": { "drawStyle": "line", "lineInterpolation": "smooth", "barAlignment": 0, "lineWidth": 1, "fillOpacity": 20, "gradientMode": "none", "spanNulls": false, "insertNulls": false, "showPoints": "never", "pointSize": 5, "stacking": { "mode": "none", "group": "A" }, "axisPlacement": "auto", "axisLabel": "", "axisColorMode": "text", "axisBorderShow": false, "scaleDistribution": { "type": "linear" }, "axisCenteredZero": false, "hideFrom": { "tooltip": false, "viz": false, "legend": false }, "thresholdsStyle": { "mode": "off" }, "lineStyle": { "fill": "solid" } }, "color": { "mode": "continuous-GrYlRd" }, "mappings": [], "thresholds": { "mode": "absolute", "steps": [ { "color": "blue", "value": null }, { "color": "red", "value": 80 } ] }, "unit": "velocityms" }, "overrides": [ { "matcher": { "id": "byName", "options": "velocitykmh {_field=\"windvelocity\", _start=\"2023-11-04 18:59:32.763 +0000 UTC\", _stop=\"2023-11-04 21:59:32.763 +0000 UTC\", location=\"Wind\"}" }, "properties": [ { "id": "color", "value": { "fixedColor": "blue", "mode": "fixed" } } ] }, { "matcher": { "id": "byName", "options": "velocitykmh {_field=\"windvelocity\", _start=\"2023-11-04 18:59:45.57 +0000 UTC\", _stop=\"2023-11-04 21:59:45.571 +0000 UTC\", location=\"Wind\"}" }, "properties": [ { "id": "color", "value": { "fixedColor": "blue", "mode": "fixed" } } ] }, { "matcher": { "id": "byName", "options": "velocitykmh {_field=\"windvelocity\", _start=\"2023-11-04 19:00:25.992 +0000 UTC\", _stop=\"2023-11-04 22:00:25.992 +0000 UTC\", location=\"Wind\"}" }, "properties": [ { "id": "color", "value": { "fixedColor": "blue", "mode": "fixed" } } ] }, { "__systemRef": "hideSeriesFrom", "matcher": { "id": "byNames", "options": { "mode": "exclude", "names": [ "velocitykmh {_field=\"windvelocity\", _start=\"2024-01-20 17:11:32.053 +0000 UTC\", _stop=\"2024-01-20 20:11:32.053 +0000 UTC\", location=\"Wind\"}" ], "prefix": "All except:", "readOnly": true } }, "properties": [ { "id": "custom.hideFrom", "value": { "viz": true, "legend": false, "tooltip": false } } ] } ] }, "gridPos": { "h": 13, "w": 15, "x": 0, "y": 0 }, "id": 2, "options": { "tooltip": { "mode": "single", "sort": "none" }, "legend": { "showLegend": true, "displayMode": "list", "placement": "bottom", "calcs": [] } }, "targets": [ { "refId": "A", "datasource": { "type": "grafana", "uid": "grafana" }, "queryType": "snapshot", "snapshot": [ { "schema": { "refId": "A", "meta": { "typeVersion": [ 0, 0 ], "executedQueryString": "from(bucket: \"home-telemetry\")\r\n |> range(start: 2024-01-20T17:12:52.755Z, stop: 2024-01-20T20:12:52.755Z)\r\n |> filter(fn: (r) => r[\"_measurement\"] == \"weather\")\r\n |> filter(fn: (r) => r[\"location\"] == \"Wind\")\r\n |> map(fn: (r) => ({r with velocitykmh: r._value ISSUE_TRIAGE.md README.md copy-issue.sh grafana-labels.txt grafana-triage-labels.txt 3.6}))\r\n |> aggregateWindow(every: 10m, fn: max, createEmpty: false)\r\n\r\n\r\n", "transformations": [ "organize" ] }, "name": "weather", "fields": [ { "name": "_time", "type": "time", "typeInfo": { "frame": "time.Time", "nullable": true }, "config": {} }, { "name": "_value", "type": "number", "typeInfo": { "frame": "float64", "nullable": true }, "labels": { "_field": "windvelocity", "_start": "2024-01-20 17:12:52.755 +0000 UTC", "_stop": "2024-01-20 20:12:52.755 +0000 UTC", "location": "Wind" }, "config": {} }, { "name": "velocitykmh", "type": "number", "typeInfo": { "frame": "float64", "nullable": true }, "labels": { "_field": "windvelocity", "_start": "2024-01-20 17:12:52.755 +0000 UTC", "_stop": "2024-01-20 20:12:52.755 +0000 UTC", "location": "Wind" }, "config": {} } ] }, "data": { "values": [ [ 1705771200000, 1705771800000, 1705772400000, 1705773000000, 1705773600000, 1705774200000, 1705774800000, 1705775400000, 1705776000000, 1705776600000, 1705777200000, 1705777800000, 1705778400000, 1705779000000, 1705779600000, 1705780200000, 1705780800000, 1705781400000, 1705781572755 ], [ 0.45, 0, 0, 0, 0, 1.04, 0.75, 0.83, 1.79, 0, 0, 0, 0, 1.16, 0.95, 0.87, 0, 0.33, 0.2 ], [ 1.62, 0, 0, 0, 0, 3.744, 2.7, 2.988, 6.444, 0, 0, 0, 0, 4.176, 3.42, 3.132, 0, 1.1880000000000002, 0.7200000000000001 ] ] } } ] } ], "title": "Reproduced with embedded data", "transformations": [ { "id": "organize", "options": { "excludeByName": { "_value {_field=\"windvelocity\", _start=\"2023-11-04 18:58:47.537 +0000 UTC\", _stop=\"2023-11-04 21:58:47.538 +0000 UTC\", location=\"Wind\"}": true }, "indexByName": {}, "renameByName": { "velocitykmh {_field=\"windvelocity\", _start=\"2023-11-04 18:58:47.537 +0000 UTC\", _stop=\"2023-11-04 21:58:47.538 +0000 UTC\", location=\"Wind\"}": "velocity" } } } ], "type": "timeseries", "description": "" }, { "gridPos": { "h": 7, "w": 9, "x": 15, "y": 0 }, "id": 5, "options": { "content": "\n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n
Paneltimeseries @ 10.2.0 (895fbafb7a)
QueriesA[influxdb]
Transformorganize
Data 1 frames, 3 fields, 19 rows
Grafana10.2.0 (895fbafb7a) // Open Source
", "mode": "html" }, "title": "Debug info", "type": "text" }, { "id": 6, "title": "Original Panel JSON", "type": "text", "gridPos": { "h": 13, "w": 9, "x": 15, "y": 7 }, "options": { "content": "{\n \"datasource\": {\n \"uid\": \"rlAVlZJ4k\",\n \"type\": \"influxdb\"\n },\n \"fieldConfig\": {\n \"defaults\": {\n \"custom\": {\n \"drawStyle\": \"line\",\n \"lineInterpolation\": \"smooth\",\n \"barAlignment\": 0,\n \"lineWidth\": 1,\n \"fillOpacity\": 20,\n \"gradientMode\": \"none\",\n \"spanNulls\": false,\n \"insertNulls\": false,\n \"showPoints\": \"never\",\n \"pointSize\": 5,\n \"stacking\": {\n \"mode\": \"none\",\n \"group\": \"A\"\n },\n \"axisPlacement\": \"auto\",\n \"axisLabel\": \"\",\n \"axisColorMode\": \"text\",\n \"axisBorderShow\": false,\n \"scaleDistribution\": {\n \"type\": \"linear\"\n },\n \"axisCenteredZero\": false,\n \"hideFrom\": {\n \"tooltip\": false,\n \"viz\": false,\n \"legend\": false\n },\n \"thresholdsStyle\": {\n \"mode\": \"off\"\n },\n \"lineStyle\": {\n \"fill\": \"solid\"\n }\n },\n \"color\": {\n \"mode\": \"continuous-GrYlRd\"\n },\n \"mappings\": [],\n \"thresholds\": {\n \"mode\": \"absolute\",\n \"steps\": [\n {\n \"color\": \"blue\",\n \"value\": null\n },\n {\n \"color\": \"red\",\n \"value\": 80\n }\n ]\n },\n \"unit\": \"velocityms\"\n },\n \"overrides\": [\n {\n \"matcher\": {\n \"id\": \"byName\",\n \"options\": \"velocitykmh {_field=\\\"windvelocity\\\", _start=\\\"2023-11-04 18:59:32.763 +0000 UTC\\\", _stop=\\\"2023-11-04 21:59:32.763 +0000 UTC\\\", location=\\\"Wind\\\"}\"\n },\n \"properties\": [\n {\n \"id\": \"color\",\n \"value\": {\n \"fixedColor\": \"blue\",\n \"mode\": \"fixed\"\n }\n }\n ]\n },\n {\n \"matcher\": {\n \"id\": \"byName\",\n \"options\": \"velocitykmh {_field=\\\"windvelocity\\\", _start=\\\"2023-11-04 18:59:45.57 +0000 UTC\\\", _stop=\\\"2023-11-04 21:59:45.571 +0000 UTC\\\", location=\\\"Wind\\\"}\"\n },\n \"properties\": [\n {\n \"id\": \"color\",\n \"value\": {\n \"fixedColor\": \"blue\",\n \"mode\": \"fixed\"\n }\n }\n ]\n },\n {\n \"matcher\": {\n \"id\": \"byName\",\n \"options\": \"velocitykmh {_field=\\\"windvelocity\\\", _start=\\\"2023-11-04 19:00:25.992 +0000 UTC\\\", _stop=\\\"2023-11-04 22:00:25.992 +0000 UTC\\\", location=\\\"Wind\\\"}\"\n },\n \"properties\": [\n {\n \"id\": \"color\",\n \"value\": {\n \"fixedColor\": \"blue\",\n \"mode\": \"fixed\"\n }\n }\n ]\n },\n {\n \"__systemRef\": \"hideSeriesFrom\",\n \"matcher\": {\n \"id\": \"byNames\",\n \"options\": {\n \"mode\": \"exclude\",\n \"names\": [\n \"velocitykmh {_field=\\\"windvelocity\\\", _start=\\\"2024-01-20 17:11:32.053 +0000 UTC\\\", _stop=\\\"2024-01-20 20:11:32.053 +0000 UTC\\\", location=\\\"Wind\\\"}\"\n ],\n \"prefix\": \"All except:\",\n \"readOnly\": true\n }\n },\n \"properties\": [\n {\n \"id\": \"custom.hideFrom\",\n \"value\": {\n \"viz\": true,\n \"legend\": false,\n \"tooltip\": false\n }\n }\n ]\n }\n ]\n },\n \"gridPos\": {\n \"h\": 8,\n \"w\": 24,\n \"x\": 0,\n \"y\": 94\n },\n \"id\": 22,\n \"options\": {\n \"tooltip\": {\n \"mode\": \"single\",\n \"sort\": \"none\"\n },\n \"legend\": {\n \"showLegend\": true,\n \"displayMode\": \"list\",\n \"placement\": \"bottom\",\n \"calcs\": []\n }\n },\n \"targets\": [\n {\n \"datasource\": {\n \"type\": \"influxdb\",\n \"uid\": \"rlAVlZJ4k\"\n },\n \"query\": \"from(bucket: \\\"home-telemetry\\\")\\r\\n |> range(start: v.timeRangeStart, stop: v.timeRangeStop)\\r\\n |> filter(fn: (r) => r[\\\"_measurement\\\"] == \\\"weather\\\")\\r\\n |> filter(fn: (r) => r[\\\"location\\\"] == \\\"Wind\\\")\\r\\n |> map(fn: (r) => ({r with velocitykmh: r._value ISSUE_TRIAGE.md README.md copy-issue.sh grafana-labels.txt grafana-triage-labels.txt 3.6}))\\r\\n |> aggregateWindow(every: 10m, fn: max, createEmpty: false)\\r\\n\\r\\n\\r\\n\",\n \"refId\": \"A\",\n \"hide\": false\n }\n ],\n \"title\": \"Wind (max) in m/s\",\n \"transformations\": [\n {\n \"id\": \"organize\",\n \"options\": {\n \"excludeByName\": {\n \"_value {_field=\\\"windvelocity\\\", _start=\\\"2023-11-04 18:58:47.537 +0000 UTC\\\", _stop=\\\"2023-11-04 21:58:47.538 +0000 UTC\\\", location=\\\"Wind\\\"}\": true\n },\n \"indexByName\": {},\n \"renameByName\": {\n \"velocitykmh {_field=\\\"windvelocity\\\", _start=\\\"2023-11-04 18:58:47.537 +0000 UTC\\\", _stop=\\\"2023-11-04 21:58:47.538 +0000 UTC\\\", location=\\\"Wind\\\"}\": \"velocity\"\n }\n }\n }\n ],\n \"type\": \"timeseries\",\n \"description\": \"\"\n}", "mode": "code", "code": { "language": "json", "showLineNumbers": true, "showMiniMap": true } } }, { "id": 3, "title": "Data from panel above (after transformations)", "type": "table", "datasource": { "type": "datasource", "uid": "-- Dashboard --" }, "gridPos": { "h": 7, "w": 15, "x": 0, "y": 13 }, "options": { "showTypeIcons": true }, "targets": [ { "datasource": { "type": "datasource", "uid": "-- Dashboard --" }, "panelId": 2, "withTransforms": true, "refId": "A" } ] }, { "id": 100, "title": "Data (before transformations)", "type": "table", "datasource": { "type": "datasource", "uid": "-- Dashboard --" }, "gridPos": { "h": 7, "w": 24, "x": 0, "y": 13 }, "options": { "showTypeIcons": true }, "targets": [ { "datasource": { "type": "datasource", "uid": "-- Dashboard --" }, "panelId": 2, "withTransforms": false, "refId": "A" } ] } ], "schemaVersion": 37, "title": "Debug: Wind (max) in m/s // 2024-01-20 21:12:55", "tags": [ "debug", "debug-timeseries" ], "time": { "from": "2024-01-20T17:12:55.348Z", "to": "2024-01-20T20:12:55.348Z" } } ```

Environment (with versions)?

Grafana: 10.2.0

OS: ubuntu 22.02

Browser: any

Grafana platform?

Docker

Datasource(s)?

No response

tonypowa commented 7 months ago

This issue is a test copy of an issue in another repo. Original issue: https://github.com/grafana/grafana/issues/#80934

moxious commented 7 months ago

Elaboration:

Hi @tonypowa, thank you for reaching out with the issue you've encountered. To better understand and address the issue with your Grafana chart not retaining the selected data type upon refresh, I'd like to gather a bit more information. Could you please provide the following details?

  1. You mentioned that clicking on _value and/or velocitykmh displays data. Do any errors show up in the Grafana UI or log files when you load the dashboard initially or after the refresh?

  2. Can you confirm whether the issue persists across different browsers or in incognito/private browsing mode to rule out browser-specific issues?

  3. Check the Network tab in your browser's developer tools: Are there any failed requests or noticeable errors when the dashboard refreshes, especially concerning queries to InfluxDB?

  4. Have there been any recent updates or changes to your dashboard or the InfluxDB datasource that coincided with the start of this issue?

  5. Could you share the output of the Grafana server log when the dashboard is refreshed? This could provide insights into what might be causing the issue.

  6. Since this involves a custom transformation in the query, have you tried simplifying the InfluxDB query by removing the map function to see if the issue is directly related to this transformation?

  7. If possible, could you provide the JSON model of one of the charts that is working correctly for comparison?

Please add this additional information so that the community can further assist you in resolving this issue.

Thank you!

moxious commented 7 months ago

Hi @tonypowa, this sounds like an issue related to data visualization or data querying within Grafana dashboards, so potentially involving the frontend where the UI components like charts are rendered, or the queries are processed for the visualizations. However, since you are also using an InfluxDB query and applying transformations, we might need expertise related to InfluxDB as well. While both Frontend Platform project and DataViz project could be relevant, given the description of the issue including specific references to InfluxDB query and the Grafana version you are using, I suggest starting with the DataViz project as it seems to be directly related to rendering and handling data within visualization panels.

Thank you for reporting this issue. Based on the details you've provided, it seems to fit best with the DataViz project, which focuses on data visualization aspects within Grafana. I'm suggesting the issue be looked into as part of the DataViz project to address the concerns with the dashboard panel and data persistence after refreshes. The team involved with that project may also need to coordinate with those familiar with InfluxDB queries if the issue is related to the data mapping applied in your query.
moxious commented 7 months ago

Summary: User 'tonypowa' reports that one specific chart within a periodically refreshing Grafana dashboard loses its selected data type ('velocitykmh') after each refresh, while all other charts without a map() function work correctly. The affected chart, which converts 'm/s to 'km/h' for readability, also fails to display any data on initial load, only showing data after manual selection in the legend, which then disappears with the next refresh.