# How to add custom javascript (js) to timelion

**URL:** <https://discuss.elastic.co/t/how-to-add-custom-javascript-js-to-timelion/41525>\
**Category:** Kibana\
**Tags:** timelion\
**Created:** [February 11, 2016, 5:04pm UTC](https://discuss.elastic.co/t/how-to-add-custom-javascript-js-to-timelion/41525 "2016-02-11T17:04:39Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![Sandeep\_Takhar](https://avatars.discourse-cdn.com/v4/letter/s/a6a055/32.png) [@Sandeep\_Takhar](https://discuss.elastic.co/u/Sandeep_Takhar)\
**Post date:** [February 11, 2016, 5:04pm UTC](https://discuss.elastic.co/t/how-to-add-custom-javascript-js-to-timelion/41525/1 "2016-02-11T17:04:39Z")

</div>

Zach has written a really cool article, but we get an exception trying to follow his steps. Unfortunately the server guy has removed the exception..and I'll try and comment on this post, but is this really the way to add custom js?

The custom movingstd() and showifgreater() Timelion functions can be found here. Shut down Kibana, add the functions to your Timelion source (kibana/installedPlugins/timelion/series\_functions/\<function\_name\>.js), delete the optimized bundle (rm kibana/optimize/bundles/timelion.bundle.js) and restart Kibana. The functions should be available for use in Timelion now.

> <https://gist.github.com/polyfractal/5c584f515c4dbd2d5a8f>

---

<div class="post-metadata">

**Author:** ![Joe\_Fleming](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/joe_fleming/32/3561_2.png) [@Joe\_Fleming](https://discuss.elastic.co/u/Joe_Fleming)\
**Post date:** [February 11, 2016, 6:38pm UTC](https://discuss.elastic.co/t/how-to-add-custom-javascript-js-to-timelion/41525/2 "2016-02-11T18:38:06Z")

</div>

> is this really the way to add custom js?

Yes, it is.

I'm not totally sure you need to remove the optimized bundle, but it does need to run a rebuild, and removing the bundle is a sure-fire way to achieve that.

For what it's worth, it looks like the movingstd stuff has been [merged into master](https://github.com/elastic/timelion/pull/35).

---

<div class="post-metadata">

**Author:** ![Sandeep\_Takhar](https://avatars.discourse-cdn.com/v4/letter/s/a6a055/32.png) [@Sandeep\_Takhar](https://discuss.elastic.co/u/Sandeep_Takhar)\
**Post date:** [February 11, 2016, 6:44pm UTC](https://discuss.elastic.co/t/how-to-add-custom-javascript-js-to-timelion/41525/3 "2016-02-11T18:44:08Z")

</div>

Thanks..will try again.

---

<div class="post-metadata">

**Author:** ![tisage](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/tisage/32/7846_2.png) [@tisage](https://discuss.elastic.co/u/tisage)\
**Post date:** [April 22, 2016, 3:25pm UTC](https://discuss.elastic.co/t/how-to-add-custom-javascript-js-to-timelion/41525/4 "2016-04-22T15:25:10Z")

</div>

I got the same problem.  
After adding a custom js function to timelion and remove timelion.bundle.js I restarted Kibana but got stuck at loading interface in Kibana.

Is there any way to rebuild optimize bundle appropriately?  
Why my Kibana stuck at loading interface?

Thanks

---

<div class="post-metadata">

**Author:** ![Sandeep\_Takhar](https://avatars.discourse-cdn.com/v4/letter/s/a6a055/32.png) [@Sandeep\_Takhar](https://discuss.elastic.co/u/Sandeep_Takhar)\
**Post date:** [April 22, 2016, 3:37pm UTC](https://discuss.elastic.co/t/how-to-add-custom-javascript-js-to-timelion/41525/5 "2016-04-22T15:37:53Z")

</div>

We followed the steps posted and it worked the second time. However I did not do it so I'm not sure what the difference was. I asked the timelion creator and he says that for sure it's the right steps.

---

<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:** [July 6, 2017, 1:55pm UTC](https://discuss.elastic.co/t/how-to-add-custom-javascript-js-to-timelion/41525/6 "2017-07-06T13:55:20Z")

</div>


