RDT with rounded edges

#1

Hi guys, I’m trying to customize an RDT that I have, exploring the different configurations to achieve the desired design. At this moment I am trying to round the edges of the table with about 10 pixels. I have achieved this by hacking the html element and setting the border-radius css property to the corresponding div.

What i want is something like this:

21

I wonder if there is a cleaner solution using AQL?

#2

Hi @firedevops, yes, there is a cleaner solution to be able to achieve the customization of the table’s styles, please follow the documentation referring to it in the following link: https://chartfactor.com/doc/latest/visualization_options/color/#table-theme-configuration.

For your specific case, in which you want to round the edges of the table, you must use the “gridPanelStyle” style, something similar to the following piece of code:

let tableColor = cf.Color();
tableColor.theme({
    "gridPanelStyle": "border-radius: 10px 10px 10px 10px;",
    //...
});
//...
.set("color", tableColor)

Let me know if this is what you wanted to achieve.

#3

Thanks @juan.dominguez, that’s awesome and worked like a charm!