imageDataURL in Angular-Kendo

[Moshi]

Hi

I have a screen with multiple charts displayed.

I need to create a thumbnail image for each chart, to be displayed as a charts panel at the bottom.

Say every chart is created and creates an image thumbnail to be used at he bottom.

I saw the imageDataURL option, but I didn't see any option for it with Angular.

(https://docs.telerik.com/kendo-ui/api/javascript/dataviz/ui/arcgauge/methods/imagedataurl#imagedataurl)

I'll appreciate any help.

Thanks.

 

[Svet]

Hi Moshi,

Thank you for the provided referenced link.

What could be used for the Kendo UI for Angular ArcGauge component is its built - in exportImage() method. Please check the public API of the ArcGauge component for a list of all provided functions:

https://www.telerik.com/kendo-angular-ui/components/gauges/api/ArcGaugeComponent/#toc-methods

I hope this helps.

Regards,
Svetlin
Progress Telerik

[Moshi]

Thank you Svetlin.

What I'm looking for is not an option to download as an image, but to get a thumbnail - a tiny copy, 

to be used on the screen as a representation of the chart.

I found an option of the method drawImage which deals with canvas, but I can't use it since the chart is 

not a video/img/canvas etc. (btw - an option of chart as a canvas won't solve it).

Anyways, that is what I need and I'm afraid the option is not available for Angular Kendo chart...

Any idea will be appreciated!

[Svet]

Hi Moshi,

Thank you for the provided additional details.

Indeed, there isn't such method that could be used to achieve the desired behavior out-of-the-box. What could be done as a workaround is to render the chart with a smaller height and width. For the purpose hiding the legend, and its axis labels and series markers would also be recommended so that the small chart looks better. Please check the following example demonstrating such approach:

https://stackblitz.com/edit/angular-zbsjg8?file=app/app.component.ts

I hope this helps.

Regards,
Svetlin
Progress Telerik