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

RadChart Stored Proc Binding

7 Answers 66 Views
Chart (Obsolete)
This is a migrated thread and some comments may be shown as answers.
mahmoud
Top achievements
Rank 1
mahmoud asked on 02 Feb 2014, 11:05 AM
Hey Telerik,
I have a stored proc which is like this:
ALTER proc [dbo].[project_Users_Total_Time_Sheet_Report]
@Start_date datetime,
@Project_id int,  
@Finish_date datetime,
@account_id int 
as
declare @expensetype int 
set @expensetype=(select id from accounts_expensestype 
where account_id=@account_id and action=1)
select 
sum(project_projects_expenses_user.expense_value) AS 
total,project_companies_contacts.contact_name_en ,project_task.subject 
from 
project_projects_expenses_user 
join project_companies_contacts on project_companies_contacts.id=project_projects_expenses_user.user_id
join project_task on project_task.id=project_projects_expenses_user.task_id
where project_projects_expenses_user.project_id=@Project_id and project_projects_expenses_user.doc_date between @Start_date and @Finish_date and project_projects_expenses_user.expense_type_id=@expensetype
group by project_companies_contacts.contact_name_en ,project_task.subject order by project_companies_contacts.contact_name_en ,project_task.subject

Now i want to select the task name as label x and y to be total and the bars to the chart to be contact name.. so i want for each task view bars to contacts with the same task for example programming task has con 1, con 2 , con 3 as bars.. i want it to be something like the attached picture with the question.
how can i achieve something like that by C# code with my proc?

7 Answers, 1 is accepted

Sort by
0
mahmoud
Top achievements
Rank 1
answered on 02 Feb 2014, 12:22 PM
no one here knows how to achieve this , or even give me reference link to help me with it!
0
mahmoud
Top achievements
Rank 1
answered on 02 Feb 2014, 12:48 PM
To be clear so you can picture the whole thing.. look at the attached picture its to the page when i click view button it fills the grid but the chart no.. so can u think with me for a solution
0
mahmoud
Top achievements
Rank 1
answered on 02 Feb 2014, 03:23 PM
OK here's what i got so far ... take a look at the attached pic
now i want to merge task350 together with 2 bars for each accounts ahmed and admin with different colors.. can u help me please ?
0
mahmoud
Top achievements
Rank 1
answered on 02 Feb 2014, 03:26 PM
Here's the aspx page:
<telerik:RadChart ID="RadChart1" runat="server"
        Width="465px" Height="260px" DefaultType="Bar" OnItemDataBound="RadChart1_ItemDataBound" 
        AutoLayout="true" AutoTextWrap="true" CreateImageMap="false">
        <ChartTitle>
            <TextBlock Text="Time Sheet">
            </TextBlock>
          </ChartTitle>
        <Series>
            <telerik:ChartSeries DataYColumn="total" Name="total" Type="Bar">
                <Appearance LegendDisplayMode="ItemLabels">
                </Appearance>
            </telerik:ChartSeries>
        </Series>
        </telerik:RadChart>
Here's my code:
        RadChart1.Series[0].DataYColumn = "total";
        RadChart1.PlotArea.XAxis.DataLabelsColumn = "subject";
        
        RadChart1.PlotArea.XAxis.Appearance.LabelAppearance.RotationAngle = 300;
        RadChart1.PlotArea.XAxis.Appearance.TextAppearance.TextProperties.Color =
        System.Drawing.Color.Blue;
        RadChart1.PlotArea.Appearance.Dimensions.Margins.Bottom =
        Telerik.Charting.Styles.Unit.Percentage(30);
        RadChart1.DataSource = dt;
        RadChart1.DataBind();
0
Danail Vasilev
Telerik team
answered on 05 Feb 2014, 05:32 PM
Hi Mahmoud,

In order to bind the RadChart you must associate each series and x-axis to the corresponding field from the data source. More information on the matter is available in Data Binding online demos. You may also find useful the Grouping databound items functionality of RadChart.

