asked on June 15, 2020
Can you please give an idea how to create conditional data bar in Table.
I want the data bar in table as shown image below
https://ibb.co/F6M1ZJk
⋅ June 16, 2020
Hello, Naidu,
Thank you for reaching out to us.
The desired output can be achieved using Flexmonster's customizeCell hook.
We have prepared a JSFiddle example for illustration: https://jsfiddle.net/flexmonster/nxpmrtsh/
In the example, the customizeCell hook is used to color the subtotal cells and to add a bar to the corresponding cells depending on the cell's value.
Please let us know if this would work for you.
Looking forward to your reply.
Kind regards,
Vera
⋅ June 16, 2020
Hai, Vera Didenko,
Thank you so much for the reply. We are happy with the answer.
I have one more doubt on this, Tool tip on the cell is not working. Can you please suggest me how to implement the tool tip (when we are hover on the cell related data should be visible on the tool tip)
⋅ June 16, 2020
Hello,
Thank you for your reply.
We are glad to hear that the conditional data bar example works well for you.
As for tooltips, this can also be achieved via the customizeCell hook and custom CSS.
Here is a modified version of the example, where tooltips have been added: https://jsfiddle.net/flexmonster/2af9whz3/
Please let us know if this works for you.
Looking forward to your reply.
Kind regards,
Vera
⋅ June 18, 2020
Hai, Vera Didenko,
Thank you so much. Everything working fine now.
I have one more query. In angular when i am using the data.expnaded it throwing a issue like expanded property does not exist in cellData. please help me.
⋅ June 18, 2020
Hello, Naidu,
Thank you for your answer.
We are glad to hear that you found the example helpful.
Regarding the problem with the expanded property, please see our reply in the following thread: https://www.flexmonster.com/question/angular-7-data-expanded-property-not-working/
Please let us know if further questions arise.
Kind regards,
Vera
