# Shape issue in Canvas

**URL:** <https://discuss.elastic.co/t/shape-issue-in-canvas/374013>\
**Category:** Kibana\
**Tags:** canvas\
**Created:** [February 3, 2025, 12:15pm UTC](https://discuss.elastic.co/t/shape-issue-in-canvas/374013 "2025-02-03T12:15:34Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![MattiHatem](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/mattihatem/32/141032_2.png) [@MattiHatem](https://discuss.elastic.co/u/MattiHatem)\
**Post date:** [February 3, 2025, 12:15pm UTC](https://discuss.elastic.co/t/shape-issue-in-canvas/374013/1 "2025-02-03T12:15:34Z")

</div>

the below is giving me the following error ([if] \> [gte] \> Can not cast 'shape' to any of 'number, string'), I have tried the switch case but also didn't work, can anyone help me please

```auto
filters
| essql 
  query="SELECT COUNT(*) as count FROM \"event*\" WHERE message.statusName='Confirmed' AND message.affiliateName='xyz'AND environment.keyword='Production' AND \"@timestamp\" > NOW() - INTERVAL 1 HOUR"
| math "count"
| if condition={lte 2} then={shape shape="square" fill="Red" border="rgba(255,255,255,0)" borderWidth=3 maintainAspect=true}
| if condition={gte 2} && {lte 4} then={shape shape="square" fill="Yellow" border="rgba(255,255,255,0)" borderWidth=3 maintainAspect=true}
| if condition={gte 5} then={shape shape="square" fill="Green" border="rgba(255,255,255,0)" borderWidth=3 maintainAspect=true}
| render

```

---

<div class="post-metadata">

**Author:** ![jsanz](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/jsanz/32/53734_2.png) [@jsanz](https://discuss.elastic.co/u/jsanz)\
**Post date:** [February 3, 2025, 3:19pm UTC](https://discuss.elastic.co/t/shape-issue-in-canvas/374013/2 "2025-02-03T15:19:30Z")

</div>

With multiple conditions a `switch` statement is required. This expression worked for me to play with a value and shape colors

```auto
kibana 
| selectFilter 
| essql query="select 5 as count"
| math expression="count"
| switch 
    {case if={lte 0} then={shape shape="square" fill="Red"}}
    {case if={all {gt 0} {lte 1}} then={shape shape="square" fill="Blue"}}
    default={shape shape="square" fill="Green"}
| render 

```

Change that static value in the ESSQL expression to see how colors go from red, to blue, to green.

Hope it helps.
