# Add pluguin with existing visualization to add modification kibana 5.4.x

**URL:** <https://discuss.elastic.co/t/add-pluguin-with-existing-visualization-to-add-modification-kibana-5-4-x/116458>\
**Category:** Kibana\
**Created:** [January 22, 2018, 9:53am UTC](https://discuss.elastic.co/t/add-pluguin-with-existing-visualization-to-add-modification-kibana-5-4-x/116458 "2018-01-22T09:53:42Z")\
**Posts on this page:** 14\
**Page:** 1

<div class="post-metadata">

**Author:** ![radi](https://avatars.discourse-cdn.com/v4/letter/r/4491bb/32.png) [@radi](https://discuss.elastic.co/u/radi)\
**Post date:** [January 22, 2018, 9:53am UTC](https://discuss.elastic.co/t/add-pluguin-with-existing-visualization-to-add-modification-kibana-5-4-x/116458/1 "2018-01-22T09:53:43Z")

</div>

Hi,  
I am using kibana 5.4.0  
I find that's its possible to add pluguin using existing visualization and add modification in kibana 6.x.

what i need it's for kibana 5.4.x, change to add in basic chart ( pie and vertical bar )

It's possible for kibana 5.4.x using existing visualization in pluguin or i need to duplicate the code, and modify tiny bits of it to fit the need of the new plugin ??

anyone have sample files for visualization development for version 5.4.x using existing visualization or a docuementation who helps me ?

@spalger, @LeeDr ,  
hi, @vincentforiter you have ask this for version 5.2 , have you please some clarifications for me ? how you did for your data table modification ?

Thank's for all,

Radi

---

<div class="post-metadata">

**Author:** ![Brandon\_Kobel](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/brandon_kobel/32/14829_2.png) [@Brandon\_Kobel](https://discuss.elastic.co/u/Brandon_Kobel)\
**Post date:** [January 22, 2018, 7:44pm UTC](https://discuss.elastic.co/t/add-pluguin-with-existing-visualization-to-add-modification-kibana-5-4-x/116458/2 "2018-01-22T19:44:40Z")

</div>

@radi there isn't a way to customize existing Visualizations using a plugin. If the modification that you're looking for is applicable to a wide-number of users, opening up an enhancement request [here](https://github.com/elastic/kibana/issues/new) will let us gauge the interest and prioritize it appropriately.

If you want to write your own Visualization plugin, [this blog post series](https://www.timroes.de/2015/12/02/writing-kibana-4-plugins-basics/) is a good place to start, and there's a more updated [webinar](https://www.elastic.co/webinars/creating-custom-kibana-visualizations) covering these same topics

---

<div class="post-metadata">

**Author:** ![radi](https://avatars.discourse-cdn.com/v4/letter/r/4491bb/32.png) [@radi](https://discuss.elastic.co/u/radi)\
**Post date:** [January 22, 2018, 8:46pm UTC](https://discuss.elastic.co/t/add-pluguin-with-existing-visualization-to-add-modification-kibana-5-4-x/116458/3 "2018-01-22T20:46:26Z")

</div>

> [@Brandon\_Kobel](#):
>
> there isn't a way to customize existing Visualizations using a plugin. If the modification that you're looking for is applicable to a wide-number of users, opening up an enhancement request here will let us gauge the interest and prioritize it appropriately.
> 
> If you want to write your own Visualization plugin, this blog post series is a good place to start, and there's a more updated webinar covering these same topics

HI @Brandon_Kobel, thank's for your replay,  
when you say : there isn't a way to customize existing Visualizations using a plugin!

you mean i can't use duplicate code of visulaization pie for example, and modify tiny bits of it to fit the need of the new plugin ??  
(add code of visualization pie in new pluguin with new options )

for webinar I've seen this before, but unfortunately I'm on version 5.4 and its anly support in version 6. X

---

<div class="post-metadata">

**Author:** ![Brandon\_Kobel](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/brandon_kobel/32/14829_2.png) [@Brandon\_Kobel](https://discuss.elastic.co/u/Brandon_Kobel)\
**Post date:** [January 22, 2018, 9:04pm UTC](https://discuss.elastic.co/t/add-pluguin-with-existing-visualization-to-add-modification-kibana-5-4-x/116458/4 "2018-01-22T21:04:25Z")

</div>

@radi it's technically possible for you to duplicate the code from an existing Visualization and modify it for your use-case, you just can't override certain behaviors without a large amount of code duplication.

I'm not aware of any guides specifically targeted at version 5.4, so you'll likely need to use the existing guides as a starting point and look at the code specifically in 5.4 to figure out the differences.

---

<div class="post-metadata">

**Author:** ![radi](https://avatars.discourse-cdn.com/v4/letter/r/4491bb/32.png) [@radi](https://discuss.elastic.co/u/radi)\
**Post date:** [January 23, 2018, 11:24am UTC](https://discuss.elastic.co/t/add-pluguin-with-existing-visualization-to-add-modification-kibana-5-4-x/116458/5 "2018-01-23T11:24:56Z")

</div>

hi @Brandon_Kobel, i duplicate code of pie visulaization but when i run npm start in localhost i have loading page after i have this error :  
Kibana did not load properly. Check the server output for more information.

and console log :

kibana:181 GET [https://localhost:5601/khq/bundles/kibana.style.css?v=8467](https://localhost:5601/khq/bundles/kibana.style.css?v=8467) net::ERR\_EMPTY\_RESPONSE  
kibana:177 GET [https://localhost:5601/khq/bundles/commons.bundle.js?v=8467](https://localhost:5601/khq/bundles/commons.bundle.js?v=8467) net::ERR\_EMPTY\_RESPONSE

GET [https://localhost:5601/khq/bundles/commons.style.css?v=8467](https://localhost:5601/khq/bundles/commons.style.css?v=8467) net::ERR\_EMPTY\_RESPONSE

I don't have any errors in the console --dev and I don't see the link of my new plugin and the errors with

bundles/commons.bundle.js and bundles/commons.style.css

have you any idea for this errors ??

thank's  
radi

---

<div class="post-metadata">

**Author:** ![ppisljar](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/ppisljar/32/11588_2.png) [@ppisljar](https://discuss.elastic.co/u/ppisljar)\
**Post date:** [January 23, 2018, 11:59am UTC](https://discuss.elastic.co/t/add-pluguin-with-existing-visualization-to-add-modification-kibana-5-4-x/116458/6 "2018-01-23T11:59:11Z")

</div>

can you check the server output ? (command line where you did `npm start` is showing some errors probably)

---

<div class="post-metadata">

**Author:** ![radi](https://avatars.discourse-cdn.com/v4/letter/r/4491bb/32.png) [@radi](https://discuss.elastic.co/u/radi)\
**Post date:** [January 23, 2018, 12:32pm UTC](https://discuss.elastic.co/t/add-pluguin-with-existing-visualization-to-add-modification-kibana-5-4-x/116458/7 "2018-01-23T12:32:15Z")

</div>

hi, @ppisljar i have no errors the lazy optimize sucess !

server log [12:29:45.469] [info][status][ui settings] Status changed from yellow to green - Ready  
optmzr log [12:30:26.631] [info][optimize] Lazy optimization success in 44.59 seconds

---

<div class="post-metadata">

**Author:** ![ppisljar](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/ppisljar/32/11588_2.png) [@ppisljar](https://discuss.elastic.co/u/ppisljar)\
**Post date:** [January 23, 2018, 1:04pm UTC](https://discuss.elastic.co/t/add-pluguin-with-existing-visualization-to-add-modification-kibana-5-4-x/116458/8 "2018-01-23T13:04:28Z")

</div>

no idea what goes wrong, but could you explain a bit more on how you copied the pie chart vis ?  
(which folders did you duplicate, which files did you modify)

---

<div class="post-metadata">

**Author:** ![radi](https://avatars.discourse-cdn.com/v4/letter/r/4491bb/32.png) [@radi](https://discuss.elastic.co/u/radi)\
**Post date:** [January 23, 2018, 1:17pm UTC](https://discuss.elastic.co/t/add-pluguin-with-existing-visualization-to-add-modification-kibana-5-4-x/116458/9 "2018-01-23T13:17:53Z")

</div>

the folder i use is kibana\src\core\_plugins\kbn\_vislib\_vis\_types\public  
i copied the pie.js ,kbn\_vislib\_vis\_types.js  
and folder;

- image with juste icon-pie.svg
- editors  
-controls  
and i creat new folder in plugins "pie-costum "with folder public with
- editors  
-controls  
-pie.js  
-kbn\_vislib\_vis\_types.js (rename pie-costum)  
with just this code :  
import visTypes from 'ui/registry/vis\_types';  
import pieVisTypeProvider from 'plugins/pie-costum/pie';  
visTypes.register(pieVisTypeProvider);

package.json with  
{  
"name": "pie-costum",  
"version": "5.4.4"  
}  
and index.js

'use strict';

module.exports = function (kibana) {

return new kibana.Plugin({

```
uiExports: {
  visTypes: [
    'plugins/pie-costum/pie-costum'
  ]
}

```

});

}

---

<div class="post-metadata">

**Author:** ![ppisljar](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/ppisljar/32/11588_2.png) [@ppisljar](https://discuss.elastic.co/u/ppisljar)\
**Post date:** [January 23, 2018, 1:37pm UTC](https://discuss.elastic.co/t/add-pluguin-with-existing-visualization-to-add-modification-kibana-5-4-x/116458/10 "2018-01-23T13:37:48Z")

</div>

did you update the pie-costum, to import the correct file and register it with VisTypesRegistry ?  
did you update the pie.js and gave it a uniqe name, and fix all the imports ?  
did you fix imports in all other files to correctly import your new version of files ?

that's just a few pointers, but i guess you will need to dig in this on your own.

---

<div class="post-metadata">

**Author:** ![radi](https://avatars.discourse-cdn.com/v4/letter/r/4491bb/32.png) [@radi](https://discuss.elastic.co/u/radi)\
**Post date:** [January 23, 2018, 4:37pm UTC](https://discuss.elastic.co/t/add-pluguin-with-existing-visualization-to-add-modification-kibana-5-4-x/116458/11 "2018-01-23T16:37:29Z")

</div>

> [@ppisljar](#):
>
> register it with VisTypesRegistry

thank'sI have succeeded to add new pluguin with dpulicate code of pie

but i still have One error in console :

commons.bundle.js?v=8467:38 TypeError: visType is not a function  
at new VisConfig (kibana.bundle.js?v=8467:69)

have you any idea why ?

---

<div class="post-metadata">

**Author:** ![ppisljar](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/ppisljar/32/11588_2.png) [@ppisljar](https://discuss.elastic.co/u/ppisljar)\
**Post date:** [January 23, 2018, 4:38pm UTC](https://discuss.elastic.co/t/add-pluguin-with-existing-visualization-to-add-modification-kibana-5-4-x/116458/12 "2018-01-23T16:38:34Z")

</div>

put a breakpoint there and figure out whats going wrong ? a missing import or something like that ?

---

<div class="post-metadata">

**Author:** ![radi](https://avatars.discourse-cdn.com/v4/letter/r/4491bb/32.png) [@radi](https://discuss.elastic.co/u/radi)\
**Post date:** [January 23, 2018, 4:39pm UTC](https://discuss.elastic.co/t/add-pluguin-with-existing-visualization-to-add-modification-kibana-5-4-x/116458/13 "2018-01-23T16:39:20Z")

</div>

Thank you, I'll see about that

---

<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:** [February 20, 2018, 4:39pm UTC](https://discuss.elastic.co/t/add-pluguin-with-existing-visualization-to-add-modification-kibana-5-4-x/116458/14 "2018-02-20T16:39:28Z")

</div>

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