Change DataFieldY on series Server Side

2 posts, 0 answers
  1. Tom
    Tom avatar
    18 posts
    Member since:
    Nov 2011

    Posted 31 Mar 2014 Link to this post

    I need to be able chance the DataFieldY being plotted based on a radio button via server side code and rebind the graphs.


  2. Danail Vasilev
    Admin
    Danail Vasilev avatar
    1492 posts

    Posted 01 Apr 2014 Link to this post

    Hello Tom,

    Please find below an example on how this can be achieved.

    ASPX:
    <telerik:RadHtmlChart runat="server" ID="RadHtmlChart1" Width="640px" Height="480px">
        <PlotArea>
            <Series>
                <telerik:ScatterLineSeries DataFieldY="SellQuantity1" DataFieldX="SellDate">
                    <LabelsAppearance DataFormatString="{1} cars sold on {0:m}">
                    </LabelsAppearance>
                    <TooltipsAppearance Color="White" DataFormatString="{1} cars sold on<br/>{0:D}" />
                </telerik:ScatterLineSeries>
            </Series>
            <XAxis BaseUnit="days">
                <TitleAppearance Text="Sell Date">
                </TitleAppearance>
                <LabelsAppearance DataFormatString="d">
                </LabelsAppearance>
                <MajorGridLines Color="#EFEFEF" Width="1"></MajorGridLines>
                <MinorGridLines Color="#F7F7F7" Width="1"></MinorGridLines>
            </XAxis>
            <YAxis>
                <TitleAppearance Text="Quantity">
                </TitleAppearance>
                <MajorGridLines Color="#EFEFEF" Width="1"></MajorGridLines>
                <MinorGridLines Color="#F7F7F7" Width="1"></MinorGridLines>
            </YAxis>
        </PlotArea>
        <ChartTitle Text="Sold Cars per Date">
        </ChartTitle>
    </telerik:RadHtmlChart>
    <telerik:RadButton ID="RadButton1" runat="server" Text="Change DataFieldY1" ButtonType="ToggleButton" ToggleType="Radio" GroupName="gp1" OnClick="RadButton1_Click1" Checked="true" />
    <telerik:RadButton ID="RadButton2" runat="server" Text="Change DataFieldY1" ButtonType="ToggleButton" ToggleType="Radio" GroupName="gp1" OnClick="RadButton1_Click2" />
    C#:
    protected void Page_Load(object sender, EventArgs e)
    {
        RadHtmlChart1.DataSource = GetData();
        RadHtmlChart1.DataBind();
    }
     
    protected DataTable GetData()
    {
        DataTable dt = new DataTable();
     
        dt.Columns.Add("ID", typeof(int));
        dt.Columns.Add("SellQuantity1", typeof(int));
        dt.Columns.Add("SellQuantity2", typeof(int));
        dt.Columns.Add("SellDate", typeof(DateTime));
     
        dt.Rows.Add(1, 2, 12, new DateTime(2011, 06, 12));
        dt.Rows.Add(2, 5, 15, new DateTime(2011, 12, 12));
        dt.Rows.Add(3, 6, 16, new DateTime(2012, 06, 17));
        dt.Rows.Add(4, 4, 14, new DateTime(2012, 09, 18));
        dt.Rows.Add(5, 7, 17, new DateTime(2013, 03, 18));
     
        return dt;
    }
    protected void RadButton1_Click1(object sender, EventArgs e)
    {
        (RadHtmlChart1.PlotArea.Series[0] as ScatterLineSeries).DataFieldY = "SellQuantity1";
    }
    protected void RadButton1_Click2(object sender, EventArgs e)
    {
        (RadHtmlChart1.PlotArea.Series[0] as ScatterLineSeries).DataFieldY = "SellQuantity2";
    }

    You can find the full runnable VS example in the attached archive.

    Regards,
    Danail Vasilev
    Telerik
     

    Build cross-platform mobile apps using Visual Studio and .NET. Register for the online webinar on 03/27/2014, 11:00AM US ET.. Seats are limited.

     
  3. UI for ASP.NET Ajax is Ready for VS 2017
Back to Top