Chart not updating automagically

3 posts, 0 answers
  1. Paul
    Paul  avatar
    4 posts
    Member since:
    Mar 2014

    Posted 17 Feb Link to this post

    I have been playing around with a local copy of the pie chart using remote data, as per this demo http://demos.telerik.com/kendo-ui/pie-charts/remote-data-binding

     

    The chart is rendering just fine. However, when I update the data on the server the chart does not update until I prompt it to with this;

    $("#chart").data("kendoChart").dataSource.read();

     

    I found this post in the forums, perhaps the wording is misleading, but it suggests that it should "automatically refresh".

    http://www.telerik.com/forums/update-datasource#6D639C0ai0Sf57uQiljUug

     

    Maybe I am missing something? Here is my source code;

     

    <!DOCTYPE html><html><head>
        <style>html { font-size: 14px; font-family: Arial, Helvetica, sans-serif; }</style>
        <title></title>
        <link rel="stylesheet" href="//kendo.cdn.telerik.com/2016.1.112/styles/kendo.common-material.min.css" />
        <link rel="stylesheet" href="//kendo.cdn.telerik.com/2016.1.112/styles/kendo.material.min.css" />
        <script src="//kendo.cdn.telerik.com/2016.1.112/js/jquery.min.js"></script>
        <script src="//kendo.cdn.telerik.com/2016.1.112/js/kendo.all.min.js"></script>
    </head>
    <body>
    <div id="example">
        <div class="demo-section k-content wide">
            <div id="chart"></div>
        </div>
        <script>
            function createChart() {
               $("#chart").kendoChart({
                   dataSource: {
                       transport: {
                           read: {
                               url: "http://www.jamiekdonnelly.co.uk/stuffs/data.json",
                               dataType: "json"
                           }
                       }
                   },
                   title: {
                       text: "Title"
                   },
                   legend: {
                       position: "top"
                   },
                   seriesDefaults: {
     
                   },
                   series: [{
                       field: "percent",
                       categoryField: "resolution",
                       padding: 0,
                       type: "pie",
                       labels: {
                            visible: true,
                            background: "transparent",
                            template: "#= kendo.format('{0:P}', percentage)#"
                        }
                   }],
                   tooltip: {
                       visible: true,
                       format: "N0",
                       template: "#= kendo.format('{0:P}', percentage)#"
                   }
                });
            }
            $(document).ready(createChart);
            $(document).bind("kendo:skinChange", createChart);
            // Useing this to update the chart
            //$("#chart").data("kendoChart").dataSource.read();
        </script>
    </div></body></html>

  2. Paul
    Paul  avatar
    4 posts
    Member since:
    Mar 2014

    Posted 17 Feb in reply to Paul Link to this post

    UPDATE:

    I think it is safe to say that I misinterpreted the post in the forum. Of course, if the dataSource is updated (by calling dataSource.read()), the chart will automatically update.  

     

    I will rephrase my question accordingly: 

     

    Is it possible for the Chart to poll for changes to remote data, and update automatically when this happens? 

     

    Many thanks

     

  3. Kendo UI is VS 2017 Ready
  4. T. Tsonev
    Admin
    T. Tsonev avatar
    2772 posts

    Posted 19 Feb Link to this post

    Hi,

    I'm copying the response to your support here for community reference:

    Such type of "push notifications" require a special setup and won't work out of the box.

    The most popular solution is SignalR. We have an example with the Chart ready.

    I hope this helps.

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