The Panel Title Is Not Centered

What has happened?
The panel title is not centered

What is expected to happen?
I want the panel titles to center align, after an update from grafana cloud, all my panel titles have changed to left aligned

Anyone can help ? maybe adding properties in Panel JSON

Thanks,

6 Likes

It is a feature, not a bug.

omg, maybe some people need this feature, but some other people don’t like the new feature like me. is there an optional way to change it to center align like this ?

2 Likes

Well, you add a panel to a dashboard and out of a sudden you get a mix of centred and left-aligned titles. That doesn’t look very feature-y.

You can revert to the proper look by inspecting the panel JSON and changing the type from “timeseries” to “graph”. It won’t display immediately, you need to Apply, save your dashboard, and reload the page.

Made an account just to say I would also like an option to choose to center align the Title as most of my dashboards look neater this way, is there a feature request section we can put this in?

1 Like

Same here. Just give the choice for alignment, please.

2 Likes

yes please - center option :pleading_face: :pleading_face: :pleading_face: :pleading_face:

Or let us edit the json-code of the panel and provide key-value pair like “align”:“center”, and the location where it needs to go.

@Grafana - Please provide an option to center the Panel Title again as this location is best practice in scientific writing and the engineering world. Having simple details like the panel title in line with what is common in the industry makes your dashboard easily to read and understand in a glance by default. Hope it will be included soon because its super important :slight_smile:

1 Like

Hello!
I am curious about your use case. How are you using Grafana?

I would also like too learn more about the best practices you mention. Could you point me to where I could find them?

You mention having the panel title in line with what is common in the industry. Most software in the monitoring/observability sphere seem to have left aligned titles.

1 Like

Hello,
I think there isn’t a real standard about the title alignment. Personally I’d rather prefer the previous panel look with the centered title, any option to define this would be very appreciated.

Thank you,
Fabrizio

I tried to google for a proper guideline from universities like TU Delft in the Netherlands but in there the position of the Title is not described exactly to be honest.

Commonly used software in the engineering world are MS xlsx and Plotly (in Python or Grafana of course) and in that software the Title of figures is centered by default for example. The same is true for MS Word or LaTex hence most, if not all, figures you find in scientific/engineering papers have titles centered to the middle of the panel :stuck_out_tongue:

One example among others, I use a very small text-only panel to act as a headline for groups of others. In this example it spans across two time displays, but I have other cases where it spans a mixture of different panels, like for my home automation there is a headline “basement” and panels below are temperature, ventilation/door status etc…
It’d be nice to have the title centrally aligned, so that it acts as an umbrella for the sections below. Just give the option so everyone can fit it to their standard!?
Bildschirmfoto 2023-05-05 um 10.34.58

1 Like

I thought it was familiar and then it just hit me, this is a poor attempt as replicating DataDog layout …

RRDTool.

2 Likes

Example of 4 random monitoring products, which offer dashboard functionality and not only a graph (product names are not important) and which have left panel title alignment:

All of them have one common point - user can customise panels from the dashboard, so they have some user interface (UI) action element (e.g. three dots, “hamburger”, menu, …), which indicates this option to the user.

IMHO that is main root cause of this current change in the Grafana.

Before 9.5:

From 9.5:

That action element is now always on the same place in the panel right top corner. Three dots are more common than small down arrow symbol. It will be more meaningful for the users, especially new users.

I didn’t like this UI change at first sight. But IMHO it has strong meaning for user experience (UX). I’m glad that Grafana’s UI/UX designers are thinking about these small details, which makes better user experience.

I accept this UI change, despite my classic user resistance to product redesign. I wouldn’t think this will be a problem if Grafana has it from the start. So it can be only a inheritance of wrong design decision in the past.

Here is a classic meme, which will help to understand UI vs UX difference:

sounds god and easy to understand - but doesnt look well on a mobile device


in older versions the panel menu (3 dots) were simply not there!! esp. on a smartphone it is a waste of space and at least for me: ugly

Sure, it can be an improvement tak for a designers. I guess mobile devices don’t have “on hover” events, so action item must be visible in this case.
Grafana is not designated for mobile devices first, so mobile devices can have some minor UI/UX issues.

exactly - for that many users asking for hiding menu completely if access is viewer or anonymous.
Thanks for your response.

If industry standard is such an important argument, put left-aligned as default but let users still allow to change it? What’s the downside of having this option available?

1 Like

Hey there, we agree on the mobile device issue. We actually introduced this to make it more accessible but we missed the aesthetics and UX feel. We’ve reverted this (see the issue here) and will be looking into approaching a11y differently :slight_smile:

1 Like

@nataliabernarte Thanks for the update.

Is this supposed to mean that in a future version of Grafana there will be an option to center the panel text? In v9.5.2, I do not see any option for changing the title to be centered.

1 Like