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

RadHtmlChart not working with Dataset, even code from the demos not working

2 Answers 42 Views
Chart (HTML5)
This is a migrated thread and some comments may be shown as answers.
Keith
Top achievements
Rank 1
Keith asked on 09 Dec 2015, 08:15 PM

For a new project I am working on, I am going to make use of the RadHtmlChart that would be bound to a dataset to do a Bar Chart.

First I needed to get familiar with the RadHtmlChart and binding a dataset to it.  To do that I started with the demos. First I created an ASP.Net page with VB.net as the code behind. I had copied the ASP.net code from the demo to the ASP.Net page I created and copied the vb code-behind to the code-behind for the ASP.Net page I created.  When I try to display that ASP.Net page in my web browser, it showed the chart without the lines that should have been plotted based on the data.  See the attached screenshot.

I have even tried the example code in the documentation for using a dataset and still did not work.

Why is this NOT working?

It should be simple and straight-forward but it is not working.  I have tried it in IE11 and Google Chrome.  I have bind other Telerik controls to datasets before without any problems.

Please DO NOT refer me to the example in the documentation and the demo because they are not working.

Please LOOK at my code below and help find out why it is NOT working.

---------------------------------------------------------------------

TestRadHTMLChart.aspx  -

<%@ Page Language="VB" AutoEventWireup="false" CodeFile="TestRadHtmlChart.aspx.vb" Inherits="TestRadHtmlChart" %>

<%@ 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>

TestRadHtmlChart.aspx.vb

Imports System
Imports System.Data

Partial Class TestRadHtmlChart
    Inherits System.Web.UI.Page

    Protected Sub Page_Load(sender As Object, e As System.EventArgs)
        RadHtmlChart1.DataSource = GetData()
        RadHtmlChart1.DataBind()
    End Sub

    Private Function GetData() As DataSet
        Dim ds As New DataSet("ChargeCurrentTimeRatio")
        Dim dt As New DataTable("ChargeData")
        dt.Columns.Add("Id", Type.[GetType]("System.Int32"))
        dt.Columns.Add("ChargeTime08C", Type.[GetType]("System.Decimal"))
        dt.Columns.Add("ChargeCurrent08C", Type.[GetType]("System.Decimal"))
        dt.Columns.Add("ChargeTime16C", Type.[GetType]("System.Decimal"))
        dt.Columns.Add("ChargeCurrent16C", Type.[GetType]("System.Decimal"))
        dt.Columns.Add("ChargeTime31C", Type.[GetType]("System.Decimal"))
        dt.Columns.Add("ChargeCurrent31C", Type.[GetType]("System.Decimal"))

        dt.Rows.Add(1, 10, 10, 10, 40, 10, _
            70)
        dt.Rows.Add(2, 15, 20, 17, 50, 13, _
            90)
        dt.Rows.Add(3, 20, 25, 18, 70, 25, _
            100)
        dt.Rows.Add(4, 32, 40, 35, 90, Nothing, _
            Nothing)

        dt.Rows.Add(5, 43, 50, 47, 95, Nothing, _
            Nothing)
        dt.Rows.Add(6, 55, 60, 60, 100, Nothing, _
            Nothing)
        dt.Rows.Add(7, 60, 70, Nothing, Nothing, Nothing, _
            Nothing)
        dt.Rows.Add(8, 70, 80, Nothing, Nothing, Nothing, _
            Nothing)
        dt.Rows.Add(9, 90, 100, Nothing, Nothing, Nothing, _
            Nothing)
        ds.Tables.Add(dt)
        Return ds
    End Function
End Class

2 Answers, 1 is accepted

Sort by
0
Keith
Top achievements
Rank 1
answered on 09 Dec 2015, 08:47 PM

I got it to work.

The Page_Load declaration in the code-behind from the demo and example in documentation was incorrect.

It should have been the following:

Protected Sub Page_Load(sender As Object, e As EventArgs) Handles Me.Load

Not the following:

Protected Sub Page_Load(sender As Object, e As EventArgs)

The code in the demo and example in the documentation needs to be corrected.

0
Marin Bratanov
Telerik team
answered on 10 Dec 2015, 07:30 AM

Hello Keith,

If you set AutoEventWireup to true in the Page directive like in our demo, the handler will be called automatically without the Handles clause. This is a generic issue with the VB language and not with our demos or documentation.

Regards,

Marin Bratanov
Telerik
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
Tags
Chart (HTML5)
Asked by
Keith
Top achievements
Rank 1
Answers by
Keith
Top achievements
Rank 1
Marin Bratanov
Telerik team
Share this question
or