Unplanned
Last Updated: 25 Nov 2022 14:12 by ADMIN
Mo
Created on: 02 Jun 2022 23:14
Category: Chart
Type: Feature Request
2
Add Border Radius for Bar Chart (Stacked)

Is it possible to use a custom border radius for individual bars of a stacked bar chart?

 

According to the Docs, it looks like we are limited to: color, dashType and width but was wondering if I am missing something or there is another way?

https://www.telerik.com/kendo-react-ui/components/charts/api/Border/

 

Thank you!

5 comments
ADMIN
Vessy
Posted on: 25 Nov 2022 14:12

Hi, Michael,

The border-radius is not part of the planned improvements for the chart, but I have converted this forum thread to a Feature request so we can track the the overall interest on such addition to the chart. For convenience, I have updated the votes on behalf to increase the initial priority of the item.

Kind regards,
Vessy
Progress Telerik

Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.

Michael
Posted on: 23 Nov 2022 21:50

It seems like this solution just allows you to add a visual decorator on top of the individual bar.

Are you planning on adding the ability to simply control border-radius on the bars in the future?

ADMIN
Vessy
Posted on: 08 Jun 2022 07:17
You are welcome, Mo :) I am glad the suggested solution was helpful for you.
Mo
Posted on: 07 Jun 2022 23:31
Thank you Vessy, appreciate you providing an example. I was able to rework for my use case and get it working. Thanks again!
ADMIN
Vessy
Posted on: 03 Jun 2022 11:30

Hello Mo,

As per your assumption, there is no built-in option for configuring the border radius of the individual bars, but you can utilize the series item "visual" and provide custom rendering for each item. You can use the original series item options available in the Visual handler (center coordinates, inner radius, angles, dataItem, etc.) in order to render the custom shape that you want:

You can see a sample demonstrating how to create a stacked bar chart with rounder corners in the following example:

 

Regards,
Vessy
Progress Telerik

Love the Telerik and Kendo UI products and believe more people should try them? Invite a fellow developer to become a Progress customer and each of you can get a $50 Amazon gift voucher.