Can I color timecode values based on age?

  • What Grafana version and what operating system are you using?
    Grafana v10.1.5 (849c612fcb)
    Official Docker image

  • What are you trying to achieve?
    In my Table Panel, I would like the Timestamp values for my datapoints to be colored based on their age relative to the current date. This could be represented by the raw timestamp values or using the data unit override for relative time e.g. 1 day old, 2 days old, etc.

    This is using the JSON API datasource.

  • How are you trying to achieve it?
    I am attempting to use Value Mappings, Thresholds, Data Types, and Color by Value overrides

  • What happened?
    I haven’t been able to achieve this functionality

  • What did you expect to happen?
    N/A

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

  • Did you receive any errors in the Grafana UI or in related logs? If so, please tell us exactly what they were.
    N/A

  • Did you follow any online instructions? If so, what is the URL?
    N/A

In this table for example, the dates older than 3/14 might be colored orange and the ones older than 3/12 might be colored red.

Screenshot 2024-04-02 at 3.22.54 PM

welcome @scjoiner

Please a sample json data might be able to do it in jsonata

{
    "_id": "unique_id_string",
    "timestamp": "2024-04-02 19:48:47.077000",
    "key":"value"
}

A row in the table looks like this with other keys/values and I do Extract Fields (JSON) then I am trying to manipulate the timestamp value.

1 Like

please post clean json with proper format and more data sample. help us help you

https://try.jsonata.org/dg40W0Y3a

using jsonata and override value mapping and color by field color

There’s not much more to the data than that - the JSON API query is simply $.result[*] and the returned rows populate a row in the table per list item. The row value is that string parsed to JSON via the Extract Fields transformation. Each of the key/value pairs in that extracted data becomes a table column including the Timestamp, maybe 10 columns in all. The other key/value pairs don’t matter for the purpose of this exercise - I just want to color the timestamp cell in each row based on its value relative to the current time/date.

The incoming timestamp is a string which until now I’ve displayed using a Cell Unit override with type “Datetime ISO” as shown in the first picture I uploaded.

This would be a typical JSON response from our API:

"result": [
	{
	    "_id": "001",
	    "timestamp": "2024-05-07 01:01:33.077000",
	    "state":"active"
	},
	{
	    "_id": "002",
	    "timestamp": "2024-05-05 19:48:37.077000",
	    "state":"error"
	},
	{
	    "_id": "003",
	    "timestamp": "2024-04-29 20:04:45.077000",
	    "state":"complete"
	}
]

This is the query field from Grafana:

These are the transformations I’m using - the first to extract the data into columns by key name and the rest are just filtering and renaming things to look pretty.

image

Let me know if I can provide anything further. Thanks!

1 Like