# JavaScript

**URL:** <https://discuss.elastic.co/t/javascript/257561>\
**Category:** Kibana\
**Created:** [December 3, 2020, 5:54pm UTC](https://discuss.elastic.co/t/javascript/257561 "2020-12-03T17:54:56Z")\
**Posts on this page:** 13\
**Page:** 1

<div class="post-metadata">

**Author:** ![ravishka](https://avatars.discourse-cdn.com/v4/letter/r/3da27b/32.png) [@ravishka](https://discuss.elastic.co/u/ravishka)\
**Post date:** [December 3, 2020, 5:54pm UTC](https://discuss.elastic.co/t/javascript/257561/1 "2020-12-03T17:54:56Z")

</div>

Can I put Javascript code or library on the kibana canvas?

---

<div class="post-metadata">

**Author:** ![aaron-nimocks](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/aaron-nimocks/32/73965_2.png) [@aaron-nimocks](https://discuss.elastic.co/u/aaron-nimocks)\
**Post date:** [December 3, 2020, 6:03pm UTC](https://discuss.elastic.co/t/javascript/257561/2 "2020-12-03T18:03:36Z")

</div>

Negative.

What are you trying to do though? Might be another way.

---

<div class="post-metadata">

**Author:** ![ravishka](https://avatars.discourse-cdn.com/v4/letter/r/3da27b/32.png) [@ravishka](https://discuss.elastic.co/u/ravishka)\
**Post date:** [December 3, 2020, 6:25pm UTC](https://discuss.elastic.co/t/javascript/257561/3 "2020-12-03T18:25:11Z")

</div>

I want to try and see if the drilldown concept can be used on the kibana canvas?  
@aaron-nimocks

---

<div class="post-metadata">

**Author:** ![aaron-nimocks](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/aaron-nimocks/32/73965_2.png) [@aaron-nimocks](https://discuss.elastic.co/u/aaron-nimocks)\
**Post date:** [December 3, 2020, 7:08pm UTC](https://discuss.elastic.co/t/javascript/257561/4 "2020-12-03T19:08:52Z")

</div>

@ravishka I think they are working on that functionality and not sure when it will be released.

But if you are in need of an immediate solution what I have done in the past is used Canvas a presentation layer that had links to a dashboard and passed in the filter data. This was a way to mimic drilling down into underlying data.

It is a little clunky swapping from a Canvas view to a Dashboard view and then back to Canvas if you include a link to return back. That was the only way I could figure out how to do it at the time though.

---

<div class="post-metadata">

**Author:** ![ravishka](https://avatars.discourse-cdn.com/v4/letter/r/3da27b/32.png) [@ravishka](https://discuss.elastic.co/u/ravishka)\
**Post date:** [December 3, 2020, 7:12pm UTC](https://discuss.elastic.co/t/javascript/257561/5 "2020-12-03T19:12:04Z")

</div>

ok thanks @aaron-nimocks

---

<div class="post-metadata">

**Author:** ![ravishka](https://avatars.discourse-cdn.com/v4/letter/r/3da27b/32.png) [@ravishka](https://discuss.elastic.co/u/ravishka)\
**Post date:** [December 4, 2020, 5:57am UTC](https://discuss.elastic.co/t/javascript/257561/6 "2020-12-04T05:57:40Z")

</div>

@aaron-nimocks Thank you very much for replaying my question.  
You said "Canvas a presentation layer that had links to a dashboard and passed in the filter data" Can you please explain how to do this?  
You have any Guidance link/vedio?

---

<div class="post-metadata">

**Author:** ![aaron-nimocks](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/aaron-nimocks/32/73965_2.png) [@aaron-nimocks](https://discuss.elastic.co/u/aaron-nimocks)\
**Post date:** [December 4, 2020, 2:00pm UTC](https://discuss.elastic.co/t/javascript/257561/7 "2020-12-04T14:00:37Z")

</div>

I don't know of any tutorials for this but here is the concept using the data that comes with Elastic.

Here is your dashboard.

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

This is where all your drilldown data will be in the way you want to show it. We are going to use `categories` as the example. Notice I have `Men's Shoes` filtered already. On your Canvas you could have a link in the form of a text or image for each of the categories. When you click those links you would go to the Dashboard with that category already filtered.

To do that you would click `Share` -\> `Permalink` -\> `Snapshot` -\> `Copy Link`

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

This will give you a really long URL that contains parameters for everything on this page to include every visualization and the location of them.

`http://localhost:5603/kwv/app/dashboards#/view/722b74f0-b882-11e8-a6d9-e546fe2bba5f?_g=(filters:!(),refreshInterval:(pause:!f,value:900000),time:(from:now-7d,to:now))&_a=(description:'Analyze%20mock%20eCommerce%20orders%20and%20revenue',filters:!(('$state':(store:appState),meta:(alias:!n,controlledBy:'1536977465554',disabled:!f,index:ff959d40-b880-11e8-a6d9-e546fe2bba5f,key:category.keyword,negate:!f,params:(query:'Men!'s%20Shoes'),type:phrase),query:(match_phrase:(category.keyword:'Men!'s%20Shoes')))),fullScreenMode:!f,options:(hidePanelTitles:!f,useMargins:!t),query:(language:kuery,query:''),timeRestore:!t,title:'%5BeCommerce%5D%20Revenue%20Dashboard',viewMode:view)`

You can just copy/paste those into Canvas for a direct link to that Dashboard now. Notice the in the URL you see `'Men!'s%20Shoes'` which really you can just replace with each category you want to generate a link for.

That's it.

---

<div class="post-metadata">

**Author:** ![ravishka](https://avatars.discourse-cdn.com/v4/letter/r/3da27b/32.png) [@ravishka](https://discuss.elastic.co/u/ravishka)\
**Post date:** [December 5, 2020, 3:14am UTC](https://discuss.elastic.co/t/javascript/257561/8 "2020-12-05T03:14:16Z")

</div>

@aaron-nimocks Thank you very much for your explanation. I'll try it. Thanks again.

---

<div class="post-metadata">

**Author:** ![ravishka](https://avatars.discourse-cdn.com/v4/letter/r/3da27b/32.png) [@ravishka](https://discuss.elastic.co/u/ravishka)\
**Post date:** [December 13, 2020, 6:11am UTC](https://discuss.elastic.co/t/javascript/257561/9 "2020-12-13T06:11:08Z")

</div>

@aaron-nimocks Is there a way to put a toggle button on the kibana canvas? Is there any alternative solution?

---

<div class="post-metadata">

**Author:** ![aaron-nimocks](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/aaron-nimocks/32/73965_2.png) [@aaron-nimocks](https://discuss.elastic.co/u/aaron-nimocks)\
**Post date:** [December 13, 2020, 2:43pm UTC](https://discuss.elastic.co/t/javascript/257561/10 "2020-12-13T14:43:41Z")

</div>

Not that I can think of. But that doesn't mean there isn't one.

---

<div class="post-metadata">

**Author:** ![ravishka](https://avatars.discourse-cdn.com/v4/letter/r/3da27b/32.png) [@ravishka](https://discuss.elastic.co/u/ravishka)\
**Post date:** [December 23, 2020, 3:05am UTC](https://discuss.elastic.co/t/javascript/257561/11 "2020-12-23T03:05:22Z")

</div>

@aaron-nimocks I want to put toggle button on the canvas and click on it and the data should be filterd. Just like dashboard.Simply onece I click the button I want to get all canvas data should be fillterd.Is it possible? or can you provide alternative solution for me?

---

<div class="post-metadata">

**Author:** ![aaron-nimocks](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/aaron-nimocks/32/73965_2.png) [@aaron-nimocks](https://discuss.elastic.co/u/aaron-nimocks)\
**Post date:** [December 23, 2020, 1:53pm UTC](https://discuss.elastic.co/t/javascript/257561/12 "2020-12-23T13:53:48Z")

</div>

Sorry but this just isn't possible I believe.

If you need more customization there is always [Vega](https://www.elastic.co/guide/en/kibana/7.10/vega-reference.html) or creating your own [Kibana Plugin](https://www.elastic.co/guide/en/kibana/current/development.html).

---

<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:** [January 20, 2021, 1:53pm UTC](https://discuss.elastic.co/t/javascript/257561/13 "2021-01-20T13:53:49Z")

</div>

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