Row aggregation with conditional formatting is an AG Grid Enterprise feature, so you’ll need a license key to use it. See Using AG Grid Enterprise for an example of how to use your license key with Dash AG Grid components.
This will style both the summary and detail level:
cellStyle = "cellStyle": {
"styleConditions": [
{"condition": "params.value > 100", "style": {"color": "red"}}
]
},
This will style the summary levels only:
cellStyle={
"styleConditions": [
{
"condition": "params.node.aggData ? params.node.aggData.gold < 3 : false",
"style": {"backgroundColor": "silver"},
}
]
}
import dash_ag_grid as dag
from dash import Dash, html
import pandas as pd
import os
app = Dash(__name__)
df = pd.read_csv(
"https://raw.githubusercontent.com/plotly/datasets/master/ag-grid/olympic-winners.csv"
)
columnDefs = [
# Row group by country and by year is enabled.
{
"field": "country",
"rowGroup": True,
"hide": True,
"suppressColumnsToolPanel": True,
},
{
"field": "sport",
"rowGroup": True,
"hide": True,
"suppressColumnsToolPanel": True,
},
{
"field": "year",
"pivot": True,
"hide": True,
"suppressColumnsToolPanel": True,
},
{
"field": "gold",
"sortable": True,
"filter": True,
"aggFunc": "sum",
"cellStyle": {
"styleConditions": [
{"condition": "params.value > 100", "style": {"color": "red"}}
]
},
},
{"field": "silver", "sortable": True, "filter": True, "aggFunc": "sum"},
]
app.layout = html.Div(
[
dag.AgGrid(
id="enterprise-aggregation-example",
columnDefs=columnDefs,
rowData=df.to_dict("records"),
defaultColDef=dict(
resizable=True,
rowSelection="multiple",
suppressAggFuncInHeader=True,
),
enableEnterpriseModules=True,
licenseKey = os.environ['AGGRID_ENTERPRISE'],
getRowStyle={
"styleConditions": [
{
"condition": "params.node.aggData ? params.node.aggData.gold < 3 : false",
"style": {"backgroundColor": "silver"},
}
]
},
),
]
)
if __name__ == "__main__":
app.run(debug=True)