Auto Zoom Y Axis on X Axis Zoom

Question

Yes i know about ( This post ) , if you search you will notice the event AxisValueChanged seems to only exist in this one thread.

My goal is simply to automaticly zoom the Y axis when user make a selection on the X axis, but i have been unable to figure out how.

I also tried to to use the SelectionRangeChanged event, but this event seems kind of broken as im unable to figure out whats actual range selected? ( IE so i can find the maximum / minimum ranges ).

Im using MS chart ( Microsoft chart )

The end goal is when i zoom X axis ( This is a FastLine Chart) it should see the new "max" visible value on Y axis and resize/zoom it accordingly

digEmAll digEmAll · Accepted Answer · 2012-04-17T17:44:41

If I understand you correctly, given a zoomed range on X axis you want to zoom also the same range on Y axis. If so, you can do in this way:

void chart1_SelectionRangeChanged(object sender, CursorEventArgs e)
{
    // Given the visible (zoomed) range on X, 
    // it zooms the same relative range on Y:
    // i.e. if on the X axis, the range 5% - 30% is zoomed, 
    // it zooms the same range on Y.
    var axisY = this.chart1.ChartAreas[0].AxisY;

    var totalXRange = e.Axis.Maximum - e.Axis.Minimum;
    var totalYRange = axisY.Maximum - axisY.Minimum;

    var ySelectionStart = (e.Axis.ScaleView.ViewMinimum - e.Axis.Minimum) *
                          totalYRange / totalXRange;
    var ySelectionEnd = (e.Axis.ScaleView.ViewMaximum - e.Axis.Minimum) * 
                         totalYRange / totalXRange;

    axisY.ScaleView.Zoom(ySelectionStart,ySelectionEnd);
}

As you said, the event AxisValueChanged doesn't exist; the post you linked probably meant the (existing) event AxisViewChanged.

Obviously, you can also use AxisViewChanged for your purpose, and adapting my code to exploit that event shouldn't be so hard.

Feel free to ask if you need help though ;)

EDIT :

I modified my code to account for your goal. The following code computes the Y range corresponding to the maximum and minimum values of the points inside the zoomed X range:

void chart1_SelectionRangeChanged(object sender, CursorEventArgs e)
{
    var axisY = this.chart1.ChartAreas[0].AxisY;

    var xRangeStart = e.Axis.ScaleView.ViewMinimum;
    var xRangeEnd = e.Axis.ScaleView.ViewMaximum;

    // compute the Y values for the points crossing the range edges
    double? yRangeStart = null;
    var pointBeforeRangeStart = this.chart1.Series[0].Points.FirstOrDefault(x => x.XValue <= xRangeStart);
    var pointAfterRangeStart = this.chart1.Series[0].Points.FirstOrDefault(x => x.XValue > xRangeStart);
    if (pointBeforeRangeStart != null && pointAfterRangeStart != null)
        yRangeStart = Interpolate2Points(pointBeforeRangeStart, pointAfterRangeStart, xRangeStart);

    double? yRangeEnd = null;
    var pointBeforeRangeEnd = this.chart1.Series[0].Points.FirstOrDefault(x => x.XValue <= xRangeEnd);
    var pointAfterRangeEnd = this.chart1.Series[0].Points.FirstOrDefault(x => x.XValue > xRangeEnd);
    if (pointBeforeRangeEnd != null && pointAfterRangeEnd != null)
        yRangeEnd = Interpolate2Points(pointBeforeRangeEnd, pointAfterRangeEnd, xRangeEnd);

    var edgeValues = new[] { yRangeStart, yRangeEnd }.Where(x => x.HasValue).Select(x => x.Value);

    // find the points inside the range
    var valuesInRange = this.chart1.Series[0].Points
    .Where(p => p.XValue >= xRangeStart && p.XValue <= xRangeEnd)
    .Select(x => x.YValues[0]);

    // find the minimum and maximum Y values
    var values = valuesInRange.Concat(edgeValues);
    double yMin;
    double yMax;
    if (values.Any())
    {
        yMin = values.Min();
        yMax = values.Max();
    }
    else
    {
        yMin = this.chart1.Series[0].Points.Min(x => x.YValues[0]);
        yMax = this.chart1.Series[0].Points.Max(x => x.YValues[0]);
    }

    // zoom Y-axis to [yMin - yMax]
    axisY.ScaleView.Zoom(yMin, yMax);
}

// see: http://en.wikipedia.org/wiki/Linear_interpolation#Linear_interpolation_between_two_known_points
public static double Interpolate2Points(DataPoint p1, DataPoint p2, double x)
{
    var x0 = p1.XValue;
    var y0 = p1.YValues[0];
    var x1 = p2.XValue;
    var y1 = p2.YValues[0];
    return y0 + ((x - x0) * y1 - (x - x0) * y0) / (x1 - x0);
}

Auto Zoom Y Axis on X Axis Zoom

1 Answers