How to do field overrides with node graph panel

[afuqua]

Using Grafana v8.2.1 (88622d7f09) and the Node Graph Panel, with a mysql datasource, I want to set the units to seconds (so that it will automatically show days or weeks when appropriate, like some other panels do) for the mainStat and decrease the number of decimal places shown and otherwise do field overrides. Right now, both stats on the nodes are showing 2 decimal places, and no units. Also, the legend just shows “mainStat” and “secondaryStat”; I want to change those labels like I can do with other panels.

The documentation for this panel states all this is possible, but doesn’t say how.

I can do this with some other panels in the side pane, “standard options”. The standard options doesn’t show up for me for the Node Graph Panel. I’m willing to plug values into the JSON, but I haven’t found the right values to make that work either.

I don’t see any errors in the UI or in the logfile related to this.

THANKS for any help or pointers.
Andrew

[afuqua]

Here’s what I mean by the stats showing 2 digits:

And here’s what I mean when I say the side panel not showing “standard options”:

[afuqua]

I can format the numbers and convert to strings to solve the decimal places and data units issues. But I still don’t know how to specify the arc colors or rename the items in the legend. I can edit the dashboard json, but what do I put in there?

[blukhand]

now i have the same problem . i can find no way to set the config of the node graph. i guess they may put all this to grafana tempo

[yosiasz]

could you please provide sample nodes and edges data as inline csv here

timestamp,value,metric
2022-05-25 23:00:00,34.5,'yoohoo'
2022-05-25 23:00:00,14.5,'zimzam'
2022-05-25 23:00:00,25.5,'karfukle'

but near to real representation of your data, obfuscated is necessary. Because, we dont have access to your database

[blukhand]

nodes data

id	title	mainStat	arc__passed	arc__failed
1	nginx	21233	0.283	0.717
2	serviceA	12000	0.167	0.833
3	serviceB	8233	0.486	0.514

edges data

id	source	target
fasdfdfsfa	1	2

I hope the arc__passed and arc__failed showed in different color instead of default gray.
but it seems that, there is no way to set the config.color.fixedColor when i use mysql as data source.

thanks for you help. i hope i have made it clear

[yosiasz]

your data source is also mysql? Remember it was asked of you to provide your data as inline csv. help us help you.

[blukhand]

yes, mysql too. as your wish

nodes data

id,title,mainStat,arc__passed,arc__failed
‘1’,‘nginx’,21233,0.283,0.717
‘2’,‘serviceA’,12000,0.167,0.833
‘3’,‘serviceB’,8233,0.486,0.514

edges data

id,source,target
‘fasdfdfsfa’,‘1’,‘2’

thank you

[yosiasz]

ended up using the following for now.

Node graph Support · yesoreyeram/grafana-infinity-datasource · Discussion #186

there is a bit there for providing colorin to the nodes. will try to look further into how to do it with mysql

[blukhand]

i have searched this doc before. i tried the name color column as it said.but it seems not work in mysql datasource.

i think the plugin ( grafana-infinity-datasource)has do some work to set the metadata of column.

is there some way in mysql datasource to set the metadata of the node ?

i find this json data in mysql query – query inspector – json – pannel data

i think the config.color.fixedColor should be set here.

{
“name”: “id”,
“type”: “string”,
“typeInfo”: {
“frame”: “string”,
“nullable”: true
},
“config”: {},
“values”: [
“1”,
“2”,
“3”
],
“entities”: {},
“state”: {
“displayName”: “id”,
“multipleFrames”: false,
“scopedVars”: {
“__series”: {
“text”: “Series”,
“value”: {
“name”: “Series (nodes)”
}
},
“__field”: {
“text”: “Field”,
“value”: {}
}
},
“seriesIndex”: 0
}
},

[yosiasz]

Notice that is said here

If you have any arc__* field, corresponding value (number) will be used as the nodes arc value. Note : Total value of row item should sum to 1. If you need to specify a color for the arc__* field, add a new field called arc__*_color.

{
	"nodes": [
		{
			"id": 1,
			"title": "nginx",
			"mainStat": 21233,
			"arc__passed": 0.283,
			"passed_color": "blue",
			"arc__failed": 0.717,
			"failed_color": "red"
		},
		{
			"id": 2,
			"title": "serviceA",
			"mainStat": 12000,
			"arc__passed": 0.167,
			"passed_color": "blue",
			"arc__failed": 0.833,
			"failed_color": "red"
		},
		{
			"id": 3,
			"title": "serviceB",
			"mainStat": 8233,
			"arc__passed": 0.486,
			"passed_color": "green",
			"arc__failed": 0.514,
			"failed_color": "red"
		}
	],
	"edges": {
		"id": "a",
		"source": 1,
		"target": 2
	}
}

[yosiasz]

any idea how you do this part when using mysql as data source?

FROM

Node graph

This visualization needs a specific shape of the data to be returned from the data source in order to correctly display it.

Data source needs to return two data frames, one for nodes and one for edges. You have to set frame.meta.preferredVisualisationType = 'nodeGraph' on both data frames or name them nodes and edges respectively for the node graph to render.

[blukhand]

i have tried these data with bar graph, i think bar graph worked well.

bar graph puglin allows user set config such as color, line sharp and so on, in the override tab. I tried the other official graph types, all of them can set config when use mysql as datasource in the “override” tab, except node graph.

so i think node graph can copy the others plan. they are friendly enough,

if that way takes too much time, i think node graph can just allow user to submit some config in the json, or allow user to submit a json template which could be filled by sql result.
it can help a lot too.

[yosiasz]

agreed, they need to allow this setting for each query frame

[afuqua]

Well, I’m still stuck. Here is my CSV (generated with SQL):

“id”,“title”,“mainStat”,“secondaryStat”,“arc__one”,“arc__two”,“arc__one_color”,“arc__two_color”
To Do,To Do,1 times,0 days,0.700,0.300,red,green
Approved,Approved,1 times,1 days,0.700,0.300,red,green
In Progress,In Progress,1 times,0.700,0.300,red,green

Here’s my graph:

My two problems: (1) I still don’t get color on the arcs. (2) I wish I could either color or have a display name for mainStat.

Strangely, I’ve noticed that if I change the order of the columns, I get a different result, as follows:

“id”,“title”,“mainStat”,“secondaryStat”,“arc__one”,“arc__one_color”,“arc__two”,“arc__two_color”
To Do,To Do,1 times,0 days,0.700,red,0.300,green
Approved,Approved,1 times,1 days,0.700,red,0.300,green
In Progress,In Progress,1 times,0.700,red,0.300,green

THANKS

[yosiasz]

yeah I think this is a bug, it works fine using infitnity plugin with your exact data as csv inline. Here is the node with your data in csv inline using infinity

(using blue red for us color blinds)

[blukhand]

hi, can you give the version of grafana you used?

my version is v8.5.3
i tried a afuqua’s data use infinity plugin csv inline .

the same display as afuqua, no color.

i think it may relate to grafana’s verison

[yosiasz]

Mine is 8.5.2
Let me spin up an 8.5.3 version and try it.

[yosiasz]

works in 8.5.2

Does not work in 8.5.3. Your assumptions were correct.

[blukhand]

think you
need submit a issue in the github rep?