# Import and load HTML+Js in Kibana as a visualization panel

**URL:** <https://discuss.elastic.co/t/import-and-load-html-js-in-kibana-as-a-visualization-panel/50834>\
**Category:** Kibana\
**Created:** [May 24, 2016, 11:57am UTC](https://discuss.elastic.co/t/import-and-load-html-js-in-kibana-as-a-visualization-panel/50834 "2016-05-24T11:57:55Z")\
**Posts on this page:** 9\
**Page:** 1

<div class="post-metadata">

**Author:** ![Meenal.Luktuke](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/meenal.luktuke/32/7795_2.png) [@Meenal.Luktuke](https://discuss.elastic.co/u/Meenal.Luktuke)\
**Post date:** [May 24, 2016, 11:57am UTC](https://discuss.elastic.co/t/import-and-load-html-js-in-kibana-as-a-visualization-panel/50834/1 "2016-05-24T11:57:55Z")

</div>

Hi,

I have created a JS+HTML package which interacts with Elasticsearch and displays data in the format I want. I just want to display it on my Kibana dashboard. It's okay if it does not interact with other panels, but data should be displayed as it is.

Can it be done in Kibana 4.5?

---

<div class="post-metadata">

**Author:** ![tsullivan](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/tsullivan/32/31077_2.png) [@tsullivan](https://discuss.elastic.co/u/tsullivan)\
**Post date:** [May 24, 2016, 9:42pm UTC](https://discuss.elastic.co/t/import-and-load-html-js-in-kibana-as-a-visualization-panel/50834/2 "2016-05-24T21:42:11Z")

</div>

Since there's not a way to do this in the core of Kibana right now, your best bet would be to write a custom plugin that provides a new type of visualization which renders an iframe with your external site as the src of the iframe.

Here is an example of a plugin that provides a new visType, which is along the lines of what you would have to do: [https://github.com/stormpython/tagcloud](https://github.com/stormpython/tagcloud) . Notice the `index.js` file is pretty simple, it just declares the location of the visType in `uiExports`: [https://github.com/stormpython/tagcloud/blob/master/index.js#L4](https://github.com/stormpython/tagcloud/blob/master/index.js#L4)

---

<div class="post-metadata">

**Author:** ![isaacpm](https://avatars.discourse-cdn.com/v4/letter/i/b9e5f3/32.png) [@isaacpm](https://discuss.elastic.co/u/isaacpm)\
**Post date:** [March 11, 2017, 9:25am UTC](https://discuss.elastic.co/t/import-and-load-html-js-in-kibana-as-a-visualization-panel/50834/3 "2017-03-11T09:25:33Z")

</div>

Hi,

I would be really interested in this, has this changed since?  
Or do we still need to go the custom plugin path?

Thanks,  
Isaac

---

<div class="post-metadata">

**Author:** ![tsullivan](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/tsullivan/32/31077_2.png) [@tsullivan](https://discuss.elastic.co/u/tsullivan)\
**Post date:** [March 13, 2017, 6:13pm UTC](https://discuss.elastic.co/t/import-and-load-html-js-in-kibana-as-a-visualization-panel/50834/4 "2017-03-13T18:13:41Z")

</div>

Hi Isaac,

There are a ton of new visualizations (timeseries metrics, Kibana Canvas, pipeline aggregations, a new markdown visualization that supports dynamic data) coming up in future versions of Kibana, and there'll be more information about them coming up as they get closer to release. The built-in visualizations are evolving fast in terms of what they can do in the query to Elasticsearch and how they can present the data visually.

These were all mentioned at the Elastic{ON} talks, so if you missed those in-person, stay tuned to the website as the video recordings will be re-casted.

-Tim

---

<div class="post-metadata">

**Author:** ![randy](https://avatars.discourse-cdn.com/v4/letter/r/2acd7d/32.png) [@randy](https://discuss.elastic.co/u/randy)\
**Post date:** [March 14, 2017, 2:17am UTC](https://discuss.elastic.co/t/import-and-load-html-js-in-kibana-as-a-visualization-panel/50834/5 "2017-03-14T02:17:00Z")

</div>

how am i not seeing X/Y scatterplot?

randy

---

<div class="post-metadata">

**Author:** ![isaacpm](https://avatars.discourse-cdn.com/v4/letter/i/b9e5f3/32.png) [@isaacpm](https://discuss.elastic.co/u/isaacpm)\
**Post date:** [May 23, 2017, 1:18pm UTC](https://discuss.elastic.co/t/import-and-load-html-js-in-kibana-as-a-visualization-panel/50834/6 "2017-05-23T13:18:25Z")

</div>

Hi Tim,

sorry for the late reply, I totally missed this.  
And actually saw the new visualisations in kibana last week, they look awesome 🙂

Cheers,  
Isaac

---

<div class="post-metadata">

**Author:** ![Chandru1429](https://avatars.discourse-cdn.com/v4/letter/c/f05b48/32.png) [@Chandru1429](https://discuss.elastic.co/u/Chandru1429)\
**Post date:** [July 5, 2017, 4:29am UTC](https://discuss.elastic.co/t/import-and-load-html-js-in-kibana-as-a-visualization-panel/50834/7 "2017-07-05T04:29:52Z")

</div>

HI how to load external js plugins inside kibana ?  
I need to inject 'angular-md5' module inside kibana for authentication

---

<div class="post-metadata">

**Author:** ![Renison](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/renison/32/97606_2.png) [@Renison](https://discuss.elastic.co/u/Renison)\
**Post date:** [November 30, 2021, 5:03pm UTC](https://discuss.elastic.co/t/import-and-load-html-js-in-kibana-as-a-visualization-panel/50834/8 "2021-11-30T17:03:25Z")

</div>

Did you ever get this to work using an existing visualization or by creating a custom plugin? I am interested in doing something like this and want to know what my options are.

---

<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:** [November 4, 2022, 4:21am UTC](https://discuss.elastic.co/t/import-and-load-html-js-in-kibana-as-a-visualization-panel/50834/9 "2022-11-04T04:21:14Z")

</div>


