How to render multiple chartseriesitem line elements with differing start dates?

1 Answer 155 Views
Grid
Janki
Top achievements
Rank 4
Bronze
Iron
Iron
Janki asked on 21 Sep 2021, 09:27 PM | edited on 21 Sep 2021, 09:28 PM

Kendo shifts lines with later start dates to the beginning (yellow line should not start until 12/31/1999):

Setting missingValues=”gap” does not seem to change the rendering of the chart. Is there any prop or setting I missed?

1 Answer, 1 is accepted

Sort by
1
Accepted
Stefan
Telerik team
answered on 22 Sep 2021, 07:00 AM

Hello, Janki,

There are two options in this case:

1) Have the values in the object value-category pair. This way the like will start based on the category value of the first point:

https://www.telerik.com/kendo-react-ui/components/charts/chart/data-binding/#toc-objects

2) Add null values, to the second series based on the missing values. I made an example showcasing this:

https://stackblitz.com/edit/react-sbmeuc?file=app/main.tsx

I hope one of the approaches proves helpful.

Regards,
Stefan
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.

Tags
Grid
Asked by
Janki
Top achievements
Rank 4
Bronze
Iron
Iron
Answers by
Stefan
Telerik team
Share this question
or