I'm new to the radchart databinding process and after spending an excessive amount of time trying to figure out why I'm not showing any return when I bind to the database I thought I'd ask the sea of experts. I'm sure this has been discussed but when I searched on databinding I only got three posts so please excuse if I am repeating something previously shown.
Attached is a screen shot of what I see currently. The XAxis labels (2008 2009 2010...) are pulled from the database and are displaying as I expected. What isn't showing are the values reflected in the rest of the table. This is pretty straightforward and I'm positive it is something exceptionally simple I'm overlooking but can anyone shed some light on what that might be? I've gotten lost in the mixed examples that came with this add-on so I'm not sure where I'm crossing signals.
Below is the code for my chart.aspx page and it's code behind. The binding taking place in the code behind file is simply binding to a data object that I've created but isn't really relevant to this issue since all it does is open,get, close the database.
Thanks in advance.
Tony
Chart.aspx:
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="chart.aspx.cs" Inherits="myworkcalpassplus.chart" %>
<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server">
<telerik:RadScriptManager runat="server" ID="RadScriptManager1" />
<telerik:RadSkinManager ID="QsfSkinManager" runat="server" ShowChooser="true" Visible="false"/>
<telerik:RadFormDecorator ID="QsfFromDecorator" runat="server" DecoratedControls="All" EnableRoundedCorners="false" />
<div style="width: 800px; height: 500px;">
<telerik:RadHtmlChart runat="server" Width="800px" Height="500px" ID="RadHtmlChart1" >
<PlotArea>
<YAxis MaxValue="100" MinValue="0" Step="10" >
<TitleAppearance Text="Units"></TitleAppearance>
</YAxis>
<XAxis DataLabelsField="AcademicYear"></XAxis>
<Series>
<telerik:ColumnSeries Name="Average" DataFieldY="Average" >
<TooltipsAppearance Color="White" BackgroundColor="Orange" DataFormatString="P"/>
</telerik:ColumnSeries>
<telerik:ColumnSeries Name="Top 10 Region" DataFieldY="Top10Region">
<TooltipsAppearance Color="White" BackgroundColor="Orange" DataFormatString="P"/>
</telerik:ColumnSeries>
<telerik:ColumnSeries Name="Statewide" DataFieldY="Statewide">
<TooltipsAppearance Color="White" BackgroundColor="Orange" DataFormatString="P"/>
</telerik:ColumnSeries>
</Series>
</PlotArea>
<Legend>
<Appearance Visible="false">
</Appearance>
</Legend>
<ChartTitle Text="STEM Dashboard">
</ChartTitle>
</telerik:RadHtmlChart>
</div>
</form>
</body>
</html>
Codebehind:
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using DataAccess;
namespace myworkcalpassplus
{
public partial class chart : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
Data chartData = new Data();
RadHtmlChart1.DataSource = chartData.GetChartData();
RadHtmlChart1.DataBind();
}
}
}
}
Mind you I was following along with several examples and that's what I ended up with expecting just to see a simple chart display.
Thanks again!
Attached is a screen shot of what I see currently. The XAxis labels (2008 2009 2010...) are pulled from the database and are displaying as I expected. What isn't showing are the values reflected in the rest of the table. This is pretty straightforward and I'm positive it is something exceptionally simple I'm overlooking but can anyone shed some light on what that might be? I've gotten lost in the mixed examples that came with this add-on so I'm not sure where I'm crossing signals.
Below is the code for my chart.aspx page and it's code behind. The binding taking place in the code behind file is simply binding to a data object that I've created but isn't really relevant to this issue since all it does is open,get, close the database.
Thanks in advance.
Tony
Chart.aspx:
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="chart.aspx.cs" Inherits="myworkcalpassplus.chart" %>
<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server">
<telerik:RadScriptManager runat="server" ID="RadScriptManager1" />
<telerik:RadSkinManager ID="QsfSkinManager" runat="server" ShowChooser="true" Visible="false"/>
<telerik:RadFormDecorator ID="QsfFromDecorator" runat="server" DecoratedControls="All" EnableRoundedCorners="false" />
<div style="width: 800px; height: 500px;">
<telerik:RadHtmlChart runat="server" Width="800px" Height="500px" ID="RadHtmlChart1" >
<PlotArea>
<YAxis MaxValue="100" MinValue="0" Step="10" >
<TitleAppearance Text="Units"></TitleAppearance>
</YAxis>
<XAxis DataLabelsField="AcademicYear"></XAxis>
<Series>
<telerik:ColumnSeries Name="Average" DataFieldY="Average" >
<TooltipsAppearance Color="White" BackgroundColor="Orange" DataFormatString="P"/>
</telerik:ColumnSeries>
<telerik:ColumnSeries Name="Top 10 Region" DataFieldY="Top10Region">
<TooltipsAppearance Color="White" BackgroundColor="Orange" DataFormatString="P"/>
</telerik:ColumnSeries>
<telerik:ColumnSeries Name="Statewide" DataFieldY="Statewide">
<TooltipsAppearance Color="White" BackgroundColor="Orange" DataFormatString="P"/>
</telerik:ColumnSeries>
</Series>
</PlotArea>
<Legend>
<Appearance Visible="false">
</Appearance>
</Legend>
<ChartTitle Text="STEM Dashboard">
</ChartTitle>
</telerik:RadHtmlChart>
</div>
</form>
</body>
</html>
Codebehind:
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using DataAccess;
namespace myworkcalpassplus
{
public partial class chart : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
Data chartData = new Data();
RadHtmlChart1.DataSource = chartData.GetChartData();
RadHtmlChart1.DataBind();
}
}
}
}
Mind you I was following along with several examples and that's what I ended up with expecting just to see a simple chart display.
Thanks again!
3 Answers, 1 is accepted
0
Tony
Top achievements
Rank 1
Rank 1
answered on 01 Oct 2014, 10:46 PM
Here is the second screen grab showing my chart is it displays right now. I guess it didn't attach to the original post.
Apologies.
Apologies.
0
Tony
Top achievements
Rank 1
Rank 1
answered on 02 Oct 2014, 05:04 PM
I just realized I posted the RadChart in the title in error. It should be RadHtmlChart, not RadChart.
0
Hi ,
From the provided snap shot it seems that passed values have "%" sign which mean they are of string type. Generally values for the y-axis accept decimal values and not string. For example:
ASPX:
C#:
Regards,
Danail Vasilev
Telerik
From the provided snap shot it seems that passed values have "%" sign which mean they are of string type. Generally values for the y-axis accept decimal values and not string. For example:
ASPX:
<form id="form1" runat="server"> <telerik:RadScriptManager runat="server" ID="RadScriptManager1" /> <telerik:RadSkinManager ID="QsfSkinManager" runat="server" ShowChooser="true" Visible="false" /> <telerik:RadFormDecorator ID="QsfFromDecorator" runat="server" DecoratedControls="All" EnableRoundedCorners="false" /> <div style="width: 800px; height: 500px;"> <telerik:RadHtmlChart runat="server" Width="800px" Height="500px" ID="RadHtmlChart1"> <PlotArea> <YAxis MaxValue="100" MinValue="0" Step="10"> <TitleAppearance Text="Units"></TitleAppearance> </YAxis> <XAxis DataLabelsField="AcademicYear"></XAxis> <Series> <telerik:ColumnSeries Name="Average" DataFieldY="Average"> <TooltipsAppearance Color="White" BackgroundColor="Orange" DataFormatString="P" /> </telerik:ColumnSeries> <telerik:ColumnSeries Name="Top 10 Region" DataFieldY="Top10Region"> <TooltipsAppearance Color="White" BackgroundColor="Orange" DataFormatString="P" /> </telerik:ColumnSeries> <telerik:ColumnSeries Name="Statewide" DataFieldY="Statewide"> <TooltipsAppearance Color="White" BackgroundColor="Orange" DataFormatString="P" /> </telerik:ColumnSeries> </Series> </PlotArea> <Legend> <Appearance Visible="false"> </Appearance> </Legend> <ChartTitle Text="STEM Dashboard"> </ChartTitle> </telerik:RadHtmlChart> </div></form>C#:
protected void Page_Load(object sender, EventArgs e){ if (!IsPostBack) { DataTable chartData = GetData(); RadHtmlChart1.DataSource = chartData; RadHtmlChart1.DataBind(); }}protected DataTable GetData(){ DataTable dt = new DataTable(); dt.Columns.Add("ID", typeof(int)); dt.Columns.Add("AcademicYear", typeof(string)); dt.Columns.Add("Average", typeof(decimal)); dt.Columns.Add("Top10Region", typeof(decimal)); dt.Columns.Add("Statewide", typeof(decimal)); dt.Rows.Add(1, "2008-2009", 45.6, 16.4, 66.6); dt.Rows.Add(2, "2009-2010", 49, null, 73.6); dt.Rows.Add(3, "2010-2011", 49.6, 27.3, 81.8); return dt;}Regards,
Danail Vasilev
Telerik
Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.