Pivot table color schema for Grouping

Answered
Oprea asked on January 12, 2017

Hi,
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?
 
i.e.
Level 1 grouping - one colour schema and font size/type/colour
Level2 griuping - a different colour schema or font size /type/colour
 
Example:
 
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).
 
Much appreciated,
Iulian

10 answers

Public
Ian Sadovy Ian Sadovy Flexmonster January 13, 2017

Hello Iulian,
 
Thank you for the question.
Q1: You can use CSS classes (fm-level0, fm-level1, 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.
 
Regards,
Ian

Public
Oprea January 13, 2017

Ian, I think that will work just fine!!!
Many thanks for your answer!
Best regards,
Iulian

Public
Oprea January 13, 2017

Hi Ian,
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?
 
Many thanks,
Iulian

Public
Ian Sadovy Ian Sadovy Flexmonster January 13, 2017

Iulian,
 
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?
 
Regards,
Ian

Public
Oprea January 13, 2017

Hi Ian,
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
Much appreciated,
Iulian
 

Public
Dmytro Zvazhii Dmytro Zvazhii Flexmonster January 16, 2017

Hello lulian,
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.
Best regards,
Dmytro.

Public
Oprea January 16, 2017

Many thanks Dmytro!
Do you know with approximation when will be that released?
Much appreciated,
Iulian
 

Public
Oprea January 16, 2017

And if I may suggest, can this be done through CSS style as it will provide more flexibility than using the conditional formulae / control?
Many thanks,
Iulian

Public
Iryna Kulchytska Iryna Kulchytska Flexmonster January 17, 2017

Hello lulian,
 
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.
 
Kind regards,
Iryna

Public
Tanya Gryshko Tanya Gryshko Flexmonster November 6, 2017

Hello, lulian,
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.
Regards,
Tanya

Please login or Register to Submit Answer