Using the react js ag-grid method, I created a table and then passed my json data into the React table.
The json file data is as follows:
{
"posts": [{
"cam1": "3 persons, 1 car, 1 bottle, 2 chairs, 1 tv",
"cam2": "1 person",
"date": "Tue, 19 April 12:16:29 ",
"status": "High"
}, {
"cam1": "3 persons, 2 chairs, 1 tv",
"cam2": "1 person",
"date": "Tue, 19 April 12:16:32 ",
"status": "Low"
}, {
"cam1": "4 persons, 1 bottle, 2 chairs, 1 tv",
"cam2": "1 person",
"date": "Tue, 19 April 12:16:35 ",
"status": "Medium"
}]
}
I then passed this json data into the React table. After passing the data to the tablehttps://i.sstatic.net/No0Nv.png
Now, I want to highlight the status with color coding based on certain conditions.
If the status is high, I want to highlight it in red. If it's medium, I want to highlight it in yellow. Otherwise, I want to highlight it in green.
The expected output model should look like this:https://i.sstatic.net/26YdW.png
How can I achieve this using the react js ag-grid table method? For more code referenceClick Here