Click here to Skip to main content
14,216,534 members
Rate this:
Please Sign up or sign in to vote.
See more:
I am a little bit new to the ASP.NET world. Now, I am developing a web application that contains a dashboard. And of course, I am using the chart control that comes with the Visual Studio 2010.
Anyway, I want to design a Line or Bar chart that shows the result of a query that gives me the total number of participants in each division in the company based on month. As you know, the X-Axis will show the months and the Y-Axis will show the number of participants. **Now I need at least for 5 lines or columns since I have 5 divisions in the company.** When I put the chart in the web page and configured it with the DataSource and the SQL query, it showed me only one line or one column and I don't know why. So how can I be able to show 5 lines or Columns in the Line or Bar Chart?

This is the ASP.NET code for the chart

<pre>
<table class="sampleTable">
				<tr>
					<td class="tdchart" width="412">
                        <asp:CHART id="Chart2" runat="server" 

                            BackColor="243, 223, 193" ImageLocation="~/TempImages/ChartPic_#SEQ(300,3)" 

                            Width="412px" Height="296px" BorderDashStyle="Solid" 

                            BackGradientStyle="TopBottom" BorderWidth="2px" BorderColor="#B54001" 

                            DataSourceID="SqlDataSource3" ImageType="Bmp">
							<legends>
								<asp:Legend Enabled="True" IsTextAutoFit="False" Name="Default" BackColor="Transparent" Font="Trebuchet MS, 8.25pt, style=Bold"></asp:Legend>
							</legends>
							<borderskin SkinStyle="Emboss"></borderskin>
							<series>
								<asp:Series MarkerSize="8" BorderWidth="3" XValueType="Double" Name="Series1" 

                                    ChartType="Line" MarkerStyle="Circle" ShadowColor="Black" 

                                    BorderColor="180, 26, 59, 105" Color="220, 65, 140, 240" ShadowOffset="2" 

                                    YValueType="Double" XValueMember="Month" 

                                    YValueMembers="Total Number of Quizzes">
                                </asp:Series>
                                <asp:Series MarkerSize="9" BorderWidth="3" XValueType="Double" Name="Series2" 

                                    ChartType="Line" MarkerStyle="Diamond" ShadowColor="Black" 

                                    BorderColor="180, 26, 59, 105" Color="220, 224, 64, 10" 

                                    ShadowOffset="2" YValueType="Double">
                                </asp:Series>
							</series>
							<chartareas>
								<asp:ChartArea Name="ChartArea1" BorderColor="64, 64, 64, 64" BorderDashStyle="Solid" BackSecondaryColor="White" BackColor="OldLace" ShadowColor="Transparent" BackGradientStyle="TopBottom">
									<area3dstyle Rotation="25" Perspective="9" LightStyle="Realistic" Inclination="40" IsRightAngleAxes="False" WallWidth="3" IsClustered="False" />
									<axisy LineColor="64, 64, 64, 64">
										<LabelStyle Font="Trebuchet MS, 8.25pt, style=Bold" />
										<MajorGrid LineColor="64, 64, 64, 64" />
									</axisy>
									<axisx LineColor="64, 64, 64, 64">
										<LabelStyle Font="Trebuchet MS, 8.25pt, style=Bold" />
										<MajorGrid LineColor="64, 64, 64, 64" />
									</axisx>
								</asp:ChartArea>
							</chartareas>
						</asp:CHART>
                        <asp:SqlDataSource ID="SqlDataSource3" runat="server" 

                            ConnectionString="<%$ ConnectionStrings:testConnectionString %>" SelectCommand="SELECT     COUNT(DISTINCT dbo.UserQuiz.QuizID) AS [Total Number of Quizzes], dbo.Divisions.DivisionName, DATENAME(Month, dbo.UserQuiz.DateTimeComplete) 
                      AS Month
FROM         dbo.UserQuiz INNER JOIN
                      dbo.Quiz ON dbo.UserQuiz.QuizID = dbo.Quiz.QuizID INNER JOIN
                      dbo.employee ON dbo.UserQuiz.Username = dbo.employee.Username INNER JOIN
                      dbo.Divisions ON dbo.employee.DivisionCode = dbo.Divisions.SapCode
GROUP BY dbo.Divisions.DivisionName, DATENAME(Month, dbo.UserQuiz.DateTimeComplete)">
                        </asp:SqlDataSource>
                    </td>
					<td valign="top">
						<table class="controls" cellpadding="4">
							<tr>
								<td class="label">Chart Type:</td>
								<td><asp:dropdownlist id="ChartTypeList" runat="server" AutoPostBack="True">
										<asp:ListItem Value="Line" Selected="True">Line</asp:ListItem>
										<asp:ListItem Value="Spline">Spline</asp:ListItem>
										<asp:ListItem Value="StepLine">StepLine</asp:ListItem>
									</asp:dropdownlist></td>
							</tr>
							<tr>
								<td class="label">Point Labels:</td>
								<td><asp:dropdownlist id="PointLabelsList" runat="server" AutoPostBack="True">
										<asp:ListItem Value="None" Selected="True">None</asp:ListItem>
										<asp:ListItem Value="Auto">Auto</asp:ListItem>
										<asp:ListItem Value="TopLeft">TopLeft</asp:ListItem>
										<asp:ListItem Value="Top">Top</asp:ListItem>
										<asp:ListItem Value="TopRight">TopRight</asp:ListItem>
										<asp:ListItem Value="Right">Right</asp:ListItem>
										<asp:ListItem Value="BottomRight">BottomRight</asp:ListItem>
										<asp:ListItem Value="Bottom">Bottom</asp:ListItem>
										<asp:ListItem Value="BottomLeft">BottomLeft</asp:ListItem>
										<asp:ListItem Value="Left">Left</asp:ListItem>
										<asp:ListItem Value="Center">Center</asp:ListItem>
									</asp:dropdownlist></td>
							</tr>
							<tr>
								<td class="label">Show X Axis Margins:</td>
								<td><asp:CheckBox id="ShowMargins" runat="server" Text="" AutoPostBack="True" Checked="True"></asp:CheckBox></td>
							</tr>
							<tr>
								<td class="label">Show as 3D:</td>
								<td><asp:checkbox id="checkBoxShow3D" tabIndex="6" runat="server" AutoPostBack="True" Text=""></asp:checkbox></td>
							</tr>
						</table>
					</td>
				</tr>
			</table>


Also, up to now I don't have anything in the Code-Behind class.
Posted
Updated 8-Dec-11 5:20am
v3

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)




CodeProject, 503-250 Ferrand Drive Toronto Ontario, M3C 3G8 Canada +1 416-849-8900 x 100