I draw the Graph ,did n't get correct Result Give me correct Solutions.

[Kannadasan]

Dear Team,

I draw the Chart in my application based On multiple Series type Chart .i get one series result is correct.but Other series are draw on lost x-axies values Based graph generate.All series are lost x -axies based value graph generated..

i attached my Sample Code.
 first,
1.Aspx page,
2.script for database table..
3.screen shot for my output..and i want output is marked on screen.

with Regards,
S.Kannadasan

cs code

using

 

System;

 

 

using

 

System.Collections;

 

 

using

 

System.Configuration;

 

 

using

 

System.Data;

 

 

using

 

System.Linq;

 

 

using

 

System.Web;

 

 

using

 

System.Web.Security;

 

 

using

 

System.Web.UI;

 

 

using

 

System.Web.UI.HtmlControls;

 

 

using

 

System.Web.UI.WebControls;

 

 

using

 

System.Web.UI.WebControls.WebParts;

 

 

using

 

System.Data.SqlClient;

 

 

using

 

Telerik.Charting;

 

 

using

 

System.Drawing;

 

 

public

 

partial class staggeredLine : System.Web.UI.Page

 

 

{

 

protected void Page_Load(object sender, EventArgs e)

 

{

 

 

SqlConnection dbCon;

 

 

 

if (!Page.IsPostBack)

 

{

dbCon =

 

new SqlConnection(ConfigurationManager.ConnectionStrings["bheldevConnectionString"].ConnectionString);

 

dbCon.Open();

InitRadChart2(dbCon);

dbCon.Close();

}

}

 

 

private void InitRadChart2(SqlConnection dbCon)

 

{

RadChart2.Appearance.BarOverlapPercent = 40;

RadChart2.Appearance.BarWidthPercent = 80;

RadChart2.PlotArea.Appearance.Dimensions.Margins.Left = Telerik.Charting.Styles.

 

Unit.Percentage(10);

 

RadChart2.PlotArea.Appearance.Dimensions.Margins.Bottom = Telerik.Charting.Styles.

 

Unit.Percentage(40);

 

RadChart2.PlotArea.Appearance.Dimensions.Margins.Right = Telerik.Charting.Styles.

 

Unit.Percentage(2);

 

RadChart2.PlotArea.XAxis.Appearance.MajorGridLines.Visible =

 

false;

 

RadChart2.PlotArea.YAxis.Appearance.MajorGridLines.Visible =

 

true;

 

 

 

// Loading all different years and initializing X axis items.

 

 

 

SqlDataAdapter adapter = new SqlDataAdapter("SELECT Distinct(BID_TIME) FROM BID_DETAILS where auc_code='7' ORDER BY BID_TIME ", dbCon);

 

 

 

DataSet ds = new DataSet();

 

adapter.Fill(ds);

RadChart2.PlotArea.XAxis.Clear();

RadChart2.PlotArea.XAxis.AutoScale =

 

false;

 

RadChart2.PlotArea.XAxis.IsZeroBased =

 

false;

 

RadChart2.PlotArea.YAxis.AxisMode =

 

ChartYAxisMode.Extended;

 

 

 

foreach (DataRow dbRow in ds.Tables[0].Rows)

 

{

RadChart2.PlotArea.XAxis.AddItem((dbRow[

 

"BID_TIME"]).ToString());

 

 

}

UpdateRadChart2(dbCon);

 

}

 

 

private void UpdateRadChart2(SqlConnection dbCon)

 

{

 

 

// Remove the previous series.

 

 

RadChart2.Series.Clear();

 

// Form sql query to the database.

 

 

 

//string sqlString = "SELECT auc_code, Vendor_id, BID_TIME, BID_PRICE FROM BID_DETAILS WHERE auc_code='7' ORDER BY auc_code, Vendor_id, BID_TIME, BID_PRICE";

 

 

 

string sqlString = "SELECT distinct Vendor_id FROM BID_DETAILS WHERE auc_code='7'";

 

 

 

//sqlString = String.Format(sqlString, dropDownCategory.SelectedIndex + 1);

 

 

 

SqlDataAdapter adapter = new SqlDataAdapter(sqlString, dbCon);

 

 

 

DataSet ds = new DataSet();

 

adapter.Fill(ds);

 

 

// Load data.

 

 

 

 

//ChartSeries currentSeries = null;

 

 

 

// int i = 0;

 

 

 

foreach (DataRow dbRow in ds.Tables[0].Rows)

 

{

 

 

 

ChartSeries currentSeries = null;

 

 

 

ChartSeriesItemsCollection Ds = new ChartSeriesItemsCollection();

 

currentSeries = RadChart2.CreateSeries((

 

string)dbRow["Vendor_id"], Color.Empty, Color.Empty, ChartSeriesType.Line);

 

currentSeries.Appearance.Border.Color =

 

Color.Black;

 

 

 

// currentSeries.Type = ChartSeriesType.Line;

 

 

currentSeries.Appearance.ShowLabels =

false;

 

 

 

//subcategory_id = dbRow["auc_code"];

 

 

 

//if (subcategory_id != oldsubcategory_id)

 

 

 

//{

 

 

 

 

// oldsubcategory_id = subcategory_id;

 

 

 

//}

 

 

 

if (currentSeries != null)

 

{

 

 

string sqlString1 = "SELECT Vendor_id, BID_TIME, BID_PRICE FROM BID_DETAILS WHERE auc_code='7' and Vendor_id = '" + dbRow["Vendor_id"].ToString() + "' ";

 

 

 

SqlDataAdapter adapter1 = new SqlDataAdapter(sqlString1, dbCon);

 

 

 

DataSet ds1 = new DataSet();

 

adapter1.Fill(ds1);

 

 

 

foreach (DataRow dbRow1 in ds1.Tables[0].Rows)

 

{

 

 

 

// Ds.Add(new ChartSeriesItem(double.Parse(dbRow1["BID_PRICE"].ToString())));

 

 

 

//RadChart2.Series[i].DataLabelsColumn = dbRow1["BID_TIME"].ToString();

 

 

currentSeries.AddItem(

double.Parse(dbRow1["BID_PRICE"].ToString()));

 

 

 

// currentSeries.DataYColumn=dbRow1["BID_PRICE"].ToString();

 

 

 

// RadChart2.PlotArea.XAxis.DataLabelsColumn = dbRow1["BID_TIME"].ToString();

 

 

 

// currentSeries.DataXColumn = dbRow1["BID_TIME"].ToString();

 

 

 

//currentSeries.AddItem(Ds);

 

 

 

// RadChart2.Series[i].AddItem(Ds);

 

 

}

 

 

//currentSeries.AddItem(Ds);

 

 

 

}

 

// i++;

 

 

 

}

 

 

// Set additional properties and settings for the chart.

 

 

 

//RadChart2.ChartTitle.TextBlock.Text = dropDownCategory.SelectedItem.Text;

 

 

}

 

}

