Need help in modifying a dashboard

  • What Grafana version and what operating system are you using?
    → MacOS Big Sur. | Grafana v8.3.1

  • What are you trying to achieve?
    We are trying to create a graph for the flows that we use. (Flows in this context can be assumed as any pipeline).
    The data points we have for each flow are the runtime of that flow (in milliseconds) and the final status of it (Successful, Failed, Killed).
    What we are trying to create is a graph, which can represent this in the following manner.

We want to replicate the exact same graph in Grafana.

  • How are you trying to achieve it?
    We were able to replicate the graph until the below extent.

  • What happened?
    The only part that we can’t figure out is how to make the points color coded?
    We want the points to be green when flow was a success and red when it was failed or killed.

  • Can you copy/paste the configuration(s) that you are having problems with?

{
  "id": 4,
  "gridPos": {
    "h": 8,
    "w": 23,
    "x": 0,
    "y": 0
  },
  "type": "timeseries",
  "title": "Flow Statistics ( Runtime+Status ) - Panel 1",
  "datasource": {
    "type": "opentsdb",
    "uid": "000000016"
  },
  "fieldConfig": {
    "defaults": {
      "custom": {
        "drawStyle": "line",
        "lineInterpolation": "smooth",
        "barAlignment": 0,
        "lineWidth": 1,
        "fillOpacity": 0,
        "gradientMode": "scheme",
        "spanNulls": false,
        "showPoints": "always",
        "pointSize": 7,
        "stacking": {
          "mode": "normal",
          "group": "A"
        },
        "axisPlacement": "auto",
        "axisLabel": "",
        "scaleDistribution": {
          "type": "linear"
        },
        "hideFrom": {
          "tooltip": false,
          "viz": false,
          "legend": false
        },
        "thresholdsStyle": {
          "mode": "off"
        },
        "lineStyle": {
          "fill": "solid"
        }
      },
      "color": {
        "mode": "thresholds",
        "seriesBy": "last"
      },
      "thresholds": {
        "mode": "absolute",
        "steps": [
          {
            "color": "red",
            "value": null
          },
          {
            "value": 1,
            "color": "green"
          }
        ]
      },
      "mappings": [
        {
          "options": {
            "0": {
              "color": "red",
              "index": 0,
              "text": "Failed"
            },
            "1": {
              "color": "green",
              "index": 2,
              "text": "Successful"
            },
            "-1": {
              "color": "super-light-red",
              "index": 1,
              "text": "Killed"
            }
          },
          "type": "value"
        }
      ],
      "unit": "ms"
    },
    "overrides": [
      {
        "matcher": {
          "id": "byName",
          "options": "Runtime"
        },
        "properties": [
          {
            "id": "custom.gradientMode",
            "value": "opacity"
          }
        ]
      },
      {
        "matcher": {
          "id": "byName",
          "options": "Time"
        },
        "properties": [
          {
            "id": "custom.gradientMode",
            "value": "hue"
          }
        ]
      }
    ]
  },
  "options": {
    "tooltip": {
      "mode": "multi"
    },
    "legend": {
      "displayMode": "list",
      "placement": "bottom",
      "calcs": [
        "lastNotNull"
      ]
    }
  },
  "targets": [
    {
      "aggregator": "sum",
      "alias": "Runtime",
      "datasource": {
        "type": "opentsdb",
        "uid": "000000016"
      },
      "disableDownsampling": true,
      "downsampleAggregator": "avg",
      "downsampleFillPolicy": "none",
      "metric": "myMetrics.runtime",
      "refId": "A"
    },
    {
      "aggregator": "sum",
      "alias": "Status",
      "datasource": {
        "type": "opentsdb",
        "uid": "000000016"
      },
      "disableDownsampling": true,
      "downsampleAggregator": "avg",
      "downsampleFillPolicy": "none",
      "hide": false,
      "metric": "myMetrics.status",
      "refId": "B"
    }
  ],
  "transformations": [
    {
      "id": "calculateField",
      "options": {
        "mode": "reduceRow",
        "reduce": {
          "reducer": "delta",
          "include": [
            "Status",
            "Runtime"
          ]
        },
        "replaceFields": false
      }
    }
  ]
}
  • Did you receive any errors in the Grafana UI or in related logs? If so, please tell us exactly what they were.
    No errors, just trying to figure out a way to do this.

Hi, would it work for you to:

  1. create a separate query for only failed & killed runs
  2. pick color red for those results
  3. add series override for those results where it removes the lines

Results could look something like this:

So basically it would fetch everything, but then plot on top of that red circles wherever the run was failed.

What graph type is this?

We can’t create a different query. The format in which data points come are as below:


Timestamp                           Runtime                    
2022-06-13 23:49:00           4h 3m (in milllis)

Timestamp                            Status    
2022-06-13 23:49:00            1  (Success)




Timestamp                           Runtime                    
2022-06-16 11:29:00           3h 2m (in milllis)

Timestamp                            Status    
2022-06-16 11:29:00            0  (Failed)



Timestamp                           Runtime                    
2022-11-10 12:29:00           6h 2m (in milllis)

Timestamp                            Status    
2022-11-10 12:29:00            -1 (Killed)

i.e. Same timestamp for runtime and status. Then we stack these 2 to create the above graph.

This is a Timeseries Graph

can you please post sample data as csv. what you posted is a bit hard to grok

process,dtime,status
Renovate Bot,2022-06-29 15:27:27.083,1

and what is the source of your data? sql, influx ?

@yosiasz
Query 1:

time,runtime
2022-06-13 23:49:00,14460000
2022-06-16 11:29:00,10920000
2022-11-10 12:29:00,21720000

Query 2:

time,status
2022-06-13 23:49:00,1
2022-06-16 11:29:00,0
2022-11-10 12:29:00,-1