Sparkline / chart value axis with rounded ends

[Software]

Is it possible to have rounded ends on a sparkline?  Below is an image of the component used multiple times in a grid, and the component template.

<kendo-sparkline 
    type="bar"
    [data]="score"
    [transitions]="true"
    [seriesDefaults]="{labels: {background: 'none', visible: true, format: '{0}'}, color: getBarColor(score), bar: { size: 6 } }"
    [tooltip]="{visible: false}"
>
    <kendo-chart-area opacity="0" [width]="100"></kendo-chart-area>
    <kendo-chart-value-axis>
        <kendo-chart-value-axis-item
            [min]="0"
            [max]="130"
            [reverse]="true"            
        >
        </kendo-chart-value-axis-item>
    </kendo-chart-value-axis>
</kendo-sparkline>

[Yanmario]

Hi,

Currently, there isn't a built-in API that will allow to change corner radius of the bar/column types. But it does sound like a valid feature request for our feedback portal to provide a corner radius property. Now it is possible to change the whole rendering of the bar chart by using custom visuals which will allow you to round the corners of the bar, but it will take some custom logic to implement it with the Drawing library. Example of using custom visuals:

https://stackblitz.com/edit/angular-uwaxcg?file=src%2Fapp%2Fapp.component.ts

The example of course needs some work to round the desired corners, but it is a good start if you decide to go through the custom visual approach. The example is based on the following knowledge base article:

https://www.telerik.com/kendo-angular-ui/components/knowledge-base/bar-chart-custom-visuals/

I hope this helps.

Regards,
Yanmario
Progress Telerik