Kibana Visualizations - Using Canvas to get non aggregated graphical representation

[abdulsofts (Abdul Kareem Shaik)]

Hi,

I have a requirement to represent time based status report of different servers. Using Canvas, I was able to represent Time on X-axis and Server name on Y-axis but I also want to represent in the same graph, the status of server on the time range as per X-axis.
Is it possible to achieve this in Canvase?
Is it possible to add multiple fields in a single axis. For example, I need time on X-axis, Server name on Y-axis and server status at particular time period (may be on X-axis).

Please find the attached graph where I was able to represent only server name and time period.

[Joe_Fleming]

The visualizations we have in Canvas right now are quite simple, so out of the box you can't create visualizations that have multiple values in them, or even multiple axes. It's something we'll likely add in the future though.

That said, if you don't want to wait, it's not super difficult to create your own render function and create any kind of visualization you'd like. The documentation is still a work in progress, but you can look in the Canvas source to get an idea of how to do it.

You'll need to start by creating a Kibana plugin, and using the plugin generator is the easiest way to do that. The instructions in the readme should get you going pretty quickly.

Then you need to create your custom renderer. You can see how we render plot data in the plot renderer. It's just a function that takes 3 arguments; 1) the raw dom node to render into, 2) the resulting data from the expression, and 3) some handler functions that allow you to set filters and indicate that the thing is finished rendering. The shape of the config object, the result of the expression, varies a bit, but a console.log or even the debugger can be used to inspect its shape.

In order to use your function, you'll need to register your renderer so the system knows it's available and can use it. There is a RenderFunctionsRegistry that is available through the @kbn/interpreter package... things are moving around a little, so the location of the registry will probably change, but the registry itself will not. You can see how Canvas registers things in the code here.

Once you have your renderer, you can use it in the expression with the render function, like | render as=customrenderer, where customrenderer would be whatever you set the name of your renderer to.

Hopefully that's helpful, and if you attempt it, feel free to follow up here with any questions.