Why can this generate a stacked column chart

5 posts, 2 answers
  1. Geroj
    Geroj avatar
    6 posts
    Member since:
    Jun 2016

    Posted 22 Jun Link to this post

    I have this dojo code here which generate a kendo chart.

    What I want is to generate a stacked column chart based on the field "stack" of the object "stackedData". Which means if "stackedData" have 3 different value for stack then the corresponding point (coulmn ) should have 3 different stacked color.

  2. Answer
    Iliana Nikolova
    Admin
    Iliana Nikolova avatar
    2595 posts

    Posted 24 Jun Link to this post

    Hi Geroj,

    I am not quite sure if I understand correctly what the expected outcome should be - could you please elaborate a bit more? Keep in mind that:
    - In order to use grouping the chart should be bound to a dataSource (not inline data);
    - To get stacking you should have at least 2 series.

    Regards,
    Iliana Nikolova
    Telerik
     
    Get started with Kendo UI in days. Online training courses help you quickly implement components into your apps.
     
  3. Kendo UI is VS 2017 Ready
  4. Geroj
    Geroj avatar
    6 posts
    Member since:
    Jun 2016

    Posted 24 Jun Link to this post

    Hi Iliana Nikolova,

    I'm trying to have the same behavior shown in this dojo example . In this dojo example, the stack depends on the field "name"  of each series.If the name is "gold medals" the data in the column corresponding to the name is shown in gold, if it's silver it is shown in silver etc..

    In my case, I want it to depend on the field "stack".

    Here is how my series are defined

     {  
          "stack":true,
          "ID":0,
          "type":"column",
          "field":"value",
          "categoryField":"categoryField",
          "data":[  
             {  
                "value":0,
                "categoryField":0,
                "stack":"stack1"
             },
             {  
                "value":1,
                "categoryField":0,
                "stack":"stack3"
             },
             {  
                "value":2,
                "categoryField":0,
                "stack":"stack2"
             },
             {  
                "value":3,
                "categoryField":0,
                "stack":"stack1"
             },
             {  
                "value":4,
                "categoryField":0,
                "stack":"stack2"
             },
             {  
                "value":5,
                "categoryField":0,
                "stack":"stack3"
             }
          ]
       },
       {  
          "stack":true,
          "ID":1,
          "type":"column",
          "field":"value",
          "categoryField":"categoryField",
          "data":[  
             {  
                "value":1,
                "categoryField":1,
                "stack":"stack3"
             },
             {  
                "value":2,
                "categoryField":1,
                "stack":"stack2"
             },
             {  
                "value":3,
                "categoryField":1,
                "stack":"stack1"
             },
             {  
                "value":4,
                "categoryField":1,
                "stack":"stack2"
             },
             {  
                "value":5,
                "categoryField":1,
                "stack":"stack3"
             },
             {  
                "value":6,
                "categoryField":1,
                "stack":"stack1"
             }
          ]
       },
       {  
          "stack":true,
          "ID":2,
          "type":"column",
          "field":"value",
          "categoryField":"categoryField",
          "data":[  
             {  
                "value":2,
                "categoryField":2,
                "stack":"stack2"
             },
             {  
                "value":3,
                "categoryField":2,
                "stack":"stack1"
             },
             {  
                "value":4,
                "categoryField":2,
                "stack":"stack2"
             },
             {  
                "value":5,
                "categoryField":2,
                "stack":"stack3"
             },
             {  
                "value":6,
                "categoryField":2,
                "stack":"stack1"
             },
             {  
                "value":7,
                "categoryField":2,
                "stack":"stack3"
             }
          ]
       },.....

    Is there any way to achieve this without changing my data structure to much ?

    Regards,

    Geroj

  5. Answer
    Iliana Nikolova
    Admin
    Iliana Nikolova avatar
    2595 posts

    Posted 28 Jun Link to this post

    Hi Geroj,

    Kendo UI Chart cannot be bound to a similar dataSource - it should be bound to an array of objects. Take a look at the modified dojo which demonstrates a possible implementation of the desired outcome.

    Regards,
    Iliana Nikolova
    Telerik
     
    Get started with Kendo UI in days. Online training courses help you quickly implement components into your apps.
     
  6. Geroj
    Geroj avatar
    6 posts
    Member since:
    Jun 2016

    Posted 28 Jun in reply to Iliana Nikolova Link to this post

    Hi Iliana Nikolova,

    Prefect , now I understand. 

    Thank you very much !!

    Geroj

Back to Top
Kendo UI is VS 2017 Ready