This question is locked. New answers and comments are not allowed.
Hello,
I have a problem in IE8 with pie chart when I have an item that occupies almost 100% of chart. In this case chart disappears but this occurs depending on chart size. You can resize window to find when the problem appears.
I have found that problem does not exists neither in Chrome nor in IE9.
The following code reproduces the problem:
---
<!DOCTYPE html>
<html>
<head>
<link href="Styles/kendo/kendo.common.min.css" rel="stylesheet" type="text/css" />
<link href="Styles/kendo/kendo.default.min.css" type="text/css" rel="stylesheet" />
<style>
body, html
{
width: 100%;
height: 100%;
padding: 0;
margin: 0;
}
</style>
</head>
<body>
<script src="Scripts/jquery-1.7.2.js" type="text/javascript"></script>
<script src="Scripts/kendo/kendo.dataviz.js" type="text/javascript"></script>
<script type="text/javascript">
$(function()
{
$("#chart").kendoChart(
{
title:
{
text: "Break-up of Spain Electricity Production for 2008"
},
legend:
{
position: "bottom",
labels:
{
template: "#= text # (#= value #%)"
}
},
seriesDefaults:
{
labels:
{
visible: true,
format: "{0}%"
}
},
series:
[
{
type: "pie",
data:
[
// {
// category: "Hydro",
// value: 22
// },
// {
// category: "Solar",
// value: 2
// },
// {
// category: "Nuclear",
// value: 49
// },
{
category: "Wind",
value: 27
}
]
}
],
tooltip:
{
visible: true,
format: "{0}%"
},
transitions: false
});
});
$(window).resize(function()
{
var chart = $("#chart").data("kendoChart");
if (chart)
{
chart.redraw();
}
});
</script>
<div id="chart" style="width: 100%; height: 100%">
</div>
</body>
</html>
---
I've check your code and have seen that the problem occurs in VMLRing.renderPoints() method in case when outerStartPoint conisides with outerEndPoint. I think you should draw a circle in this case instead of an arc.