# About kibana exporting as an iframe

**URL:** <https://discuss.elastic.co/t/about-kibana-exporting-as-an-iframe/190413>\
**Category:** Kibana\
**Created:** [July 15, 2019, 3:38am UTC](https://discuss.elastic.co/t/about-kibana-exporting-as-an-iframe/190413 "2019-07-15T03:38:39Z")\
**Posts on this page:** 8\
**Page:** 1

<div class="post-metadata">

**Author:** ![111178](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/111178/32/50105_2.png) [@111178](https://discuss.elastic.co/u/111178)\
**Post date:** [July 15, 2019, 3:38am UTC](https://discuss.elastic.co/t/about-kibana-exporting-as-an-iframe/190413/1 "2019-07-15T03:38:40Z")

</div>

After exporting kibana's dashboard as an iframe，how to disable click events related to charts? To prevent the relevant date interval from being arbitrarily changed.

---

<div class="post-metadata">

**Author:** ![tiagocosta](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/tiagocosta/32/40045_2.png) [@tiagocosta](https://discuss.elastic.co/u/tiagocosta)\
**Post date:** [July 15, 2019, 2:36pm UTC](https://discuss.elastic.co/t/about-kibana-exporting-as-an-iframe/190413/2 "2019-07-15T14:36:36Z")

</div>

@111178 is your dashboard iframe being loaded with the url param `?embed=true` ? It disable some controls for when we are in the embed mode.

However if that didn't solved your problem, one thing that also occur to me is that you can achieve it through the css maybe:

Applying `pointer-events: none` to the iframe element and also `width` and `height` property to draw the iframe completely and then an `overflow: scroll` your desired `width` and `height` in the parent element containing the iframe .

---

<div class="post-metadata">

**Author:** ![111178](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/111178/32/50105_2.png) [@111178](https://discuss.elastic.co/u/111178)\
**Post date:** [July 16, 2019, 1:50am UTC](https://discuss.elastic.co/t/about-kibana-exporting-as-an-iframe/190413/3 "2019-07-16T01:50:01Z")

</div>

Thank you very much . The url already contains "?Embed = true",I'm going to try to do that by controlling CSS.However,since I have nested the iframe into the vue, I am not yet able to retrieve the elements in the iframe.Next I will try to solve this problem, and I would be grateful if you could give me some advice

---

<div class="post-metadata">

**Author:** ![tiagocosta](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/tiagocosta/32/40045_2.png) [@tiagocosta](https://discuss.elastic.co/u/tiagocosta)\
**Post date:** [July 16, 2019, 3:16pm UTC](https://discuss.elastic.co/t/about-kibana-exporting-as-an-iframe/190413/4 "2019-07-16T15:16:16Z")

</div>

@111178 I'm not sure if I followed your last question. You just need to apply css in the vue iframe element and to the vue element which is parent of the vue iframe, so both would be "visible". Am I missing something here?

---

<div class="post-metadata">

**Author:** ![111178](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/111178/32/50105_2.png) [@111178](https://discuss.elastic.co/u/111178)\
**Post date:** [July 17, 2019, 1:05am UTC](https://discuss.elastic.co/t/about-kibana-exporting-as-an-iframe/190413/5 "2019-07-17T01:05:23Z")

</div>

Maybe there is something wrong with my method. I failed in vue's mounted lifecycle function to get the elements in the iframe.I'll try your way. Thank you.

Now,I succeeded in disabling all the functions, but I only wanted to disable the click events on the chart, not all the events.I disable all the methods first and try to restore the hover event.

---

<div class="post-metadata">

**Author:** ![tiagocosta](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/tiagocosta/32/40045_2.png) [@tiagocosta](https://discuss.elastic.co/u/tiagocosta)\
**Post date:** [July 17, 2019, 3:20am UTC](https://discuss.elastic.co/t/about-kibana-exporting-as-an-iframe/190413/6 "2019-07-17T03:20:01Z")

</div>

@111178 I see

Maybe you can try to use the `contents` from jQuery [https://api.jquery.com/contents/](https://api.jquery.com/contents/)

something close to:

```auto
const iframeContents = $(...).contents().click((event) => {
  event.preventDefault();
  return false;
});

```

---

<div class="post-metadata">

**Author:** ![111178](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/111178/32/50105_2.png) [@111178](https://discuss.elastic.co/u/111178)\
**Post date:** [July 17, 2019, 3:26am UTC](https://discuss.elastic.co/t/about-kibana-exporting-as-an-iframe/190413/7 "2019-07-17T03:26:14Z")

</div>

Thankyou very much. I'll try it. I think my problem will be solved

---

<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:** [August 14, 2019, 3:26am UTC](https://discuss.elastic.co/t/about-kibana-exporting-as-an-iframe/190413/8 "2019-08-14T03:26:15Z")

</div>

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