# Show timeline information in Canvas

**URL:** <https://discuss.elastic.co/t/show-timeline-information-in-canvas/207769>\
**Category:** Kibana\
**Tags:** canvas\
**Created:** [November 13, 2019, 8:09pm UTC](https://discuss.elastic.co/t/show-timeline-information-in-canvas/207769 "2019-11-13T20:09:04Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![clarissacastella](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/clarissacastella/32/56043_2.png) [@clarissacastella](https://discuss.elastic.co/u/clarissacastella)\
**Post date:** [November 13, 2019, 8:09pm UTC](https://discuss.elastic.co/t/show-timeline-information-in-canvas/207769/1 "2019-11-13T20:09:04Z")

</div>

Hi! I'm creating a visualization in Canvas and I need to show a queue timeline like the one in the upper right corner of this image:

 ![](https://us1.discourse-cdn.com/elastic/original/3X/2/7/27cd810d70b98b93eb4bf18b957bb2c2c62c301a.gif)

It is important that where one line ends the other starts. I want to show time from task 1 to task 2, from task 2 to task 3, and so on.

The image source is [https://www.elastic.co/en/blog/monitoring-airport-security-operations-with-canvas-and-elasticsearch](https://www.elastic.co/en/blog/monitoring-airport-security-operations-with-canvas-and-elasticsearch)

They do not explain which element they used and/or how.

---

<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:** [November 14, 2019, 10:11pm UTC](https://discuss.elastic.co/t/show-timeline-information-in-canvas/207769/2 "2019-11-14T22:11:01Z")

</div>

> [@clarissacastella](#):
>
> e line ends the other starts. I want to show time from task 1 to task 2, from task 2 to task 3, and s

This looks like an enhancement request to me , as the images are in continuation. I tried a bit , but I thought that this might be an enhancement request ..but I will tag @tims /@Catherine_Liu for more inputs.

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:** [November 14, 2019, 10:20pm UTC](https://discuss.elastic.co/t/show-timeline-information-in-canvas/207769/3 "2019-11-14T22:20:40Z")

</div>

Hi @clarissacastella, this particular demo uses a plugin to enable html within canvas elements, here is the github repo: [https://github.com/crimsonmacaw/nodejs-canvas-plugin-html](https://github.com/crimsonmacaw/nodejs-canvas-plugin-html)

We can't enable this plugin natively for security reasons but if you are running your own kibana instance you can add it and build Canvas elements with html. This is not officially supported by Elastic though.

---

<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:** [December 12, 2019, 10:20pm UTC](https://discuss.elastic.co/t/show-timeline-information-in-canvas/207769/4 "2019-12-12T22:20:46Z")

</div>

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