Pie Chart Items

[Afaan]

Hi, I have a pie chart being populated by data through an SQL stored procedure. I have about 30 different items to be displayed, however the pie chart does not seem to display more than 7 or 8 colours. Is there a way to display each item in a different colour? Thanks.

[Giuseppe]

Hello Afaan,

The default palette does not contain 30 distinct colors and that is why it iterates over the available 7 or 8 colors. You can achieve the desired functionality by using a custom palette like this:

<telerik:RadChart ID="RadChart1" runat="server" SeriesPalette="CustomPalette">
    <Series>
        <telerik:ChartSeries Name="Series 1" Type="Pie">
            <Items>
                <telerik:ChartSeriesItem Name="Item 2" YValue="6">
                </telerik:ChartSeriesItem>
                <telerik:ChartSeriesItem Name="Item 3" YValue="3">
                </telerik:ChartSeriesItem>
                <telerik:ChartSeriesItem Name="Item 4" YValue="1">
                </telerik:ChartSeriesItem>
                <telerik:ChartSeriesItem Name="Item 3" YValue="1">
                </telerik:ChartSeriesItem>
                <telerik:ChartSeriesItem Name="Item 4" YValue="1">
                </telerik:ChartSeriesItem>
                <telerik:ChartSeriesItem Name="Item 2" YValue="6">
                </telerik:ChartSeriesItem>
                <telerik:ChartSeriesItem Name="Item 3" YValue="3">
                </telerik:ChartSeriesItem>
                <telerik:ChartSeriesItem Name="Item 4" YValue="1">
                </telerik:ChartSeriesItem>
                <telerik:ChartSeriesItem Name="Item 3" YValue="1">
                </telerik:ChartSeriesItem>
                <telerik:ChartSeriesItem Name="Item 4" YValue="1">
                </telerik:ChartSeriesItem>
                <telerik:ChartSeriesItem Name="Item 2" YValue="6">
                </telerik:ChartSeriesItem>
                <telerik:ChartSeriesItem Name="Item 3" YValue="3">
                </telerik:ChartSeriesItem>
                <telerik:ChartSeriesItem Name="Item 4" YValue="1">
                </telerik:ChartSeriesItem>
                <telerik:ChartSeriesItem Name="Item 3" YValue="1">
                </telerik:ChartSeriesItem>
                <telerik:ChartSeriesItem Name="Item 4" YValue="1">
                </telerik:ChartSeriesItem>
            </Items>
        </telerik:ChartSeries>
    </Series>
    <CustomPalettes>
        <telerik:Palette Name="CustomPalette">
            <Items>
                <telerik:PaletteItem MainColor="Red" SecondColor="Red">
                </telerik:PaletteItem>
                <telerik:PaletteItem MainColor="White">
                </telerik:PaletteItem>
                <telerik:PaletteItem MainColor="Green">
                </telerik:PaletteItem>
                <telerik:PaletteItem MainColor="Bisque">
                </telerik:PaletteItem>
                <telerik:PaletteItem MainColor="Tan">
                </telerik:PaletteItem>
                <telerik:PaletteItem MainColor="Violet">
                </telerik:PaletteItem>
                <telerik:PaletteItem MainColor="Wheat">
                </telerik:PaletteItem>
                <telerik:PaletteItem MainColor="DArkCyan">
                </telerik:PaletteItem>
                <telerik:PaletteItem MainColor="DarkBlue">
                </telerik:PaletteItem>
                <telerik:PaletteItem MainColor="Chocolate">
                </telerik:PaletteItem>
                <telerik:PaletteItem MainColor="Beige">
                </telerik:PaletteItem>
                <telerik:PaletteItem MainColor="LightBlue">
                </telerik:PaletteItem>
                <telerik:PaletteItem MainColor="AliceBlue">
                </telerik:PaletteItem>
                <telerik:PaletteItem MainColor="Green">
                </telerik:PaletteItem>
                <telerik:PaletteItem MainColor="Lime" SecondColor="Lime">
                </telerik:PaletteItem>
            </Items>
        </telerik:Palette>
    </CustomPalettes>
</telerik:RadChart>

Hope this helps.







Regards,
Manuel
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.

[Michelle]

Hi

How can we do this at code-behind?

CustomPalettesCollection paletteCollection = new CustomPalettesCollection();
        Palette p = new Palette();
        PaletteItem pItem1 = new PaletteItem();
        pItem1.MainColor = System.Drawing.Color.Rad;
        PaletteItem pItem2 = new PaletteItem();
        pItem2.MainColor = System.Drawing.Color.Green;
        p.Items.Add(pItem1);
        p.Items.Add(pItem2);
        paletteCollection.Add(p);

I have tried this, but it doesnt seems to work.

[Giuseppe]

Hi Michelle,

You can achieve the desired functionality in code behind like this:

protected void Page_Load(object sender, EventArgs e)
{
    Palette customPalette = new Palette("CustomPalette");
    PaletteItem paletteItem = new PaletteItem();
    paletteItem.MainColor = Color.Red;
    customPalette.Items.Add(paletteItem);

    PaletteItem paletteItem2 = new PaletteItem();
    paletteItem2.MainColor = Color.Green;
    customPalette.Items.Add(paletteItem2);

    PaletteItem paletteItem3 = new PaletteItem();
    paletteItem3.MainColor = Color.Blue;
    customPalette.Items.Add(paletteItem3);

    PaletteItem paletteItem4 = new PaletteItem();
    paletteItem4.MainColor = Color.Purple;
    customPalette.Items.Add(paletteItem4);

    RadChart1.CustomPalettes.Add(customPalette);
    RadChart1.SeriesPalette = "CustomPalette";
}

Hope this helps.


Greetings,
Manuel
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.

[Michelle]

Hi Manuel

Thanks for your promptly reply.
I have tried putting the above code to Page_Load however, it still doesn't work. Besides that, I'm actually binding my RadChart using DataGroupColumn, I wonder if  Series Palette can be applied here.

My codes are as below:
--------------------------------------------------------------------
Chart  objChart = new Chart();
DataTable dt = objCA.GetData();

RadChart RadChart1 = new RadChart();
RadChart1.DataGroupColumn = "Rating";
RadChart1.DataManager.ValuesXColumn = "Date";
RadChart1.DataManager.ValuesYColumns = new string[1]{"Value"};

RadChart1.DataSource = dt;
RadChart1.DataBind();
RadChart1.Skin = "Telerik";
--------------------------------------------------------------------

[Giuseppe]

Hi Michelle,

Unfortunately we must admit there is a problem with the custom palettes functionality when a preset skin is used (that is different than the default one). We have updated your Telerik points for the report and we will forward this to our developers for further review.

Sorry for the inconvenience.


Kind regards,
Manuel
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.