Is your feature request related to a problem? Please describe.
I want to be able to save the chart as PNG image. This can be used to simplify client side export in Kibana.
Describe the solution you'd like
Add the possibility to export the chart as a PNG via a function call to the chart.
Konva has the possibility to get the DataURL from the Stage object (see https://konvajs.org/docs/data_and_serialization/Stage_Data_URL.html)
const dataURL = stage.toDataURL();
This, btw, will only save the chart into a PNG, not the whole chart with the legend.
A possibility for that is illustrated on https://github.com/tsayen/dom-to-image#how-it-works
but is basically the following:
- clone the DOM element of the legend
- inline all the styles
- create an SVG with a
foreignObject with the cloned DOM element
- save the SVG as image from js
- copy and paste the image of the legend and the chart into a new image.
Describe alternatives you've considered
The legend can be rendered in canvas, but it's quite difficult and we need to move the whole action logic to a canvas element.
Another option is to render subsequentially a static legend on the chart canvas with only colors and texts of the existing legend.
Additional context
n/a
Kibana Cross Issues
Add any Kibana related issues/feature requests here.
Checklist
Is your feature request related to a problem? Please describe.
I want to be able to save the chart as PNG image. This can be used to simplify client side export in Kibana.
Describe the solution you'd like
Add the possibility to export the chart as a PNG via a function call to the chart.
Konva has the possibility to get the DataURL from the
Stageobject (see https://konvajs.org/docs/data_and_serialization/Stage_Data_URL.html)This, btw, will only save the chart into a PNG, not the whole chart with the legend.
A possibility for that is illustrated on https://github.com/tsayen/dom-to-image#how-it-works
but is basically the following:
foreignObjectwith the cloned DOM elementDescribe alternatives you've considered
The legend can be rendered in canvas, but it's quite difficult and we need to move the whole action logic to a canvas element.
Another option is to render subsequentially a static legend on the chart canvas with only colors and texts of the existing legend.
Additional context
n/a
Kibana Cross Issues
Add any Kibana related issues/feature requests here.
Checklist
Kibana Cross Issueslistkibana cross issuetag is associated to the issue if any kibana cross issue is present