aspx.cs

<%

@ Page Language="C#" AutoEventWireup="true" CodeFile="staggeredLine.aspx.cs" Inherits="staggeredLine" %>

 

<%

 

@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>

 

<%

 

@ Register TagPrefix="telerik" Namespace="Telerik.Charting" Assembly="Telerik.Web.UI" %>

 

 

<!

 

DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

 

<

 

 

html xmlns="http://www.w3.org/1999/xhtml">

 

<

 

 

head runat="server">

 

 

 

<title>Staggered Line chart - for auction test</title>

 

</

 

 

head>

 

<

 

 

body>

 

 

 

<form id="form1" runat="server">

 

 

 

<div>

 

 

 

<telerik:RadChart ID="RadChart2" runat="server" Height="333px" Skin="LightBrown"

 

 

 

Width="700px" AutoLayout="true" AutoTextWrap="true" >

 

 

 

 

<ChartTitle>

 

 

 

<TextBlock Text="Bid Chart" />

 

 

 

</ChartTitle>

 

 

 

</telerik:RadChart>

 

 

 

 

</div>

 

 

 

</form>

 

</

 

 

body>

 

</

 

 

html>

 

 

CREATE

 

TABLE [dbo].[BID_DETAILS](

 

[BID_DETAIL_ID] [decimal]

(18, 0) NULL,

 

[AUC_CODE] [decimal]

(18, 0) NULL,

 

[VENDOR_ID] [varchar]

(10) COLLATE SQL_Latin1_General_CP1_CI_AS NULL,

 

[SUPP_ORG_NAME] [varchar]

(50) COLLATE SQL_Latin1_General_CP1_CI_AS NULL,

 

[PROXY_NAME] [varchar]

(50) COLLATE SQL_Latin1_General_CP1_CI_AS NULL,

 

[BID_PRICE] [decimal]

(23, 5) NULL,

 

[BID_DATE] [datetime]

NULL,

 

[BID_TIME] [varchar]

(8) COLLATE SQL_Latin1_General_CP1_CI_AS NULL,

 

[IS_APPROVED] [varchar]

(10) COLLATE SQL_Latin1_General_CP1_CI_AS NULL,

 

[GROSS_PRICE] [decimal]

(23, 5) NULL,

 

[ITEM_NUMBER] [decimal]

(18, 0) NULL,

 

[QUANTITY] [decimal]

(23, 3) NULL,

 

[STATUS] [char]

(1) COLLATE SQL_Latin1_General_CP1_CI_AS NULL CONSTRAINT [DF_BID_DETAILS_STATUS] DEFAULT (N'A'),

 

[REASON] [char]

(1) COLLATE SQL_Latin1_General_CP1_CI_AS NULL,

 

[IP_ADDRESS] [varchar]

(20) COLLATE SQL_Latin1_General_CP1_CI_AS NULL

 

)

 

ON [PRIMARY]

 

GO

SET

 

ANSI_PADDING OFF

 

[Ves]

Hello Kannadasan,

In order to define a position of a ChartSeriesItem along the X axis you need to set its XValue property. Your code does not show this, so the chart applies its default behavior -- each next ChartSeriesItem is placed at the next position along the X axis. Your chart shows 3 ChartSeries with two ChartSeriesItems each, so there are 3 points at the first position and 3 points at the second position.

Now, you can choose one of the following:

• Keep the X axis as it currently is and set XValue for the corresponding ChartSeriesItems. Ex.  according to the image of the chart you expect you should set the XValue property of the second ChartSeriesItem in the first series to 3, this will shift that point to the corresponding X axis position. The same applies for the rest of the ChartSeriesItems
• Define the XAxis range manually, based on the dates coming from the database. Use these dates to populate the chart items as shown in this online example.

Sincerely,
Ves
the Telerik team