# How to display data in Metric element?

**URL:** <https://discuss.elastic.co/t/how-to-display-data-in-metric-element/218925>\
**Category:** Kibana\
**Tags:** canvas\
**Created:** [February 12, 2020, 8:32am UTC](https://discuss.elastic.co/t/how-to-display-data-in-metric-element/218925 "2020-02-12T08:32:34Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![shawn\_sun](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/shawn_sun/32/72735_2.png) [@shawn\_sun](https://discuss.elastic.co/u/shawn_sun)\
**Post date:** [February 12, 2020, 8:32am UTC](https://discuss.elastic.co/t/how-to-display-data-in-metric-element/218925/1 "2020-02-12T08:32:34Z")

</div>

This is my first time use canvas , I think my question is simple.

I wana to display a result in Metric element ， the result can preview in data sheet just like the picture below

 ![image](https://us1.discourse-cdn.com/elastic/original/3X/c/4/c4e6e1d8f1ad3f19adf0f218395c74150fe04a9b.png)  
But the same result can't display in the Metric element, as the picture show:  
 ![image](https://us1.discourse-cdn.com/elastic/original/3X/1/f/1fd514e324b79b0a28e9f16f3ae2c41202ced0ed.png)  
below is the Expression editor code :  
filters  
| essql query="SELECT SUM(UnBlendedCost) as TotalCost FROM "billing\*""  
| math "TotalCost"  
| metric "Total Cost"  
metricFont={font family="'Open Sans', Helvetica, Arial, sans-serif" size=48 align="center" color="#000000" weight="normal" underline=false italic=false}  
labelFont={font size=14 family="'Open Sans', Helvetica, Arial, sans-serif" color="#000000" align="center"}  
| render  
containerStyle={containerStyle backgroundColor="rgba(255,255,255,0)" border="3px none " borderRadius="1px"}

I don't know what the problem is, If anyone can help me, Thank you

---

<div class="post-metadata">

**Author:** ![flash1293](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/flash1293/32/41227_2.png) [@flash1293](https://discuss.elastic.co/u/flash1293)\
**Post date:** [February 12, 2020, 11:21am UTC](https://discuss.elastic.co/t/how-to-display-data-in-metric-element/218925/2 "2020-02-12T11:21:28Z")

</div>

Hi @shawn_sun,

your code looks fine to me (besides unescaped double quotes in the sql query, but that was probably caused by copy/pasting it here). Do you have a filters component on the same page that could interfere with data fetching?

If not could you paste the result of the following expression? This will show the value passed down from the query

```auto
filters
| essql query="SELECT SUM(UnBlendedCost) as TotalCost FROM \"billing*\""
| math "TotalCost"
| metric "Total Cost"
metricFont={font family="'Open Sans', Helvetica, Arial, sans-serif" size=48 align="center" color="#000000" weight="normal" underline=false italic=false}
labelFont={font size=14 family="'Open Sans', Helvetica, Arial, sans-serif" color="#000000" align="center"}
| render as=debug

```

Just to make sure the data fetching works correctly please also paste the result of this expression

```auto
filters
| essql query="SELECT SUM(UnBlendedCost) as TotalCost FROM \"billing*\""
| render as=debug

```

---

<div class="post-metadata">

**Author:** ![shawn\_sun](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/shawn_sun/32/72735_2.png) [@shawn\_sun](https://discuss.elastic.co/u/shawn_sun)\
**Post date:** [February 13, 2020, 8:47am UTC](https://discuss.elastic.co/t/how-to-display-data-in-metric-element/218925/3 "2020-02-13T08:47:42Z")

</div>

Hi, @flash1293  
Yeah , I have a time filter component on my workpad. When I remove the time filter, the result can display. Thanks very much.  
Here is new exception , When I add the time filter, other elemet on the workpad will except a exception message like the picture below:

 ![image](https://us1.discourse-cdn.com/elastic/original/3X/f/7/f7c24d8c0fb064db17d59fa3e2d6f3c9da4bd12d.png)  
I think it's my mapping doesn't match the canvas dataformat . I can't modify the @timestamp's format. Is there any other way to fix this exception ?

---

<div class="post-metadata">

**Author:** ![flash1293](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/flash1293/32/41227_2.png) [@flash1293](https://discuss.elastic.co/u/flash1293)\
**Post date:** [February 13, 2020, 8:56am UTC](https://discuss.elastic.co/t/how-to-display-data-in-metric-element/218925/4 "2020-02-13T08:56:34Z")

</div>

There is currently no way to fix this - that's definitely a bug. Would you mind reporting this problem by creating an issue in the [Github repository](https://github.com/elastic/kibana/issues/new?template=Bug_report.md)?

---

<div class="post-metadata">

**Author:** ![shawn\_sun](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/shawn_sun/32/72735_2.png) [@shawn\_sun](https://discuss.elastic.co/u/shawn_sun)\
**Post date:** [February 13, 2020, 9:05am UTC](https://discuss.elastic.co/t/how-to-display-data-in-metric-element/218925/5 "2020-02-13T09:05:19Z")

</div>

It's no problem, I will submit this issue in Github and I hope it can fixed as soon as possible. Thanks very much.

---

<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:** [March 12, 2020, 9:05am UTC](https://discuss.elastic.co/t/how-to-display-data-in-metric-element/218925/6 "2020-03-12T09:05:20Z")

</div>

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