Problems with Bottom Axis in date time mode

[Paul Kennedy]

Hi,
I have a time series plot where the bottom axis is defined as date time, in automatic mode, ie

Code: Select all

    DateTime dt = Convert.ToDateTime(XArrayTable[i]);
    m_fastline.Add(dt, YdataValue);
    tChart1.Axes.Bottom.Automatic = true;
    tChart1.Series.Add(m_fastline);

The plot looks reasonable if my X axis extents are large (days, or hours), but if I zoom in far enough, say to range of seconds, the auto axes fail to display suitable range, but rather repeats the same axes labels at all intervals, which means the axes are useless.

When in auto mode, you would expect the axes looks at the range, and creates appropriate labels, not useless ones.

This looks a lot like a bug

Any chance it can get fixed?

[Sandra]

Hello Paul Kennedy,

I made a simple project where your problem doesn't occurs for me using last version of TeeChartFor.Net:

Code: Select all

  public Form1()
        {
            InitializeComponent();
            InitializeChart();
        }
        bool boolDateTime;
        private void InitializeChart()
        {
            tChart1.Aspect.View3D = false;

            tChart1.Series.Clear();

            Steema.TeeChart.Styles.FastLine fastline1 = new Steema.TeeChart.Styles.FastLine(tChart1.Chart);
            DateTime today = DateTime.Today;
            fastline1.XValues.DateTime = true;
            fastline1.DateTimeFormat = "dd/MM/yyy";
            Random rnd = new Random();
            for (int i = 0; i < 20; i++)
            {
                fastline1.Add(today, rnd.Next(100));
                today = today.AddDays(1);
                today = today.AddMinutes(30);
                today = today.AddSeconds(8);
            }

            tChart1.Axes.Bottom.Labels.DateTimeFormat = "dd/MM/yyyy";
            tChart1.Axes.Bottom.Labels.Angle = 90;
            tChart1.Axes.Bottom.Labels.Style = AxisLabelStyle.PointValue;
            tChart1.Zoomed += tChart1_Zoomed;
            tChart1.AfterDraw += tChart1_AfterDraw;
            tChart1.UndoneZoom += tChart1_UndoneZoom;
        }

        private void tChart1_Zoomed(System.Object sender, System.EventArgs e)
        {
            boolDateTime = true;
            //tChart1.Refresh()
        }

        private void tChart1_AfterDraw(System.Object sender, Steema.TeeChart.Drawing.Graphics3D g)
        {
            if (boolDateTime)
            {
                (tChart1[0] as Steema.TeeChart.Styles.FastLine).DateTimeFormat = "hh:mm:ss";
                tChart1.Axes.Bottom.Labels.DateTimeFormat = "hh:mm:ss";
            }
            else
            {
                (tChart1[0] as Steema.TeeChart.Styles.FastLine).DateTimeFormat = "dd/mm/yyyy";
                tChart1.Axes.Bottom.Labels.DateTimeFormat = "dd/mm/yyyy";
            }

        }

        private void tChart1_UndoneZoom(System.Object sender, System.EventArgs e)
        {
            boolDateTime = false;
            tChart1.Refresh();
        }

Could you tell us if previous code works in your end?

Thanks,

[Paul Kennedy]

Hi,
thanks for the snippet. I made a new c# project, added the tchart control and dropped in your code. I am using tchart pro .Net V2010 V4.1.2012.5103

Unfortunately, the resulting axes are unacceptable. The initial axes look fine, but as I zoom in the dates are replaced with a single axis label containing a time stamp. 1 vertical line + a label is not a satisfactory set of labels. we need at least 2.
If I continue to zoom in, the single label disappears and I get nothing on the bottom axis at all.

[img]datetimeaxes1.png[/img]

[img]datetimeaxes2.png[/img]

[img]datetimeaxes3.png[/img]

datetimeaxes1.png (31.96 KiB) Viewed 17397 times

datetimeaxes2.png (13.79 KiB) Viewed 17396 times

datetimeaxes3.png (15.8 KiB) Viewed 17381 times

