ScatterLineSeries Date Axis AxisCrossingValue

Thread is closed for posting
3 posts, 0 answers
  1. Mathew
    Mathew avatar
    5 posts
    Member since:
    Jul 2013

    Posted 28 Jan 2014 Link to this post

    When using the RadHTMLChart ScatterLineSeries with data that straddles January 1st, 1970, it seems that by default the Y axis crosses the X axis at 1/1/1970.  If all of the data precedes 1/1/1970, the Y axis crosses the X at its maximum value. 

    When using a date axis with a databound ScatterLineSeries, how can I ensure that the Y axis always crosses the X axis at its minimum value?

    To see an example, simply replace the relevant C# code from the Date Axis demo page with this:
    dt.Rows.Add(1, 2, new DateTime(1969, 06, 12));
    dt.Rows.Add(1, 5, new DateTime(1969, 12, 12));
    dt.Rows.Add(2, 6, new DateTime(1970, 06, 17));
    dt.Rows.Add(3, 4, new DateTime(1970, 09, 18));
    dt.Rows.Add(4, 7, new DateTime(1971, 03, 18));

    I have tried setting the XAxis.MinValue and XAxis.AxisCrossingValue properties to either zero or (decimal)minValue.ToOADate(), but it either has no effect, or causes all points before 1/1/1970 to render incorrectly - the chart begins at 12/31/1969, and all points before that date "crowd" the axis.

  2. Mathew
    Mathew avatar
    5 posts
    Member since:
    Jul 2013

    Posted 28 Jan 2014 in reply to Mathew Link to this post

    The solution seems to be to set the AxisCrossingValue as a JSON time cast as a decimal:
    DateTime minValue = new DateTime(1969, 6, 12);
    decimal jsonTicks = (decimal)new TimeSpan(minValue.ToUniversalTime().Ticks - new DateTime(1970, 1, 1).Ticks).TotalMilliseconds;                       
    RadHtmlChart1.PlotArea.XAxis.AxisCrossingValue = jsonTicks;

    Is there a simpler or smarter approach than this?
  3. Stamo Gochev
    Stamo Gochev avatar
    188 posts

    Posted 31 Jan 2014 Link to this post

    Hello Mathew,

    The approach that you described is one of the workarounds. Another suggestion is to replace the ScatterLineSeries with LineSeries and databind the XAxis to DateTime values like this (I am using the sample code from the help article):
    <telerik:RadHtmlChart runat="server" ID="RadHtmlChart1" Skin="Black">
                <%--<telerik:ScatterLineSeries DataFieldY="SellQuantity" DataFieldX="SellDate">
                <telerik:LineSeries DataFieldY="SellQuantity"></telerik:LineSeries>
            <XAxis DataLabelsField="SellDate">
                <LabelsAppearance DataFormatString="MMMM/yyyy" Step="2"></LabelsAppearance>
        <ChartTitle Text="Sold Cars per Date">
    Could you inform me if this is applicable in your case?

    Stamo Gochev
    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 UI for ASP.NET AJAX, subscribe to the blog feed now.
Back to Top