Zooming problem with multiple Y axis

[QuijoteMX]

Hi! I'm developing an application using your example of multiple axis as model. I was doing so fine up to now.
The graphs should look like the one in the attachment.

The problem with zooming is as follows: If you zoom any section in the graph, x axis is zoomed but
y axis do not respond to zoom.

I think I should do that by code, but mousedown and mouseup event do not fire when I zoom in the
graph.

I've attached a simplified version of the code. Hope some one could help me.

Thanks.

O. Molina

Multiple YAxis V4pro.zip

(4.86 KiB) Downloaded 1186 times

multipleAxis.JPG (113.51 KiB) Viewed 26340 times

[Yeray]

Hi O.Molina,

Take a look at this example of zooming with custom axes. Note that this is a delphi code but you shouldn't fins too much problems translating it.

[QuijoteMX]

Hi Yeray!

I looked the delphi sample, the few things I understood (I'm not good on delphi) is that
I should need to set the minimum and maximum properties of each custom axis manually.

I knew that and tried to do in my testcode. The problem is that I can't find y's properties
for the zoomed area to convert it to minmax values of the custom axis.

I also tried to accomplish that through mouseDown and mouseUP events
but they don't fire.

Could you take a look to my testcode ?


Thanks ...

O. Molina

[Yeray]

Hi O.Molina,

You project help me to see that there was a bug with the old TeeChart v4 AX. It seems that connecting a TeeCommander to the chart, it disables the events. I've retested in TeeCahrt AX v8 and they fire normally. So I recommend you to upgrade to the latest TeeChart version or to remove your TeeCommander.

[QuijoteMX]

Thanks Yeray !

I´ll move to version 8. Mean while I'll unattach the chart to teecommander.

[QuijoteMX]

Hi! It's me again.

I've done a lot of progress since I moved my application to v8.

Now I'm facing another problem. By now it is solved but the solution I've found
implies some extra clicks by the user and makes the application a little bit confusing.

I'm doing fine with custom axis, but zooming it's not in the final functionality.

I want to zoom in one and only one of the custom axis. I've achieving this forcing
the user to click in the axis he wants to zoom so I can gather its axis number.

I think it will be easier if i can detect which custom axis is the user referring to by
the coordinates of the zoomed area. is there a way to accomplish that ?

My application redistributes the vertical axis length in n equal parts. one for every new
custom axis.

Thanks ...

O. Molina

[Yeray]

Hi O.Molina,

Here you have an example that uses 4 series, each one with its own vertical and horizontal axis. Note that if you use bottom axis for all the series (a unique horizontal axis for all the series) it will zoom for all at the same time.

Code: Select all

Dim StartX, StartY As Integer
Dim DrawZoomRect As Boolean

Dim nSeries As Integer

Private Sub Form_Load()
  TChart1.Aspect.View3D = False

  nSeries = 4
  
  Dim i As Integer
  For i = 0 To nSeries - 1
    TChart1.AddSeries scFastLine
    TChart1.Series(i).FillSampleValues 100
    TChart1.Axis.AddCustom False
    TChart1.Axis.AddCustom True
    TChart1.Series(i).VerticalAxisCustom = i * 2
    TChart1.Series(i).HorizontalAxisCustom = i * 2 + 1
    TChart1.Axis.Custom(i * 2).PositionUnits = puPixels
    TChart1.Axis.Custom(i * 2).StartPosition = i * (100 / nSeries)
    TChart1.Axis.Custom(i * 2).EndPosition = i * (100 / nSeries) + (100 / nSeries)
    TChart1.Axis.Custom(i * 2).AxisPen.Color = TChart1.Series(i).Color
    TChart1.Axis.Custom(i * 2 + 1).PositionUnits = puPixels
    If i = 0 Then
      TChart1.Environment.InternalRepaint
    End If
    TChart1.Axis.Custom(i * 2 + 1).PositionPercent = ((TChart1.GetChartRect.Bottom - TChart1.GetChartRect.Top) / nSeries) * (nSeries - i - 1)
    TChart1.Axis.Custom(i * 2 + 1).AxisPen.Color = TChart1.Series(i).Color
  Next i
  
  TChart1.Panel.MarginLeft = 7
  
  TChart1.Zoom.Enable = False
End Sub

Private Sub TChart1_OnMouseDown(ByVal Button As TeeChart.EMouseButton, ByVal Shift As TeeChart.EShiftState, ByVal X As Long, ByVal Y As Long)
  If Button = mbLeft Then
    StartX = X
    StartY = Y
    DrawZoomRect = True
  End If
End Sub

Private Sub TChart1_OnMouseMove(ByVal Shift As TeeChart.EShiftState, ByVal X As Long, ByVal Y As Long)
  If DrawZoomRect Then
    TChart1.Repaint
    TChart1.Canvas.Brush.Style = bsClear
    TChart1.Canvas.Rectangle StartX, StartY, X, Y
  End If
End Sub

Private Sub TChart1_OnMouseUp(ByVal Button As TeeChart.EMouseButton, ByVal Shift As TeeChart.EShiftState, ByVal X As Long, ByVal Y As Long)
  If Button = mbLeft Then
    If DrawZoomRect Then
      Dim i As Integer
      If StartX < X And StartY < Y Then
        For i = 0 To nSeries - 1
          With TChart1.Axis.Custom(i * 2)
            If .CalcPosPoint(StartY) >= .Minimum And .CalcPosPoint(StartY) <= .Maximum Then
              .SetMinMax .CalcPosPoint(StartY), .CalcPosPoint(Y)
              TChart1.Axis.Custom(i * 2 + 1).SetMinMax TChart1.Axis.Custom(i * 2 + 1).CalcPosPoint(StartX), TChart1.Axis.Custom(i * 2 + 1).CalcPosPoint(X)
            End If
          End With
        Next i
      Else
        For i = 0 To TChart1.Axis.CustomCount - 1
          TChart1.Axis.Custom(i).Automatic = True
        Next i
        TChart1.Environment.InternalRepaint
      End If
    End If
    DrawZoomRect = False
  End If
End Sub

[QuijoteMX]

Thanks Yeray!

It's exactly the functionality I'm looking for.

Saludos desde MEXICO

[tomking]

Hi Yeray!
Can you give that code in C#!
thanks

[Yeray]

Hi tomking

Here there is a translator tool between VB.Net and C#.
A tip you could need is that the tChart1.Draw() call in C# would be the equivalent of the ActiveX' tChart1.Environment.InternalRepaint call.

If you still find problems translating it, please don't hesitate to let us know.

[tomking]

Hi Yeray!
Could you show me how to create multiple Y-axis like this image.
Thanks

[Yeray]

Hi tomking,

Here you have another example. This time with only an horizontal axis:

Code: Select all

Dim StartX, StartY As Integer
Dim DrawZoomRect As Boolean
Dim nSeries As Integer

Private Sub Form_Load()
  TeeCommander1.Chart = TChart1
  
  nSeries = 6
  
  TChart1.Aspect.View3D = False
  TChart1.Legend.Visible = False
  TChart1.Panel.MarginUnits = muPixels
  TChart1.Panel.MarginLeft = nSeries * 15
  TChart1.Panel.MarginRight = nSeries * 15
  TChart1.Zoom.Enable = False
  
  Dim i As Integer
  For i = 0 To nSeries - 1
    TChart1.AddSeries scFastLine
    TChart1.Axis.AddCustom False
    TChart1.Series(i).VerticalAxisCustom = i
    TChart1.Axis.Custom(i).AxisPen.Color = TChart1.Series(i).Color
    TChart1.Axis.Custom(i).GridPen.Visible = False
    TChart1.Axis.Custom(i).Labels.Angle = 90
    TChart1.Axis.Custom(i).PositionPercent = -((i Mod 3) * 28)
    TChart1.Series(i).FillSampleValues 20000
    TChart1.Series(i).asFastLine.DrawAllPoints = False
    TChart1.Axis.Custom(i).PositionUnits = muPixels
    If ((i + 1) Mod 2 = 0) Then
      TChart1.Axis.Custom(i).Otherside = True
    End If
  Next i
End Sub

Private Sub TChart1_OnMouseDown(ByVal Button As TeeChart.EMouseButton, ByVal Shift As TeeChart.EShiftState, ByVal X As Long, ByVal Y As Long)
  If Button = mbLeft Then
    StartX = X
    StartY = Y
    DrawZoomRect = True
  End If
End Sub

Private Sub TChart1_OnMouseMove(ByVal Shift As TeeChart.EShiftState, ByVal X As Long, ByVal Y As Long)
  If DrawZoomRect Then
    TChart1.Repaint
    TChart1.Canvas.Brush.Style = bsClear
    TChart1.Canvas.Rectangle StartX, StartY, X, Y
  End If
End Sub

Private Sub TChart1_OnMouseUp(ByVal Button As TeeChart.EMouseButton, ByVal Shift As TeeChart.EShiftState, ByVal X As Long, ByVal Y As Long)
  If Button = mbLeft Then
    If DrawZoomRect Then
      Dim i As Integer
      If StartX < X And StartY < Y Then
        For i = 0 To nSeries - 1
          With TChart1.Axis.Custom(i)
            If .CalcPosPoint(StartY) >= .Minimum And .CalcPosPoint(StartY) <= .Maximum Then
              .SetMinMax .CalcPosPoint(StartY), .CalcPosPoint(Y)
            End If
          End With
        Next i
        TChart1.Axis.Bottom.SetMinMax TChart1.Axis.Bottom.CalcPosPoint(StartX), TChart1.Axis.Bottom.CalcPosPoint(X)
      Else
        For i = 0 To TChart1.Axis.CustomCount - 1
          TChart1.Axis.Custom(i).Automatic = True
        Next i
        TChart1.Axis.Bottom.Automatic = True
        TChart1.Environment.InternalRepaint
      End If
    End If
    DrawZoomRect = False
  End If
End Sub

[tomking]

Hi Yeray!
I use C#.net 2008 and Teehchart for .NET v3.
Could you give the code in this environment.
Thanks

[Yeray]

Hi tomking,

Using the translation tool I pointed to you above and understanding the overall process the code tries to do, you shouldn't find too much problems translating it. Anyway, here you have it:

Code: Select all

public Form1()
        {
            InitializeComponent();
            InitializeChart();
        }

        bool DrawZoomRect;
        int nSeries;
        int StartX, StartY;

        private void InitializeChart()
        {
            chartController1.Chart = tChart1;
            
            nSeries = 6;
            tChart1.Aspect.View3D = false;
            tChart1.Legend.Visible = false;
            tChart1.Panel.MarginUnits = Steema.TeeChart.PanelMarginUnits.Pixels;
            tChart1.Panel.MarginLeft = (nSeries * 15);
            tChart1.Panel.MarginRight = (nSeries * 15);
            tChart1.Zoom.Allow = false;
     
            for (int i = 0; i < nSeries; i++)
	        {
    		    new FastLine(tChart1.Chart);
                tChart1.Axes.Custom.Add(new Axis(false,false,tChart1.Chart));

                tChart1[i].CustomVertAxis = tChart1.Axes.Custom[i];
                tChart1.Axes.Custom[i].AxisPen.Color = tChart1[i].Color;
                tChart1.Axes.Custom[i].Grid.Visible = false;
                tChart1.Axes.Custom[i].Labels.Angle = 90;
                tChart1.Axes.Custom[i].RelativePosition = -((i % 3) * 28);
                tChart1[i].FillSampleValues(20000);
                ((FastLine)tChart1[i]).DrawAllPoints = false;
                tChart1.Axes.Custom[i].PositionUnits = PositionUnits.Pixels;
                if (((i + 1) % 2) == 0)
                {
                    tChart1.Axes.Custom[i].OtherSide = true;
                }
            }

            tChart1.MouseDown += new MouseEventHandler(tChart1_MouseDown);
            tChart1.MouseMove += new MouseEventHandler(tChart1_MouseMove);
            tChart1.MouseUp += new MouseEventHandler(tChart1_MouseUp);
        }

        void tChart1_MouseUp(object sender, MouseEventArgs e)
        {
            if (e.Button == MouseButtons.Left)
            {
                if (DrawZoomRect)
                {
                    if ((StartX < e.X) && (StartY < e.Y))
                    {
                        for (int i=0; i<nSeries; i++)
                        {
                            if ((tChart1.Axes.Custom[i].CalcPosPoint(StartY) >= tChart1.Axes.Custom[i].Minimum) & 
                                (tChart1.Axes.Custom[i].CalcPosPoint(StartY) <= tChart1.Axes.Custom[i].Maximum))
                            {
                                tChart1.Axes.Custom[i].SetMinMax(tChart1.Axes.Custom[i].CalcPosPoint(StartY),tChart1.Axes.Custom[i].CalcPosPoint(e.Y));
                            }
                        }
                        tChart1.Axes.Bottom.SetMinMax(tChart1.Axes.Bottom.CalcPosPoint(StartX), tChart1.Axes.Bottom.CalcPosPoint(e.X));
                    }
                    else
                    {
                        for (int i=0; i<tChart1.Axes.Custom.Count; i++)
                        {
                            tChart1.Axes.Custom[i].Automatic = true;
                        }
                        tChart1.Axes.Bottom.Automatic = true;
                        tChart1.Refresh();
                    }
                }
                DrawZoomRect = false;
            }
        }

        void  tChart1_MouseMove(object sender, MouseEventArgs e)
        {
            if (DrawZoomRect) 
            {
                tChart1.Invalidate();
                tChart1.Graphics3D.Brush.Visible = false;
                tChart1.Graphics3D.Rectangle(StartX, StartY, e.X, e.Y);               
            } 	        
        }

        void  tChart1_MouseDown(object sender, MouseEventArgs e)
        {
            if (e.Button == MouseButtons.Left)
            {
                StartX = e.X;
                StartY = e.Y;
                DrawZoomRect = true;
            }
        }