Hi,
As you can see in this dojo https://dojo.telerik.com/UTuPeMUw, there is a problem with the grid lines when I set the reverse property to true and the max property to 270 (the grid lines of angles 30, 60 and 90 are hidden).
Thank you
### Bug report
When the title of the legend in the Kendo UI Chart widget is longer, the labels are not centered as per the default legend alignment.
### Reproduction of the problem
1) Create a Chart widget and set the title of the legend to "If the title is longer than the series names is not centered anymore is left aligned";
2) The title is centered, but the labels are aligned to the left.
A Dojo sample for reproduction: https://dojo.telerik.com/UBoTOBID
### Expected/desired behavior
The labels of the legend should be centered below the title.
### Environment
* **Kendo UI version: 2021.2.616
* **jQuery version: 1.12.4
* **Browser: [all]
In case you are using a chart with the following configuration:
$("#chart").kendoChart({
series: [{
type: "radarLine",
missingValues: "gap",
data: [1, null, null, null, 5]
}]
});
There is no line between the last and the first data point of the series.
But when the 2nd and 4th data points are set as well, this connection is added:
$("#chart").kendoChart({
series: [{
type: "radarLine",
missingValues: "gap",
data: [1, 3, null, 3, 5]
}]
});
Expected behaviour: As the chart displays a "circle", all data points next to each other should be connected in case they are having a value.
The same issue can be seen in this DOJO, where the fifth data point is not connected to the rest of the points. This only happens if "missingValues" is set to "gap".
Pie chart labels are not properly rendered when exported to image.
The issue can be reproduced here:
Bug report
ValueAxis.labels.template function invokes twice when Chart is bound to data source
Reproduction of the problem
Check the following Dojo: https://dojo.telerik.com/oJUGixUy/4
Inspect the console
Expected/desired behavior
ValueAxis labels template function shall invoke just one time.
Corner case:
If ValueAxis.labels.font is specified template function is invoked correctly only once.
valueAxis: {
labels: {
// With the font commented out, chart labels get resolved twice
font: '11px Arial, Helvetica, sans-serif',
template: shortLabels
}
},
Environment
**Kendo UI version: [all]
**jQuery version: [all]
**Browser: [all]
The problem can be seen in the following Dojo:
https://dojo.telerik.com/uQeduJAG
When the Donut Chart has a section with value = 0, the color of that point is displayed inside the donut.
When the user tries to zoom the Chart and a zero range is selected, an error (Uncaught TypeError: Cannot read properties of undefined (reading 'min')) is thrown in the browsers console.
Shift
key and select a range. Try the min and max of the range to be almost the same.Uncaught TypeError: Cannot read properties of undefined (reading 'min') error is thrown in the console.
screencast - https://somup.com/c06lloBaw2
There should be no error in the browsers console, no matter of the selected range.
Bug report
Chart with log valueAxis allows to deem zoom and throws an error: Uncaught Error: Non positive values cannot be used for a logarithmic axis
Reproduction of the problem
Dojo: https://dojo.telerik.com/OCuziYOr
Expected/desired behavior
The Chart shall not allow this deep zoom
Environment
Kendo UI version:[all]
Browser: [all ]
I need that the point will be in the start of chart (like justified property behavior) and the line style of "rangeArea" type property will be "step".
In this example the point in the start and the justified property works as expected.
https://dojo.telerik.com/IZuXOyAZ
but in the second example, when I added property: line: {style: "step"} to "rangeArea" type, the point start in the middle of labels, and justified property not working.
https://dojo.telerik.com/ILOxehAB/3
So I need that my chart will be like the second example, but the start point of the line will be like the first example.
Setting the visibility using the toggleVisibility method in the legendItemHover event leads to legendItemHover being triggered multiple times. Thus, the legendItemLeave method is never called.
If you try to move the cursor slightly the legendItemHover event is fired multiple times and the legendItemLeave event is never called.
The legendItemHover should be fired a single time when the mouse enters the legend and also the legendItemLeave should be fired even if the visibility of the legend is set through the toggleVisibility method.
function onLegendItemHover(e){
e.preventDefault();
console.log("Hover");
let chart = e.sender;
let seriesIndex = e.seriesIndex;
for(let i = 0; i < chart.options.series.length; i++){
if(i !== seriesIndex){
let series = chart.findSeriesByIndex(i);
if (series._options.visible) {
chart.findSeriesByIndex(i).toggleVisibility(false);
}
}
}
}
function onLegendItemLeave(e){
e.preventDefault();
let chart = e.sender;
console.log("Leave");
for(let i = 0; i < chart.options.series.length; i++){
let series = chart.findSeriesByIndex(i);
if (!series._options.visible) {
chart.findSeriesByIndex(i).toggleVisibility(true);
}
}
}
Dojo with workaround - https://dojo.telerik.com/@NeliKondova/EpOYadid
When the zIndex is set the the chart marker in the legend is misaligned.
The line and the marker in the legend are misaligned.
The line and the marker should be aligned even when the zindex is set.