This is with your code not mine ;-(

regards
pk

[Sandra]

Hello Paul Kennedy,

Ok. In my first code I have defined the style of labels as PointValue and only appears the label of each point. So, I have commented it from my code as you see next:

Code: Select all

        public Form1()
        {
            InitializeComponent();
            InitializeChart();
        }
        bool boolDateTime;
        private void InitializeChart()
        {
            tChart1.Aspect.View3D = false;

            tChart1.Series.Clear();

            Steema.TeeChart.Styles.FastLine fastline1 = new Steema.TeeChart.Styles.FastLine(tChart1.Chart);
            DateTime today = DateTime.Today;
            fastline1.XValues.DateTime = true;
            fastline1.DateTimeFormat = "dd/MM/yyy";
            Random rnd = new Random();
            for (int i = 0; i < 20; i++)
            {
                fastline1.Add(today, rnd.Next(100));
                today = today.AddDays(1);
                today = today.AddMinutes(30);
                today = today.AddSeconds(8);
            }

            tChart1.Axes.Bottom.Labels.DateTimeFormat = "dd/MM/yyyy";
            tChart1.Axes.Bottom.Labels.Angle = 90;
          //  tChart1.Axes.Bottom.Labels.Style = AxisLabelStyle.PointValue;
           
           tChart1.Zoomed += tChart1_Zoomed;
            tChart1.AfterDraw += tChart1_AfterDraw;
            tChart1.UndoneZoom += tChart1_UndoneZoom;
        }

        private void tChart1_Zoomed(System.Object sender, System.EventArgs e)
        {
            boolDateTime = true;
        }

        private void tChart1_AfterDraw(System.Object sender, Steema.TeeChart.Drawing.Graphics3D g)
        {
            if (boolDateTime)
            {
                (tChart1[0] as Steema.TeeChart.Styles.FastLine).DateTimeFormat = "hh:mm:ss";
                tChart1.Axes.Bottom.Labels.DateTimeFormat = "hh:mm:ss";
            }
            else
            {
                (tChart1[0] as Steema.TeeChart.Styles.FastLine).DateTimeFormat = "dd/MM/yyyy";
                tChart1.Axes.Bottom.Labels.DateTimeFormat = "dd/MM/yyyy";
            }

        }

        private void tChart1_UndoneZoom(System.Object sender, System.EventArgs e)
        {
            boolDateTime = false;
            tChart1.Refresh();
        }

And using previous code I have gotten next results:
Image 1:

Image1ZoomOneTime.jpg (77.15 KiB) Viewed 17364 times

Image 2:

Image2ZoomTwoTimes.jpg (62.87 KiB) Viewed 17352 times

Image 3:

Image3ZoomFourTimes.jpg (62.75 KiB) Viewed 17356 times

Could you please check, if my code works in your end, in your version of TeeChartFor.Net? Also, I have realized that you don't use last version of TeeChartFor.Net I recommend you update your version of TeeChartFor.Net and check again my codes in latest version to sure the problems are solved. You can download it in the customer download page.

Thanks,

[Paul Kennedy]

Hi
I downloaded and installe dhte latest verison of teechart.net.

I then took your revised sample code, and can see more axes labels, but the auto interval still creates useless labels. As you can see in the highlighted area, we still see integer seconds, so the plot is still useless to users.

Auto mode really should do this out of the box. If not, there is no point having an auto-mode!

[img]DateTimeAxesProblems.png[/img]

[Paul Kennedy]

Your code sample also fails with medium sized zooms. In this example , the axes are still ambiguous, and hence useless.

I believe this really needs some attention, as the current handling of dates on the axis is pretty terrible.

[img]datetimeaxesproblems2.png[/img]

[Paul Kennedy]

hi
In the end, I decided your control is not good enough in auto mode, so had to roll my own. This now behaves pretty nicely, and I hav enot seen any duplicate labels if I zoom anywhere from a millisecond range to years on the X axis.
Is this a sensible mechanism to implement this?

Code: Select all

        private void tChart1_BeforeDrawAxes(object sender, Steema.TeeChart.Drawing.Graphics3D g)
        {
             double minX = tChart1.Axes.Bottom.Minimum;
             double maxX = tChart1.Axes.Bottom.Maximum;

             DateTime mind = DateTime.FromOADate(minX);
             DateTime maxd = DateTime.FromOADate(maxX);

             TimeSpan d = maxd - mind;

            //default
            tChart1.Axes.Bottom.Labels.DateTimeFormat = "dd/MM/yyyy";

            if (d.TotalSeconds < 30)
            {
                tChart1.Axes.Bottom.Labels.DateTimeFormat = "mm:ss.fff";
                return;
            }

            if (d.TotalSeconds < 3600) // 1 hour
            {
                tChart1.Axes.Bottom.Labels.DateTimeFormat = "HH:mm:ss tt";
                return;
            }

            if (d.TotalSeconds < (6 * 3600)) //6 hours
            {
                tChart1.Axes.Bottom.Labels.DateTimeFormat = "ddd hh:mm tt";
                return;
            }

            if (d.TotalSeconds < (24 * 3600)) 
            {
                tChart1.Axes.Bottom.Labels.DateTimeFormat = "ddd hh:mm tt";
                return;
            }

            if (d.TotalSeconds < (30 * 24 * 3600)) 
            {
                tChart1.Axes.Bottom.Labels.DateTimeFormat = "dd/MM hh:mm tt";
                return;
            }
        }

[Sandra]

Hello Paul,

I have tested your suggestion code and it works fine for me, therefore, I think your implementation is good and you can work with it. But there are more ways as can help you to achieve as you want. I suggest you some alternative:

Use smallest increment value that you can use, for example:

Code: Select all

  tChart1.Axes.Bottom.Increment = Steema.TeeChart.Utils.GetDateTimeStep(DateTimeSteps.TenSeconds);

Use GetAxisNextLabel as explain in next links:
http://www.teechart.net/support/viewtop ... bel#p45869
http://www.teechart.net/support/viewtopic.php?t=4552

If previous solutions doesn't like you, you can use your code that is a good solution .

Thanks,

[Paul Kennedy]

Hey Sandra,
I read the links, but I do not understand what you are offering here. Are you suggesting I can replace my code with this single line? I tried it, but it does not look good. Maybe you can provide a better example?

regards
pk

[Sandra]

Hello Paul,

The links I have provided, offer you alternative Events that you can use to achieve as you want as GetNextAxisLabel(). I think these help you to achieve optimized your code as I have done in next code:

Code: Select all

   private void InitializeChart()
        {
            tChart1.Aspect.View3D = false;

            tChart1.Series.Clear();

            Steema.TeeChart.Styles.FastLine fastline1 = new Steema.TeeChart.Styles.FastLine(tChart1.Chart);
            DateTime today = DateTime.Today;
            fastline1.XValues.DateTime = true;
            fastline1.DateTimeFormat = "hh:mm:ss";
            Random rnd = new Random();
            for (int i = 0; i < 20; i++)
            {
                fastline1.Add(today, rnd.Next(100));
                today = today.AddDays(1);
                today = today.AddMinutes(30);
                today = today.AddSeconds(8);
            }

            tChart1.Axes.Bottom.Labels.DateTimeFormat = "hh:mm:ss";
            tChart1.Axes.Bottom.Labels.Angle = 90;
           tChart1.GetNextAxisLabel += new GetNextAxisLabelEventHandler(tChart1_GetNextAxisLabel);
        }

        void tChart1_GetNextAxisLabel(object sender, GetNextAxisLabelEventArgs e)
        {
                double minX = tChart1.Axes.Bottom.Minimum;
                double maxX = tChart1.Axes.Bottom.Maximum;

                DateTime mind = DateTime.FromOADate(minX);
                DateTime maxd = DateTime.FromOADate(maxX);

                TimeSpan d = maxd - mind;

                //default
                tChart1.Axes.Bottom.Labels.DateTimeFormat = "dd/MM/yyyy";

                if (d.TotalSeconds < 30)
                {
                    tChart1.Axes.Bottom.Labels.DateTimeFormat = "mm:ss.fff";
                    return;
                }

                if (d.TotalSeconds < 3600) // 1 hour
                {
                    tChart1.Axes.Bottom.Labels.DateTimeFormat = "HH:mm:ss tt";
                    return;
                }

                if (d.TotalSeconds < (6 * 3600)) //6 hours
                {
                    tChart1.Axes.Bottom.Labels.DateTimeFormat = "ddd hh:mm tt";
                    return;
                }

                if (d.TotalSeconds < (24 * 3600))
                {
                    tChart1.Axes.Bottom.Labels.DateTimeFormat = "ddd hh:mm tt";
                    return;
                }

                if (d.TotalSeconds < (30 * 24 * 3600))
                {
                    tChart1.Axes.Bottom.Labels.DateTimeFormat = "dd/MM hh:mm tt";
                    return;
                }

On the other hand, as I have told you in previous post, your code works fine, is a good solution. and if my suggestion doesn't works exactly as you want or doesn't like you can use your code.


Thanks,