# How conditionally set color to the cell text in Data Table

**URL:** <https://discuss.elastic.co/t/how-conditionally-set-color-to-the-cell-text-in-data-table/203484>\
**Category:** Kibana\
**Tags:** canvas\
**Created:** [October 14, 2019, 3:31pm UTC](https://discuss.elastic.co/t/how-conditionally-set-color-to-the-cell-text-in-data-table/203484 "2019-10-14T15:31:50Z")\
**Posts on this page:** 7\
**Page:** 1

<div class="post-metadata">

**Author:** ![bkleynbok](https://avatars.discourse-cdn.com/v4/letter/b/d2c977/32.png) [@bkleynbok](https://discuss.elastic.co/u/bkleynbok)\
**Post date:** [October 14, 2019, 3:31pm UTC](https://discuss.elastic.co/t/how-conditionally-set-color-to-the-cell-text-in-data-table/203484/1 "2019-10-14T15:31:50Z")

</div>

I am using ELK Stack 7.3.2

I have a Data Table in Canvas.

Here is my query:  
SELECT "@timestamp" as time, hostname, status, vm, latency FROM "boris-topic\*"  
where hostname is not null  
order by time desc

Here is my table.

 ![image](https://us1.discourse-cdn.com/elastic/original/3X/3/8/38c8bb8e7e246a35e1e392daf73a8b7b04c3f148.png)

I want to color Up/Down based on state change.

Please advise.

---

<div class="post-metadata">

**Author:** ![rashmi](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/rashmi/32/16391_2.png) [@rashmi](https://discuss.elastic.co/u/rashmi)\
**Post date:** [October 15, 2019, 5:26am UTC](https://discuss.elastic.co/t/how-conditionally-set-color-to-the-cell-text-in-data-table/203484/2 "2019-10-15T05:26:30Z")

</div>

Hi,  
Conditional per-field coloring can be achieved via the field formatters. coloring the full row is not supported right now. Maybe looking at [the source](https://github.com/elastic/kibana/blob/3eeecb73818ff873aedcbf02f2d1ccc921098428/src/ui/public/stringify/types/color.js) of the color field formatter can give you an inspiration for your data table. I don't think that formatting one field depending on the value of another is easily implementable right now though.

Thanks  
Rashmi

---

<div class="post-metadata">

**Author:** ![bkleynbok](https://avatars.discourse-cdn.com/v4/letter/b/d2c977/32.png) [@bkleynbok](https://discuss.elastic.co/u/bkleynbok)\
**Post date:** [October 21, 2019, 7:27pm UTC](https://discuss.elastic.co/t/how-conditionally-set-color-to-the-cell-text-in-data-table/203484/3 "2019-10-21T19:27:25Z")

</div>

Can you please show me an example of conditional field coloring in Canvas Data Table.

---

<div class="post-metadata">

**Author:** ![bkleynbok](https://avatars.discourse-cdn.com/v4/letter/b/d2c977/32.png) [@bkleynbok](https://discuss.elastic.co/u/bkleynbok)\
**Post date:** [October 23, 2019, 2:48pm UTC](https://discuss.elastic.co/t/how-conditionally-set-color-to-the-cell-text-in-data-table/203484/4 "2019-10-23T14:48:02Z")

</div>

![image](https://us1.discourse-cdn.com/elastic/original/3X/d/3/d317fe1b60fb5244f9d89d3c052044dc8998d8d6.png)

filters  
| essql  
query="SELECT processName, processType, hostname, status, "@timestamp" as time FROM "boris-index" "  
| mapColumn "value"  
fn={getCell "status" | switch {case if={compare "eq" to="UP"} then="Healthy"} {case if={compare "eq" to="DOWN"} then="Unhealthy"} default="Unknown"}  
| table showHeader=true  
font={font family="'Open Sans', Helvetica, Arial, sans-serif" size=18 align="left" color="#000000" weight="bold" underline=false italic=false}  
| render

Is there a decent way to color value text or background using mapColumn or get Cell?

---

<div class="post-metadata">

**Author:** ![rashmi](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/rashmi/32/16391_2.png) [@rashmi](https://discuss.elastic.co/u/rashmi)\
**Post date:** [October 23, 2019, 10:47pm UTC](https://discuss.elastic.co/t/how-conditionally-set-color-to-the-cell-text-in-data-table/203484/5 "2019-10-23T22:47:54Z")

</div>

@tims - can u provide some insight here?

Thanks  
Rashmi

---

<div class="post-metadata">

**Author:** ![tims](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/tims/32/46750_2.png) [@tims](https://discuss.elastic.co/u/tims)\
**Post date:** [October 24, 2019, 2:50pm UTC](https://discuss.elastic.co/t/how-conditionally-set-color-to-the-cell-text-in-data-table/203484/6 "2019-10-24T14:50:59Z")

</div>

Hi @bkleynbok, unfortunately, conditional coloring at the row or cell level inside of a datatable is not possible right now in Canvas. We have an open issue for this here: [https://github.com/elastic/kibana/issues/27700](https://github.com/elastic/kibana/issues/27700)

---

<div class="post-metadata">

**Author:** ![system](https://us1.discourse-cdn.com/elastic/original/3X/1/a/1ac57faf039f6b580b3f104ef42a2a89e41014de.png) [@system](https://discuss.elastic.co/u/system)\
**Post date:** [November 21, 2019, 2:50pm UTC](https://discuss.elastic.co/t/how-conditionally-set-color-to-the-cell-text-in-data-table/203484/7 "2019-11-21T14:50:59Z")

</div>

This topic was automatically closed 28 days after the last reply. New replies are no longer allowed.