As for the association of the series items color to the x-axis items color you can handle the item data bound event of the chart where this can be done. For example:
ASPX:
<telerik:RadChart ID="RadChart1" runat="server"
    Width="465px" Height="260px" DefaultType="Bar" OnItemDataBound="RadChart1_ItemDataBound1"
    AutoLayout="true" AutoTextWrap="true" CreateImageMap="false">
    <ChartTitle>
        <TextBlock Text="Time Sheet">
        </TextBlock>
    </ChartTitle>
    <Series>
        <telerik:ChartSeries DataYColumn="total" Name="total" Type="Bar">
            <Appearance LegendDisplayMode="ItemLabels">
            </Appearance>
        </telerik:ChartSeries>
    </Series>
    <PlotArea>
        <XAxis AutoScale="false">
        </XAxis>
    </PlotArea>
</telerik:RadChart>
C#:
protected void Page_Load(object sender, EventArgs e)
{
    //RadChart1.Series[0].DataYColumn = "total";
    //RadChart1.PlotArea.XAxis.DataLabelsColumn = "subject";
 
    RadChart1.PlotArea.XAxis.Appearance.LabelAppearance.RotationAngle = 300;
    RadChart1.PlotArea.XAxis.Appearance.TextAppearance.TextProperties.Color =
    System.Drawing.Color.Blue;
    RadChart1.PlotArea.Appearance.Dimensions.Margins.Bottom =
    Telerik.Charting.Styles.Unit.Percentage(30);
    RadChart1.DataSource = GetData();
    RadChart1.DataBind();
}
protected DataTable GetData()
{
    DataTable dt = new DataTable();
 
    dt.Columns.Add("ID");
    dt.Columns.Add("total");
    dt.Columns.Add("subject");
    dt.Columns.Add("colorField", typeof(System.Drawing.Color));
 
    dt.Rows.Add(1, 2, "item 1", Color.Red);
    dt.Rows.Add(2, 5, "item 2", Color.Blue);
    dt.Rows.Add(3, 6, "item 3", Color.Green);
 
    return dt;
}
protected void RadChart1_ItemDataBound1(object sender, Telerik.Charting.ChartItemDataBoundEventArgs e)
{
    int currItem = RadChart1.Series[0].Items.Count -1;
    Color currColor = (Color)(e.DataItem as DataRowView).Row[3];
    //Set series items color
    RadChart1.Series[0].Items[currItem].Appearance.FillStyle.MainColor = currColor;
    ChartAxisItem cai1 = new ChartAxisItem();
    cai1.TextBlock.Text = (String)(e.DataItem as DataRowView).Row[2];
    //Add axis items
    RadChart1.PlotArea.XAxis.Items.Add(cai1);
    //Set axis item color
    RadChart1.PlotArea.XAxis.Items[currItem].TextBlock.Appearance.TextProperties.Color = currColor;
}

You may also find the full VS example in the attached archive.

Regards,
Danail Vasilev
Telerik
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the UI for ASP.NET AJAX, subscribe to the blog feed now.
0
mahmoud
Top achievements
Rank 1
answered on 09 Feb 2014, 09:14 AM
Thanks for you help Danail Vasilev.. but now I'm facing another problem in my chart bars all the bars grouped to specific Xaxis like to one value .. take a look at my question in this thread if you can help me I'd really appreciate it.
http://www.telerik.com/forums/split-each-bar-chart-to-its-x-value-column
0
Danail Vasilev
Telerik team
answered on 10 Feb 2014, 01:38 PM
Hello mahmoud,

I have already replied to your question in Split each bar chart to its x value column forum thread, so that you can find my answer there.

Regards,
Danail Vasilev
Telerik
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the UI for ASP.NET AJAX, subscribe to the blog feed now.
Tags
Chart (Obsolete)
Asked by
mahmoud
Top achievements
Rank 1
Answers by
mahmoud
Top achievements
Rank 1
Danail Vasilev
Telerik team
Share this question
or