HtmlChart - DataSet

Isolate this demo as a stand-alone application
  • About this demo
  • C#
  • VB

This example demonstrates a RadHtmlChart, data-bound to a DataSet. The data for the series are populated from the specified data source by setting the properties DataFieldX and DataFieldY of the series to the corresponding fields of the data source.

  • DefaultCS.aspx
  • DefaultCS.aspx.cs
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="DefaultCS.aspx.cs" Inherits="Telerik.Web.Examples.HtmlChart.DataBinding.BindToDataSet.DefaultCS" %>

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

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<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">
        <telerik:RadHtmlChart runat="server" ID="RadHtmlChart1" Width="800px" Height="500px">
            <PlotArea>
                <Series>
                    <telerik:ScatterLineSeries Name="0.8C" DataFieldX="ChargeTime08C" DataFieldY="ChargeCurrent08C">
                        <TooltipsAppearance Color="White" DataFormatString="{1}% in {0} minutes"></TooltipsAppearance>
                        <LabelsAppearance Visible="false">
                        </LabelsAppearance>
                    </telerik:ScatterLineSeries>
                    <telerik:ScatterLineSeries Name="1.6C" DataFieldX="ChargeTime16C" DataFieldY="ChargeCurrent16C">
                        <TooltipsAppearance Color="White" DataFormatString="{1}% in {0} minutes"></TooltipsAppearance>
                        <LabelsAppearance Visible="false">
                        </LabelsAppearance>
                    </telerik:ScatterLineSeries>
                    <telerik:ScatterLineSeries Name="3.1C" DataFieldX="ChargeTime31C" DataFieldY="ChargeCurrent31C">
                        <TooltipsAppearance Color="White" DataFormatString="{1}% in {0} minutes"></TooltipsAppearance>
                        <LabelsAppearance Visible="false">
                        </LabelsAppearance>
                    </telerik:ScatterLineSeries>
                </Series>
                <XAxis>
                    <LabelsAppearance DataFormatString="{0}m" />
                    <TitleAppearance Text="Time" />
                </XAxis>
                <YAxis MaxValue="100">
                    <LabelsAppearance DataFormatString="{0}%" />
                    <TitleAppearance Text="Charge" />
                </YAxis>
            </PlotArea>
            <ChartTitle Text="Charge current vs. charge time">
            </ChartTitle>
        </telerik:RadHtmlChart>
    </div>
    </form>
</body>
</html>

Find Assistance

Help Us Improve

Was this example helpful?