Chart type(k-series-defaults) 2 way binding with AngularJS

2 posts, 0 answers
  1. Salim
    Salim avatar
    1 posts
    Member since:
    Feb 2016

    Posted 08 Feb 2016 Link to this post

    I have reproduced this issue in here ... 

    I am implementing Kendo Charts for my AngularJS application . I have a scenario where i need to change the type of the Chart when user clicks on a button .

    For this i am using k-series-defaults attribute directive and for its value i am binding a scope variable from controller . Please see below code snippets.


    <div class="demo-section k-content wide">
            <h4>Hover some series</h4>
            <div kendo-chart
                 k-legend="{ position: 'bottom' }"
                 k-series-defaults="{ type: 'pie' }"
                 k-series="[{ field: 'amount', categoryField: 'name'}]"


    $scope.chartData = [
                "name": "Books",
                "amount": 200
                "name": "Newspapers",
                "amount": 320
                "name": "Magazines",
                "amount": 225
                "name": "Shoes",
                "amount": 400
          $scope.update = function () {
              $scope.ChartType = { type: 'bar' };
          $scope.ChartType = { type: 'pie' };


    My problem is that , the ChartType variable change doesn't reflect in the chart rendered in the view . Which means that the AngularJS 2 way binding doesn't work with the kendo ui charts . Is there something i am missing here , or can we use some alternatives such as ObservableArray  as specified here . ?


  2. Iliana Nikolova
    Iliana Nikolova avatar
    2622 posts

    Posted 11 Feb 2016 Link to this post

    Hi Salim,

    I am not quite sure if I understand correctly what the actual issue is - could you please elaborate a bit more what the expected outcome is?

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