Add new visualizations to Kibana

Hi all,

In the context of the development of an internal tool for my company
(Scality), I am trying to figure out how hard it is (ie. estimate
development cost) to extend Kibana 4 to add some visualization schemes. But
with my very limited knowledge of web dev, and zero knowledge of Kibana
internals, I think I better ask here for some help. :slight_smile:

My goal is to be able to represent a set of up to a few hundreds related ES
documents in two ways:

The tree view would use specific fields in the docs that describe the
relations, ie. each doc has a doc_id and a parent_id that refers to a
certain doc_id (tree roots either have no parent_id field, or a magic
value).

Similarly, the timeline view would use two time fields: start time and end
time, or start time and duration. And other optional fields could improve
the chart, eg. to group certain items into "swim lanes"
(https://en.wikipedia.org/wiki/Swim_lane).

So, how can we integrate something like that in Kibana? Can we just add a
bit of JS under
https://github.com/elasticsearch/kibana/tree/master/src/kibana/components/vislib/visualizations
and call some D3 magic and be done, or is it more complex than that?

And regarding deployment of a new visualization: does Kibana 4 feature a
plugin mechanism similar to that of ES?

If we can make this happen in our project, we'd certainly be willing to
contribute these features back to the community. Also, depending on the
cost/complexity, it's quite likely that we will want to hire a contractor
to do it (if you have a serious offer, please contact me directly).

Thanks in advance for any piece of advice!

Cheers,
JM

--
You received this message because you are subscribed to the Google Groups "elasticsearch" group.
To unsubscribe from this group and stop receiving emails from it, send an email to elasticsearch+unsubscribe@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/elasticsearch/1fb4d5d4-d825-4a42-b384-5acb5075ddb5%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

Ping!

Can anyone suggest starting points on how to add visualizations to Kibana 4?

Cheers,
JM

On Tue, Mar 3, 2015 at 7:01 PM, jm@scality.com wrote:

Hi all,

In the context of the development of an internal tool for my company
(Scality), I am trying to figure out how hard it is (ie. estimate
development cost) to extend Kibana 4 to add some visualization schemes. But
with my very limited knowledge of web dev, and zero knowledge of Kibana
internals, I think I better ask here for some help. :slight_smile:

My goal is to be able to represent a set of up to a few hundreds related
ES documents in two ways:

The tree view would use specific fields in the docs that describe the
relations, ie. each doc has a doc_id and a parent_id that refers to a
certain doc_id (tree roots either have no parent_id field, or a magic
value).

Similarly, the timeline view would use two time fields: start time and end
time, or start time and duration. And other optional fields could improve
the chart, eg. to group certain items into "swim lanes" (
Swimlane - Wikipedia).

So, how can we integrate something like that in Kibana? Can we just add a
bit of JS under
https://github.com/elasticsearch/kibana/tree/master/src/kibana/components/vislib/visualizations
and call some D3 magic and be done, or is it more complex than that?

And regarding deployment of a new visualization: does Kibana 4 feature a
plugin mechanism similar to that of ES?

If we can make this happen in our project, we'd certainly be willing to
contribute these features back to the community. Also, depending on the
cost/complexity, it's quite likely that we will want to hire a contractor
to do it (if you have a serious offer, please contact me directly).

Thanks in advance for any piece of advice!

Cheers,
JM

--
You received this message because you are subscribed to the Google Groups
"elasticsearch" group.
To unsubscribe from this group and stop receiving emails from it, send an
email to elasticsearch+unsubscribe@googlegroups.com.
To view this discussion on the web visit
https://groups.google.com/d/msgid/elasticsearch/1fb4d5d4-d825-4a42-b384-5acb5075ddb5%40googlegroups.com
https://groups.google.com/d/msgid/elasticsearch/1fb4d5d4-d825-4a42-b384-5acb5075ddb5%40googlegroups.com?utm_medium=email&utm_source=footer
.
For more options, visit https://groups.google.com/d/optout.

--
You received this message because you are subscribed to the Google Groups "elasticsearch" group.
To unsubscribe from this group and stop receiving emails from it, send an email to elasticsearch+unsubscribe@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/elasticsearch/CALZqptawQ7AKSgctrLUhcy_inEm_PztyHc6JUqj1OAj0vTRbhA%40mail.gmail.com.
For more options, visit https://groups.google.com/d/optout.

You can drop things into the visualisations directory but you need to
understand how things are mapped between ES and KB.

There's actually a few talks on this coming at elastic{on}, so you'll see
the talks online very soon.
On 04/03/2015 4:48 pm, "Jean Marc Saffroy" jm@scality.com wrote:

Ping!

Can anyone suggest starting points on how to add visualizations to Kibana
4?

Cheers,
JM

On Tue, Mar 3, 2015 at 7:01 PM, jm@scality.com wrote:

Hi all,

In the context of the development of an internal tool for my company
(Scality), I am trying to figure out how hard it is (ie. estimate
development cost) to extend Kibana 4 to add some visualization schemes. But
with my very limited knowledge of web dev, and zero knowledge of Kibana
internals, I think I better ask here for some help. :slight_smile:

My goal is to be able to represent a set of up to a few hundreds related
ES documents in two ways:

The tree view would use specific fields in the docs that describe the
relations, ie. each doc has a doc_id and a parent_id that refers to a
certain doc_id (tree roots either have no parent_id field, or a magic
value).

Similarly, the timeline view would use two time fields: start time and
end time, or start time and duration. And other optional fields could
improve the chart, eg. to group certain items into "swim lanes" (
Swimlane - Wikipedia).

So, how can we integrate something like that in Kibana? Can we just add a
bit of JS under
https://github.com/elasticsearch/kibana/tree/master/src/kibana/components/vislib/visualizations
and call some D3 magic and be done, or is it more complex than that?

And regarding deployment of a new visualization: does Kibana 4 feature a
plugin mechanism similar to that of ES?

If we can make this happen in our project, we'd certainly be willing to
contribute these features back to the community. Also, depending on the
cost/complexity, it's quite likely that we will want to hire a contractor
to do it (if you have a serious offer, please contact me directly).

Thanks in advance for any piece of advice!

Cheers,
JM

--
You received this message because you are subscribed to the Google Groups
"elasticsearch" group.
To unsubscribe from this group and stop receiving emails from it, send an
email to elasticsearch+unsubscribe@googlegroups.com.
To view this discussion on the web visit
https://groups.google.com/d/msgid/elasticsearch/1fb4d5d4-d825-4a42-b384-5acb5075ddb5%40googlegroups.com
https://groups.google.com/d/msgid/elasticsearch/1fb4d5d4-d825-4a42-b384-5acb5075ddb5%40googlegroups.com?utm_medium=email&utm_source=footer
.
For more options, visit https://groups.google.com/d/optout.

--
You received this message because you are subscribed to the Google Groups
"elasticsearch" group.
To unsubscribe from this group and stop receiving emails from it, send an
email to elasticsearch+unsubscribe@googlegroups.com.
To view this discussion on the web visit
https://groups.google.com/d/msgid/elasticsearch/CALZqptawQ7AKSgctrLUhcy_inEm_PztyHc6JUqj1OAj0vTRbhA%40mail.gmail.com
https://groups.google.com/d/msgid/elasticsearch/CALZqptawQ7AKSgctrLUhcy_inEm_PztyHc6JUqj1OAj0vTRbhA%40mail.gmail.com?utm_medium=email&utm_source=footer
.
For more options, visit https://groups.google.com/d/optout.

--
You received this message because you are subscribed to the Google Groups "elasticsearch" group.
To unsubscribe from this group and stop receiving emails from it, send an email to elasticsearch+unsubscribe@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/elasticsearch/CAEYi1X9X%2BdKwqdRRhzAb1nonu5Xg5-Bb%2Bmw_90u3f_Rw_CKjoA%40mail.gmail.com.
For more options, visit https://groups.google.com/d/optout.

Mark,

Thanks for your reply, and for posting links to the Elasticon talks, I'll
try to make sense of them for my project.

JM

On Mon, Mar 9, 2015 at 1:31 AM, Mark Walkom markwalkom@gmail.com wrote:

You can drop things into the visualisations directory but you need to
understand how things are mapped between ES and KB.

There's actually a few talks on this coming at elastic{on}, so you'll see
the talks online very soon.
On 04/03/2015 4:48 pm, "Jean Marc Saffroy" jm@scality.com wrote:

Ping!

Can anyone suggest starting points on how to add visualizations to Kibana
4?

Cheers,
JM

On Tue, Mar 3, 2015 at 7:01 PM, jm@scality.com wrote:

Hi all,

In the context of the development of an internal tool for my company
(Scality), I am trying to figure out how hard it is (ie. estimate
development cost) to extend Kibana 4 to add some visualization schemes. But
with my very limited knowledge of web dev, and zero knowledge of Kibana
internals, I think I better ask here for some help. :slight_smile:

My goal is to be able to represent a set of up to a few hundreds related
ES documents in two ways:

The tree view would use specific fields in the docs that describe the
relations, ie. each doc has a doc_id and a parent_id that refers to a
certain doc_id (tree roots either have no parent_id field, or a magic
value).

Similarly, the timeline view would use two time fields: start time and
end time, or start time and duration. And other optional fields could
improve the chart, eg. to group certain items into "swim lanes" (
Swimlane - Wikipedia).

So, how can we integrate something like that in Kibana? Can we just add
a bit of JS under
https://github.com/elasticsearch/kibana/tree/master/src/kibana/components/vislib/visualizations
and call some D3 magic and be done, or is it more complex than that?

And regarding deployment of a new visualization: does Kibana 4 feature a
plugin mechanism similar to that of ES?

If we can make this happen in our project, we'd certainly be willing to
contribute these features back to the community. Also, depending on the
cost/complexity, it's quite likely that we will want to hire a contractor
to do it (if you have a serious offer, please contact me directly).

Thanks in advance for any piece of advice!

Cheers,
JM

--
You received this message because you are subscribed to the Google
Groups "elasticsearch" group.
To unsubscribe from this group and stop receiving emails from it, send
an email to elasticsearch+unsubscribe@googlegroups.com.
To view this discussion on the web visit
https://groups.google.com/d/msgid/elasticsearch/1fb4d5d4-d825-4a42-b384-5acb5075ddb5%40googlegroups.com
https://groups.google.com/d/msgid/elasticsearch/1fb4d5d4-d825-4a42-b384-5acb5075ddb5%40googlegroups.com?utm_medium=email&utm_source=footer
.
For more options, visit https://groups.google.com/d/optout.

--
You received this message because you are subscribed to the Google Groups
"elasticsearch" group.
To unsubscribe from this group and stop receiving emails from it, send an
email to elasticsearch+unsubscribe@googlegroups.com.
To view this discussion on the web visit
https://groups.google.com/d/msgid/elasticsearch/CALZqptawQ7AKSgctrLUhcy_inEm_PztyHc6JUqj1OAj0vTRbhA%40mail.gmail.com
https://groups.google.com/d/msgid/elasticsearch/CALZqptawQ7AKSgctrLUhcy_inEm_PztyHc6JUqj1OAj0vTRbhA%40mail.gmail.com?utm_medium=email&utm_source=footer
.
For more options, visit https://groups.google.com/d/optout.

--
You received this message because you are subscribed to the Google Groups
"elasticsearch" group.
To unsubscribe from this group and stop receiving emails from it, send an
email to elasticsearch+unsubscribe@googlegroups.com.
To view this discussion on the web visit
https://groups.google.com/d/msgid/elasticsearch/CAEYi1X9X%2BdKwqdRRhzAb1nonu5Xg5-Bb%2Bmw_90u3f_Rw_CKjoA%40mail.gmail.com
https://groups.google.com/d/msgid/elasticsearch/CAEYi1X9X%2BdKwqdRRhzAb1nonu5Xg5-Bb%2Bmw_90u3f_Rw_CKjoA%40mail.gmail.com?utm_medium=email&utm_source=footer
.
For more options, visit https://groups.google.com/d/optout.

--
You received this message because you are subscribed to the Google Groups "elasticsearch" group.
To unsubscribe from this group and stop receiving emails from it, send an email to elasticsearch+unsubscribe@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/elasticsearch/CALZqpta62fxi%2B575wssOAiEiWHvmpax%3DUjFOoiCKxsku-aTzAg%40mail.gmail.com.
For more options, visit https://groups.google.com/d/optout.

Kind of an old conversation, but maybe this can help someone.

I have developed two new Visualizations for Kibana 4.4.1, based on D3 Circle Packing and Sunburst. It wasn't very complicated, once you have a baseline, you can estimate about 4 days effort to build each one, testing included.

You can check them out here : (sunburst) and (circles).

Hope you like it. Let me know how it goes.

Juan,

Thanks for sending these examples! It is awesome to see how much we can
extend Kibana nowadays. I've also noticed that nice people wrote some
details tutorials (https://www.timroes.de/).

The project I had around Kibana last year is unfortunately on hold, but
your email could be very helpful when I attempt to revive it. :slight_smile:

Thanks again!

JM

Glad to help.

I will be posting an article on Kibana visualization plugin development pretty soon, I'll send you an email once it is baked.

Hello,Juan. Does it also work in other kibana version , such as 4.1.2?

It might, there are a few changes though.

Can you test it and let me know if it does?

Thanks!

kibana4.1.2 can't use npm commands to install visualization plugins in my development environment. But it could show after I copied the whole visualization folder to kibana's plugins folder. Thank you for the examples. But there was another question.The circles's size could not be changed as the window's size changed. How to make circles resize when it show in the dashboard. Just like kibana pie_chart, area_chart and ohters.