New to Telerik UI for ASP.NET AJAX? Download free 30-day trial

    Programmatic Chart Creation

    00.10.20.30.40.50.60.70.8Volts024681012141618mATheoretical DataExperimental Data
    • Demo Configurator
    Insert experimental data

    The ASP.NET AJAX Chart control can be created and manipulated from the server-side. This allows you to programmatically manage its appearance and the displayed data, as shown in the following example.

    • DefaultVB.aspx
    • DefaultVB.aspx.vb
    <%@ Page Language="vb" AutoEventWireup="true" CodeFile="DefaultVB.aspx.vb" Inherits="Telerik.Web.Examples.HtmlChart.ServerSideAPI.ProgrammaticCreation.DefaultVB" %>
     
    <%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>
     
    <!DOCTYPE html>
    <html xmlns='http://www.w3.org/1999/xhtml'>
    <head runat="server">
        <title>Telerik ASP.NET Example</title>
    </head>
     
    <body>
        <form id="form1" runat="server">
        <telerik:RadScriptManager runat="server" ID="RadScriptManager1" />
        <telerik:RadSkinManager ID="RadSkinManager1" runat="server" ShowChooser="true" />
        <div class="demo-container size-wide">
            <asp:Panel ID="HtmlChartHolder" runat="server"></asp:Panel>
        </div>
     
        <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">
            <AjaxSettings>
                <telerik:AjaxSetting AjaxControlID="ConfiguratorPanel1">
                    <UpdatedControls>
                        <telerik:AjaxUpdatedControl ControlID="HtmlChartHolder" />
                    </UpdatedControls>
                </telerik:AjaxSetting>
            </AjaxSettings>
        </telerik:RadAjaxManager>
     
        <qsf:ConfiguratorPanel runat="server" ID="ConfiguratorPanel1">
            <Views>
                <qsf:View>
                    <qsf:ConfiguratorColumn ID="ConfiguratorColumn1" runat="server" Size="Auto" Title="Insert experimental data">
                        <ul class="fb-group">
                            <li>
                                <qsf:NumericTextBox runat="server" ID="Volts" Label="Volts" ShowSpinButtons="true" Size="Narrow" WrapperCssClass="fb-sized">
                                </qsf:NumericTextBox>
     
                                <qsf:NumericTextBox runat="server" ID="mA" Label="mA" ShowSpinButtons="true" Size="Narrow" WrapperCssClass="fb-sized">
                                </qsf:NumericTextBox>
                            </li>
                            <li>
                                <qsf:Button ID="InsertData" Text="Insert" runat="server" OnClick="InsertData_Click" Size="Narrow"></qsf:Button>
                            </li>
                        </ul>
                    </qsf:ConfiguratorColumn>
                </qsf:View>
            </Views>
        </qsf:ConfiguratorPanel>
        </form>
    </body>
    </html>

    Support & Learning Resources

    Find Assistance