Hitachi Vantara Pentaho Community Forums
Page 1 of 2 12 LastLast
Results 1 to 10 of 12

Thread: CCC Charts : Outer Ring to donut/pie (Inner ring to donut/pie)

  1. #1
    Join Date
    Feb 2013
    Posts
    530

    Default CCC Charts : Outer Ring to donut/pie (Inner ring to donut/pie)

    Hi Leao,

    Just would like to give more insight & great look for pie/donut charts and found below from your work out ..

    http://jsfiddle.net/duarteleao/wBzGD/

    How to make use of this code for pie/donut chart ?

    Have tried in PreExecution with no succeed(and/or other code areas).... How can I transfer the code in CDE code execution areas to make it work ?

    In enhancement to ring..
    1) Is slice colored outer ring possible ? i.e., for instance there are 3 slices on pie chart.. red, green, black.. Is there any possibility to get outer ring in these 3 colors covering the slices.
    2) How to do the same inside of donut ? ( 1 outer ring , 1 inner ring in middle slices to donut - Is it possible ?)...

    Thank you.

  2. #2
    Join Date
    Feb 2013
    Posts
    530

    Default

    have got outer ring with extension point addition...

    1) In the same way inner ring ..
    2) ring has to take slice colors as explained in point 1.

    Also,
    We have converted, Tree Map chart to sun burst chart few days back...

    I have given slice_add =function { ring code} for this converted chart in extension points and caught with Error Processing component..

    How can I make use of slice_add code for this chart also ?

    Thank you.
    Last edited by sadakar; 07-29-2014 at 04:34 AM.

  3. #3
    Join Date
    Mar 2012
    Posts
    645

    Default

    So you've managed to put the code working in preExecution - it should work without problems.

    For the outer ring to a pie plot. Do you want an outer ring for showing that a slice is selected or being hovered over?
    The same question applies to the inner ring of a donut plot.

    There's a CCC site example showing two separate concentric pie plots: http://www.webdetails.pt/ctools/ccc....oncentric-pies.

    If what you want is for representation of selected/active slices, that could be a killer solution...
    Having a pv.Dot for that, like in the original jsFiddle example also does not work.
    You'd need to slice_add a pv.Wedge mark to achieve that.

    Do you want to add an outer ring to the sunburst plot?
    What would that be used for (so that I can guide you better)?

  4. #4

    Default

    Hi Duarte,

    I'm working with a pie and it's ok with the result as you don't have to put any javascript code. When I want to add inner pie I've got stuck. How can I modify the current pie chart in order to place the second inner pie? Detailed question is how to change chart definitions as "plots" (in order to indicate the dataPart fo each plot -main and inner) using the current set of data returned by the 'DataSource'? and In which event I would add the javascript function? or using the extension points? (I don't know!)
    I really appreciate your help!
    PD: Actually, I've already read the post published by Pedro in his blog, but I didn't get at all! (It could be because is focused creating the char using the new function!).
    Regards

    Jose.

  5. #5

    Default

    You must set "plots" properties in preExecution:

    Code:
    function() {
        $.extend(this.chartDefinition, {
            plots: [
            // ...
            ] 
        });
    }
    Last edited by emicarnicero; 08-04-2014 at 02:21 PM.

  6. #6
    Join Date
    Feb 2013
    Posts
    530

    Default

    Hi Leao,

    I've prepared my dataset as below to make dual level pie chart

    two plots are coming as expected by providing the code in PreExecution section as it is(my column names are same as used by you at webdetails.pt/ site).

    region brand quantity sales
    North West Best Choice 213000.0000 284830.0000
    North West CDR 176000.0000 240500.0000
    North West Choice 104000.0000 55120.0000
    North West High Top 94000.0000 175780.0000
    North West Tri-State 104000.0000 263120.0000
    North West Washington 83000.0000 236550.0000
    South West Best Choice 213000.0000 284830.0000
    South West CDR 176000.0000 240500.0000
    South West Choice 104000.0000 55120.0000
    South West High Top 94000.0000 175780.0000
    South West Tri-State 104000.0000 263120.0000
    South West Washington 83000.0000 236550.0000

    I'm getting same data on the slices ...
    Sample Image is :

    image.jpg

    Code I have written in PreExecution is :


    function f() {
    $.extend(this.chartDefinition, {

    // Data source
    crosstabMode: false,
    readers: ['region, brand, quantity, sales'],

    // Data
    dimensions: {
    // Dimension bound to "dataPart" is hidden by default
    region: {isHidden: false},
    // Sort brands
    brand: {comparer: def.ascending},
    // Notice the currency sign and the /1000 scale factor (the comma beside the dot).
    sales: {valueType: Number, format: "¤#,0,.0K"}
    },

    // Visual Roles
    visualRoles: {
    // Chart
    dataPart: 'region',

    // Main pLot
    value: 'sales',
    category: 'brand'
    },

    // Plots
    plots: [
    {
    // Main plot (outer)
    name: 'main',
    dataPart: 'North West',
    valuesLabelStyle: 'inside',
    valuesOptimizeLegibility: true,
    slice_innerRadiusEx: '60%',
    slice_strokeStyle: 'white'
    },
    {
    // Second plot (inner)
    name: 'inner',
    type: 'pie',
    dataPart: 'South West',
    valuesLabelStyle: 'inside',
    valuesOptimizeLegibility: true,
    slice_strokeStyle: 'white',
    slice_outerRadius: function() {
    return 0.5 * this.delegate(); // 50%
    }
    }


    ]
    });
    }


    Could you point me out where am I making mistake ?

    Thank you.
    Sadakar
    BI developer.

  7. #7

    Default

    I'm trying the same approach and don't get any result. I think is something with the chartDefinition object. It seems to be the variables were changed in the ctools version (I'm using 14.05.06).
    Last edited by josejcardenas; 08-05-2014 at 11:29 AM.

  8. #8
    Join Date
    Mar 2012
    Posts
    645

    Default

    Hi sadakar,

    your definition seems fine, and the results you show also seem to be OK :-)

    I mean, if you notice, in both data parts, i.e., for both the south and the north regions, a given brand has the same "sales" value.
    The "quantity" dimension is not being used (by any visual role).

  9. #9
    Join Date
    Mar 2012
    Posts
    645

    Default

    Hi jose,

    the "plots" option is new to the soon-to-be-released "14.07.29" version (at least I think it hasn't been released yet).
    It's already available in the trunk version.

  10. #10
    Join Date
    Feb 2016
    Posts
    2

    Default

    I try in CDE Dashboard editor make donut chart from pie chart
    Have tried in PreExecution:

    function() {
    $.extend(this.chartDefinition, {
    plots: [{
    slice_innerRadiusEx: '50%'
    }]});
    }

    With it, chart doesn`t appear without errors in console.
    Can anyone help?)

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
Privacy Policy | Legal Notices | Safe Harbor Privacy Policy

Copyright © 2005 - 2017 Pentaho Corporation. All Rights Reserved.