Chart layout changed by itself when update series programmatically.

2 posts, 0 answers
  1. Edwin Kwok
    Edwin Kwok avatar
    5 posts
    Member since:
    Dec 2007

    Posted 20 Jun 2012 Link to this post

    In the attached program, when you load “Survey Local”  the charts on the left and right looks the same and this is how they should look.

     The problem is once you click on any “yes” or “no” button I programmatically update the chart by following codes near line 719

     var chart = $("#PieChart1").data("kendoChart");

                            chart.options.series[0].data = series;

                            chart.refresh();

     The chart did update but the layout changed too which should not happen and I had no idea why.

     Please Help.

     Thanks

    Edwin

  2. Iliana Nikolova
    Admin
    Iliana Nikolova avatar
    2622 posts

    Posted 25 Jun 2012 Link to this post

    Hi Edwin,

    The most likely reason for the problem is that the charts are initialized too early. In order to avoid this you could hook up the show event of the mobile view, which fires when a mobile View becomes visible and then create the two charts. For example: 
    <div data-role="view" id="surveyLocal" data-title="Take Survey" data-show="myCharts" data-layout="mobile-view"
      data-transition="zoom">
     
    <script>
    function myCharts() {
       createPieChart("PieChart1", "This Location");
       createPieChart("PieChart2", "Target Location");
    }
    </script>

    I hope this helps.

     

    Regards,
    Iliana Nikolova
    the Telerik team
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
Back to Top