HtmlChart Nested in RadGrid

3 posts, 0 answers
  1. Ron
    Ron avatar
    86 posts
    Member since:
    Sep 2009

    Posted 12 Jul 2012 Link to this post

    Hello again,

    I have come across a strange rendering issue with the HtmlChart as you can see in the screenshot attached.  The chart is nested in a radgrid and populates the data just fine.  The axis for both y and x along with the points in the line series all render correctly with no issue.  But the actual grid and the line itself of the chart render way off to the right for some reason.  This seems to happen in all versions of IE from 6 thru 9.

    Any help would of course be appreciated.

    Following is the markup for the radgrid on the page:

    <telerik:RadGrid ID="ReportsDataGrid" runat="server"
        <GroupingSettings CaseSensitive="false" />
        <MasterTableView DataSourceID="ReportsDataSource" DataKeyNames="SenderAddress,SourceIP"
        GroupLoadMode="Server" CommandItemDisplay="Top">
                <telerik:GridBoundColumn DataField="SenderAddress" HeaderText="Sender Email Address" />
                <telerik:GridBoundColumn DataField="SourceIP" HeaderText="Sender Source IP Address" />
                <telerik:GridBoundColumn DataField="Messages" HeaderText="Messages" DataFormatString="{0:N0}" />
                <telerik:GridBoundColumn DataField="Volume" HeaderText="Volume (KB)" DataFormatString="{0:N0}" />
                <asp:Panel runat="server" ID="InnerContainer" Visible="false">
                    <div class="nestedchartcontentpane" style="position:relative">
                        <asp:Label ID="SelectedRecordEmail" runat="server" Text='<%# Eval("SenderAddress") %>' Visible="false" />
                        <asp:Label ID="SelectedRecordIP" runat="server" Text='<%# Eval("SourceIP") %>' Visible="false" />
                        <telerik:RadHtmlChart runat="server" ID="ReportsDataChart" Width="900" Height="300"
                            Transitions="true" DataSourceID="ReportsNestedDataSource"  >
                                <Appearance Visible="false" />
                                <XAxis MajorTickType="Outside" MinorTickType="None" DataLabelsField="Date">
                                    <LabelsAppearance DataFormatString="{0}" RotationAngle="45" />
                                    <TitleAppearance Visible="true" Text="Date" />
                                    <MinorGridLines Visible="false" />
                                <YAxis MajorTickType="Outside" MinorTickType="None">
                                    <LabelsAppearance DataFormatString="{0:N0}" RotationAngle="0" />
                                    <TitleAppearance Visible="true" Text="Messages" />
                                    <MinorGridLines Visible="false" />
                                    <telerik:LineSeries Name="Messages" MissingValues="Gap" DataField="Messages">
                                        <LabelsAppearance Visible="false" />
                                        <TooltipsAppearance DataFormatString="{0:N0}" />
                        <asp:SqlDataSource ID="ReportsNestedDataSource" runat="server" 
                            ConnectionString="<%$ ConnectionStrings:asp_statistics %>" 
                                <asp:ControlParameter ControlID="ReportsSelectedDate" Name="date"
                                    PropertyName="SelectedDate" Type="DateTime" />
                                <asp:ControlParameter ControlID="ReportsOn" Name="type"
                                    PropertyName="SelectedValue" Type="String" />
                                <asp:ControlParameter ControlID="ReportsDataUnit" Name="unit"
                                    PropertyName="SelectedValue" Type="String" />
                                <asp:ControlParameter ControlID="SelectedRecordEmail" Name="address"
                                    PropertyName="Text" Type="String" />
                                <asp:ControlParameter ControlID="SelectedRecordIP" Name="sourceip"
                                    PropertyName="Text" Type="String" />
  2. Ron
    Ron avatar
    86 posts
    Member since:
    Sep 2009

    Posted 13 Jul 2012 Link to this post

    Sorry, looks like I forgot to add the image attachment, here it is.
  3. DevCraft R3 2016 release webinar banner
  4. Slav
    Slav avatar
    1351 posts

    Posted 17 Jul 2012 Link to this post

    Hi Ronald,

    The depicted problem is quite strange. I tired to reproduce it by using the online demo HtmlChart in Grid column which shows a similar setup, but without success. Please compare my attachment to your actual project and let me know if there are any significant differences in the setup. You can check the RadHtmlChart appearance on my end via this screen capture.

    I am willing to help you with your problem, but I need to reproduce it locally in order to provide a more to the point answer. Please open a support ticket and try modifying the attached sample so that it matches your scenario. If this is not possible, you can also prepare a simple, runnable page that isolates the issue so that I can inspect it on my end.

    the Telerik team
    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 RadControls for ASP.NET AJAX, subscribe to their blog feed now.
Back to Top