Responsive issue in KendoGraph

[developer]

I'm using Kendo Pie Chart to render a pie chart in the DOM.Below is the code that has been used..

     function showOnPie(data) {
                var total = [];
                var count = 0;
                for (var i = 0, tot = data.roundGraph.length; i < tot; i++) {
                    count += data.roundGraph[i].total;
                }
                for (var j = 0, totem = data.roundGraph.length; j < totem; j++) {
                    total.push([data.roundGraph[j].name, (data.roundGraph[j].total / count) * 100, data.roundGraph[j].id])
                }
                $scope.pieChartOptions = {
                    title: {
                        position: "bottom",
                        text: "Share of Internet Population Growth, 2007 - 2012"
                    },
                    legend: {
                        visible: false
                    },
                    chartArea: {
                        background: ""
                    },
                    seriesDefaults: {
                        labels: {
                            visible: true,
                            background: "transparent",
                            template: "#= category #: \n #= value#%"
                        }
                    },
                    series: [
                        {
                            type: "pie",
                            startAngle: 150,
                            data: [
                                {
                                    category: "Asia",
                                    value: 53.8,
                                    color: "#9de219"
                                }, {
                                    category: "Europe",
                                    value: 16.1,
                                    color: "#90cc38"
                                }, {
                                    category: "Latin America",
                                    value: 11.3,
                                    color: "#068c35"
                                }, {
                                    category: "Africa",
                                    value: 9.6,
                                    color: "#006634"
                                }, {
                                    category: "Middle East",
                                    value: 5.2,
                                    color: "#004d38"
                                }, {
                                    category: "North America",
                                    value: 3.6,
                                    color: "#033939"
                                }
                            ]
                        }
                    ],
                    tooltip: {
                        visible: true,
                        format: "{0}%"
                    }
                };
            }

 

The chart is loading fine but is not responsive in different browser window.

As a solution I tried to refresh the chart on change in window size by doing

    $(window).resize(function () {
                showOnPie($scope.chartdATA);
            });

but didn't find a perfect solution for the responsiveness.

Same goes for the bar chart where the x and y axis are hidden when the browser is minimized.Can anybody sufggest a fix for this issue.All the code has been done in AngularJs.

[developer]

Please find this example as a referecne.

http://dojo.telerik.com/EXAGa

 When browser window minimizes its not coming as responsive.

[Iliana Dyankova]

Hello,

Kendo UI Chart won't automicatically resize when browser window is resized - you need to call kendo.resize. For more details check this help article.

Regards,
Iliana Nikolova
Telerik