1
Reply

asp.net donut chart telerik databinding

Liaqat Shaikh

Liaqat Shaikh

Sep 12 2017 3:24 PM
186
i'm developing web application on webforms so on client dashboard i've use telerik chart (Donut) its work's on default coding which i see on telerik website but i need to know how to bind sql server data on that chart
<telerik:RadScriptManager runat="server" ID="RadScriptManager1" />
<telerik:RadSkinManager ID="RadSkinManager1" runat="server" ShowChooser="true" />
<div class="demo-containers">
<div class="demo-container">
<telerik:RadHtmlChart runat="server" ID="DonutChart1" Width="520" Height="500" Transitions="true" Skin="Silk">
<ChartTitle Text="OS Usage Statistics for December 2012">
<Appearance Align="Center" Position="Top">
</Appearance>
</ChartTitle>
<Legend>
<Appearance Position="Right" Visible="true">
</Appearance>
</Legend>
<PlotArea>
<Series>
<telerik:DonutSeries StartAngle="90" HoleSize="65">
<LabelsAppearance Position="Center" DataFormatString="{0} %" Visible="true"></LabelsAppearance>
<TooltipsAppearance Color="White" DataFormatString="{0}%"></TooltipsAppearance>
<SeriesItems>
<telerik:PieSeriesItem BackgroundColor="#00adcc" Exploded="false" Name="Win7" Y="55.6"></telerik:PieSeriesItem>
<telerik:PieSeriesItem BackgroundColor="#cccccc" Exploded="false" Name="Win8" Y="2.5"></telerik:PieSeriesItem>
<telerik:PieSeriesItem BackgroundColor="#999999" Exploded="false" Name="Vista" Y="2.8"></telerik:PieSeriesItem>
<telerik:PieSeriesItem BackgroundColor="#888888" Exploded="false" Name="NT" Y="1.8"></telerik:PieSeriesItem>
<telerik:PieSeriesItem BackgroundColor="#777777" Exploded="false" Name="WinXP" Y="21.1"></telerik:PieSeriesItem>
<telerik:PieSeriesItem BackgroundColor="#666666" Exploded="false" Name="Linux" Y="4.7"></telerik:PieSeriesItem>
<telerik:PieSeriesItem BackgroundColor="#555555" Exploded="false" Name="Mac" Y="8.7"></telerik:PieSeriesItem>
<telerik:PieSeriesItem BackgroundColor="#444444" Exploded="false" Name="Mobile" Y="2.2"></telerik:PieSeriesItem>
</SeriesItems>
</telerik:DonutSeries>
</Series>
</PlotArea>
</telerik:RadHtmlChart>
</div>
</div>
<telerik:RadAjaxManager runat="server" ID="theAjaxMaanger">
<AjaxSettings>
<telerik:AjaxSetting AjaxControlID="demoConfigurator">
<UpdatedControls>
<telerik:AjaxUpdatedControl ControlID="demoConfigurator" LoadingPanelID="RadAjaxLoadingPanel1" />
<telerik:AjaxUpdatedControl ControlID="DonutChart1" LoadingPanelID="RadAjaxLoadingPanel1" />
</UpdatedControls>
</telerik:AjaxSetting>
</AjaxSettings>
</telerik:RadAjaxManager>
<telerik:RadAjaxLoadingPanel runat="server" ID="RadAjaxLoadingPanel1" Skin="Silk">
</telerik:RadAjaxLoadingPanel>
C# code is that two thing need to show on donut piecostbudget piefirst
SqlConnection con = new SqlConnection(ConfigurationManager.ConnectionStrings["constr"].ConnectionString);         con.Open(); SqlDataReader myReader = null; SqlCommand myCommand = new SqlCommand("select ( select sum([Budget Estimates 2017-18]) AS [FUNDWISE] from [dbo].[budgetbook-17-18] where Fund = '" + scnum.Text + "' ) , sum([Budget Estimates 2017-18]) as [costwise] from [dbo].[budgetbook-17-18] where Cost_ctr ='" + costcenter.Text + "'", con);          myReader = myCommand.ExecuteReader(); while (myReader.Read()) { string totalfund; string totalcostbudget;              totalfund = (myReader[0].ToString());             totalcostbudget = (myReader[1].ToString()); //Convert.ToDouble(totalcostbudget) / Convert.ToDouble(totalfund) * 360 = a;              a = Convert.ToDouble(totalcostbudget);             b = Convert.ToDouble(totalfund);              piecostbudget = a / b * 100; } Double piefirst = pie100 - piecostbudget; Math.Round(piecostbudget); Math.Round(piefirst);          con.Close(); } 



Answers (1)