I am having some odd behavior in our application where it appears the series label lines are being rendered backwards (see backwards.png). I am trying to construct a test case that displays this behavior, but I haven't had any luck, I just get the correct positioning (see correct.png).
Does anyone here have any thoughts on what might be causing this? Some obscure CSS setting or such?
1 Answer, 1 is accepted
Hello Jay,
Unfortunately, I wasn't able to reproduce the problem when I tested locally. Everything seems to be working as expected.
However, since this behavior is unexpected, my suggestion is to check if there is any custom CSS applied that may affect the lines and the Chart. Also, a good idea is to check the loaded CDN files.
For example, when using Kendo Sass theme, and a Less file like the following one is loaded too, might lead to a similar problem:
<link href="https://kendo.cdn.telerik.com/2021.3.1109/styles/kendo.common-bootstrap.min.css" rel="stylesheet" type="text/css" />So make sure the theme is properly loaded and if you are using a SASS theme, remove any unnecessary theme files, like the one shown above. Leave only the reference to the SASS theme file.
At your end, if you still don't find the reason for this issue may I ask you to capture a Fiddler Jam log by following the guidelines in this article:
The log allows us to mock the page and examine the behavior and the related network activity and could help us identify what causes the problem. Note that after the recording has started, the page should be fully refreshed.
Looking forward to hearing back from you.
Regards,
Yanislav
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/.
Rank 3
Iron
Iron
Veteran
Hi Yanislav. I was able to recreate it, and here is a dojo. The problem occurs when specifying distance on the labels, apparently if the distance is too small? I know very much older versions did not have this issue, but I don't know specifically when it changed.
If you remove the "distance: 10" setting on the labels, they will be drawn correctly.
Hi Jay,
Thank you for preparing the sample - it allowed us to figure out the exact case.
And yeah, you are correct. The issue is related to the distance property which has a default value of 35. I am afraid with lesser values than that it won't work properly:
https://docs.telerik.com/kendo-ui/api/javascript/dataviz/ui/chart/configuration/series.labels.distance#serieslabelsdistance
So I highly suggest that you set some greater value like 50 and the issue will be resolved:
https://dojo.telerik.com/eZuvOlaZ