Pivot table color schema for Grouping
Q1: Is there a way to control the colour schema for the left hand side groupings by means of having different colours for the different levels shown?
Level 1 grouping – one colour schema and font size/type/colour
Level2 griuping – a different colour schema or font size /type/colour
Region Sales Employees
—-America (this to show in a colour schema A) 100 10
USA (this to show in a colour schema B) 50 5
Canada (this to show in a colour schema B) 30 3
Mexico (this to show in a colour schema B) 20 2
— Europe (this to show in a colour schema A) 200 20
France (this to show in a colour schema B) 100 10
Ukraine (this to show in a colour schema B) 50 6
Italy 50 4
Q2: is there a way to control the indentation (attached files will give you a visual indication that is difficult to see what is Level1 grouping, what is Level 2 grouping, and what is Detail).
Thank you for the question.
Q1: You can use CSS classes (
fm-level2, etc.) to change background color and font size/type/color for different levels. Please check the sample – http://jsfiddle.net/flexmonster/x9kbvxee/
Q2: Using the above sample you can change
padding-left to control the indentation of an appropriate level.
Please let me know if it works for you.
Ian, I think that will work just fine!!!
Many thanks for your answer!
On the same note (that’s why I am not opening a new Question) is there a CSS class to control the different levels in the grid content?
As for the grid content, unfortunately, there is no CSS class to control the different levels.
Could you please let us know how is it critical for you?
Thanks for you answer!
It is fairly critical. The users need to identify easily when they move from one level to another as they navigate the grid content. As it is now the figures for Level1 – to Level(n) are all similar in font size and color and it is confusing for the users.
The differentiation in the Header and the indentation are very useful and helps the situation to some extent. It will work fine in combination with highlighting the current line (but I am not aware of such option either).
Please let us know your thoughts
Thank you for your quick reply. For now, there are no instruments which may have solved your case. However, some of our customers have already reported similar issues. That is why we are going to add a new feature for grid style manipulation, which should cover your case.
Many thanks Dmytro!
Do you know with approximation when will be that released?
And if I may suggest, can this be done through CSS style as it will provide more flexibility than using the conditional formulae / control?
Thank you for your questions.
The release date of the feature is not known yet. It may be the second half of 2017 or the end of 2017. We will be able to update you with the approximate release date when it becomes known.
Thank you for your suggestion. The new grid style manipulation approach will be done through CSS style. We also consider it as more flexible.
I would like to inform you that
customizeCell capabilities were greatly extended in version 2.4. For instance, now you can highlight entire levels in the pivot table including data cells. Please refer to the following example on JSFiddle: http://jsfiddle.net/flexmonster/v06jx81y/. To discover more
customizeCell use cases please read our post: Grid customization and styling beyond CSS.