Create separate bottom axis for hours format and date format at a time.

TeeChart for Microsoft Visual Studio .NET, Xamarin Studio (Android, iOS & Forms) & Monodevelop.
Post Reply
Amol
Advanced
Posts: 176
Joined: Mon May 29, 2006 12:00 am

Create separate bottom axis for hours format and date format at a time.

Post by Amol » Thu Mar 19, 2020 2:15 pm

Hi Steema,

We have use TChart.Net 2012. We have XY data in which X values are in date time format. We have created a line series to plot this data in the charts. Now our requirements is that we want to display the hours in primary axis( in 24 hours format) in the bottom and date is displaying in secondary axis in the bottom of the chart. This hours labels created on the bases of date time data.
For your reference we have attached a image.
So kindly provide the solution for same.

Thanks
Amol
Attachments
chart1.png
chart1.png (10.01 KiB) Viewed 20124 times

Christopher
Guru
Posts: 1603
Joined: Fri Nov 15, 2002 12:00 am

Re: Create separate bottom axis for hours format and date format at a time.

Post by Christopher » Mon Mar 23, 2020 10:00 am

Hello Amol,

you could base your solution on code similar to this:

Code: Select all

        private void InitializeChart()
        {
            var line = new Line(_tChart.Chart);

            var now = DateTime.UtcNow;
            var rnd = new Random();

            for (var i = 0; i < 50; i++)
            {
                line.Add(now, rnd.Next(1000));
                now = now.AddHours(4);
            }

            _tChart.Axes.Bottom.Increment = (1 / 24) * 4;
            _tChart.Axes.Bottom.Labels.DateTimeFormat = "HH";
            _tChart.Axes.Bottom.Grid.Visible = false;

            var axis = _tChart.Axes.Bottom.SubAxes.Add();
            axis.Increment = 1;
            axis.Labels.DateTimeFormat = "M";
            axis.GetAxisDrawLabel += Bottom_GetAxisDrawLabel;
            axis.Grid.DrawEvery = 1;
            axis.Grid.Color = Color.Red;
        }

        private void Bottom_GetAxisDrawLabel(object sender, GetAxisDrawLabelEventArgs e)
        {
            var axis = sender as Axis;
            var size = axis.CalcSizeValue(1);
            e.X += size / 2;
        }
Which here gives me:
TeeChartPro_2020-03-23_10-58-35.png
TeeChartPro_2020-03-23_10-58-35.png (59.9 KiB) Viewed 20102 times
Best Regards,
Christopher Ireland / Development & Support
Steema Software
Avinguda Montilivi 33, 17003 Girona, Catalonia
Tel: 34 972 218 797
http://www.steema.com
Instructions - How to post in this forum

Amol
Advanced
Posts: 176
Joined: Mon May 29, 2006 12:00 am

Re: Create separate bottom axis for hours format and date format at a time.

Post by Amol » Sat Mar 28, 2020 9:41 am

Hi Steema,

Thanks for the reply. We have used your code as you mentioned in your demo but i have not able to use "SubAxes" for bottom axis. The code as you mentioned in below:

var axis = _tchart.Axes.Bottom.SubAxes.Add();

Here we are using TChart Dot Net version 2012.

So kindly guide us how we use "SubAxes" for bottom.

Thanks & regards
Amol

Christopher
Guru
Posts: 1603
Joined: Fri Nov 15, 2002 12:00 am

Re: Create separate bottom axis for hours format and date format at a time.

Post by Christopher » Mon Mar 30, 2020 6:23 am

Hello Amol,

you can see the code working by downloading the NuGet package from here; you can either use Visual Studio to install the package or you can download it and unzip it to access the TeeChart assemblies.

The SubAxes feature may not be a feature available in TeeChart 2012, but I am not authorized to effectively give you the source code for this new feature.
Best Regards,
Christopher Ireland / Development & Support
Steema Software
Avinguda Montilivi 33, 17003 Girona, Catalonia
Tel: 34 972 218 797
http://www.steema.com
Instructions - How to post in this forum

Post Reply