This is a migrated thread and some comments may be shown as answers.

Pie chart won't display

2 Answers 145 Views
Chart
This is a migrated thread and some comments may be shown as answers.
This question is locked. New answers and comments are not allowed.
Thaman
Top achievements
Rank 1
Thaman asked on 08 Dec 2017, 08:19 PM

Hi,

I have couple of question.

I am creating multiple Pie chart, where some of are not displaying. Also with different colors. 

1. code is same for all pie chart except DataSourceID but code is not displaying data.

2. also I have different color than I what I set it up.

3. legend is not displaying percentage for all.

 

 

<div id="chartcontainer3">
                                    <telerik:RadHtmlChart runat="server" ID="RadHtmlPY3Chart" Width="700px" Height="400px" DataSourceID="dsPY3Results" InvokeLoadData="OnPageLoad">
                                        <Legend>
                                            <Appearance Position="Right" BackgroundColor="#cccccc" Visible="true">
                                                <TextStyle FontSize="14" Bold="true" />
                                            </Appearance>
                                        </Legend>
                                        <PlotArea>
                                            <Series>
                                                <telerik:PieSeries Name="pieSeries" NameField="COLNAME" DataFieldY="COLDATA">
                                                    <LabelsAppearance>
                                                        <TextStyle Bold="true" FontSize="14" />
                                                        <ClientTemplate>         
                                                            # if (dataItem.COLDATA != 0) {# #= kendo.format(\'{0:C}\', dataItem.COLDATA)# #} else {#  #} #          
                                                            <%--#= kendo.format(\'{0:C}\', dataItem.COLDATA)#--%>
                                                        </ClientTemplate>
                                                    </LabelsAppearance>
                                                    <TooltipsAppearance Visible="false">
                                                    </TooltipsAppearance>
                                                </telerik:PieSeries>
                                            </Series>
                                        </PlotArea>
                                    </telerik:RadHtmlChart>
                                </div>

 

data is :  COLNAME= obligate, commited, uncommited

COLDATA: 2546905391.14, 0, 6882950.99

PCT: 0.9973, 0, 0.0027

To setup color: 

function pageLoad() {
        var CY_Chart = $find("<%=RadHtmlCYChart.ClientID%>");
        CY_Chart._chartObject._plotArea.options.seriesColors;
        for (var i = 0; i < 10; i++) {
            if (i == 0) { CY_Chart._chartObject._plotArea.options.seriesColors[i] = "Green"; }
            else if (i == 1) { CY_Chart._chartObject._plotArea.options.seriesColors[i] = "Yellow"; }
            else if (i == 2) { CY_Chart._chartObject._plotArea.options.seriesColors[i] = "Red"; }
        }

        CY_Chart._chartObject.options.legend.labels.template = "#=kendo.format(\'{0:C}\',dataItem.COLNAME)#,   #=kendo.format(\'{0:P}\',dataItem.PCT)#";
        CY_Chart.repaint();

        var PY1_Chart = $find("<%=RadHtmlPY1Chart.ClientID%>");
        PY1_Chart._chartObject._plotArea.options.seriesColors;
        for (var i = 0; i < 10; i++) {
            if (i == 0) { PY1_Chart._chartObject._plotArea.options.seriesColors[i] = "Green"; }
            else if (i == 1) { PY1_Chart._chartObject._plotArea.options.seriesColors[i] = "Yellow"; }
            else if (i == 2) { PY1_Chart._chartObject._plotArea.options.seriesColors[i] = "Red"; }
        }
        PY1_Chart._chartObject.options.legend.labels.template = "#=kendo.format(\'{0:C}\',dataItem.COLNAME)#,   #=kendo.format(\'{0:P}\',dataItem.PCT)#";
        PY_Chart.repaint();

        if (isChartEmpty(CY_Chart)) {
            document.getElementById("pieCY").style.display = "none";
        }
        if (isChartEmpty(PY1_Chart)) {
            document.getElementById("piePY1").style.display = "none";
        }

 

Thanks. 

 

     

 

2 Answers, 1 is accepted

Sort by
0
Thaman
Top achievements
Rank 1
answered on 08 Dec 2017, 08:23 PM
Attached is the screenshot 
0
Lance | Senior Manager Technical Support
Telerik team
answered on 11 Dec 2017, 07:22 PM
Hi Thaman,

You've submitted this post under the UI for Universal Windows Platform (UWP) product forums, however it looks like you're using RadHtmlChart from the UI for ASP.NET AJAX product. 

For your convenience, I will move this thread, and the other one you've opened, to the UI for ASP.NET AJAX forums instead.


Note:
If you'd like to open a support ticket instead, you can do so here (if necessary, request a trial extension here).

Regards,
Lance | Tech Support Engineer, Sr.
Progress Telerik
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
Tags
Chart
Asked by
Thaman
Top achievements
Rank 1
Answers by
Thaman
Top achievements
Rank 1
Lance | Senior Manager Technical Support
Telerik team
Share this question
or