Grafana Table Panel 'clickable' and use it to drill down to a more detailed view

user_2098831 0
Viewed 21513

Is it possible to have a Table Panel in Grafana, and when you click on a row, it shows a graph from another set of time series?

I see there is a feature request for it, but I'm not sure it's available yet https://github.com/grafana/grafana/issues/5481

Looking for any suggestions on making the rows in a Table Panel 'clickable' and use it to drill down to a more detailed view (another dashboard using Template variables). Currently displaying a summary of several servers as rows in a Table Panel and we want to select an individual row (i.e a server) to drill down to a more detailed Dashboard.

Any ways to do this?

Thanks

grafana events
4 Answers

You can achieve this also in 4.x by defining a link for a table column (in the Column Styles section under Visualization). The link can refer to another dashboard and embed current cell's value (or other cell in the same row) as a parameter.

For example the link Url can be: /d/c9xaXx5Zz/tree-node?var-datasource=$datasource&var-interval_id=${__cell_1}&from=$__from&to=$__to&var-path=root

In Grafana 6 or above you can preserve the time range filter using the $__from and $__to built-in vars.

The available built-in variables to access cell contents are not well documented, but they can be found by hovering over the (i) icon of the Url in the table panel.

More info on built-in vars: https://grafana.com/docs/reference/templating/#global-built-in-variables

user_9781640

Drill Down Option can be used from General option from Grafana Dashboard.

enter image description here

Copy the link in the Url of the table which you want to show. Change the items in the variable part which is changing according to the need.It will be of format var-name=value

user_102064760

The link URL works well if you are linking to another dashboard, but it does not work well if you are changing a variable on the same dashboard as it does not auto-refresh.

You can add JavaScript into the URL instead of a link.

javascript:$('a.variable-value-link').trigger('click'); $('span:contains(${__cell:raw})').closest('a').trigger('click');

The JavaScript only works for a single dropdown, it would have to be updated if there were multiple dropdowns. I worked on this quickly, so I am sure there is a better way to use JavaScript to change the variable. It basically opens the dropdown, finds the value from the current row and selects it.

user_35306220
Related