C# 曲線上的點（一） 獲取指定橫坐標對應的縱坐標值

獲取直線上的點，很容易，那曲線呢？二階貝塞爾、三階貝塞爾、多段混合曲線，如何獲取指定橫坐標對應的縱坐標？

如下圖形：

 實現方案

曲線上的點集

Geometry提供了一個函數GetFlattenedPathGeometry，可以獲取其繪制后顯示的多邊形。

我們可以通過其Figures -> PathSegment -> Point，

    public List<Point> GetPointsOnPath(Geometry geometry)
    {
        List<Point> points = new List<Point>();
        PathGeometry pathGeometry = geometry.GetFlattenedPathGeometry();
        foreach (var figure in pathGeometry.Figures)
        {
            var ordinateOnPathFigureByAbscissa = GetOrdinateOnPathFigureByAbscissa(figure);
            points.AddRange(ordinateOnPathFigureByAbscissa);
        }
        return points;
    }
    private List<Point> GetOrdinateOnPathFigureByAbscissa(PathFigure figure)
    {
        List<Point> outputPoints = new List<Point>();
        Point current = figure.StartPoint;
        foreach (PathSegment s in figure.Segments)
        {
            PolyLineSegment segment = s as PolyLineSegment;
            LineSegment line = s as LineSegment;
            Point[] points;
            if (segment != null)
            {
                points = segment.Points.ToArray();
            }
            else if (line != null)
            {
                points = new[] { line.Point };
            }
            else
            {
                throw new InvalidOperationException("尼瑪！");
            }
            foreach (Point next in points)
            {
                var ellipse = new Ellipse()
                {
                    Width = 6,
                    Height = 6,
                    Fill = Brushes.Blue
                };
                Canvas.SetTop(ellipse, next.Y);
                Canvas.SetLeft(ellipse, next.X);
                ContentCanvas.Children.Add(ellipse);
                current = next;
            }
        }
        return outputPoints;
    }

最終界面顯示，獲取的點集是如下布局的：

 

曲線上的點

我們發現，拐角越大，獲取的點越密集。所以可以看出，角度變化越大，需要的點越密集。

直線通過斜率很容易獲取橫坐標對應的縱坐標，那么這有如此多點的曲線呢？

我們是不是可以曲線救國，通過相鄰的倆個點畫直接，從而獲取倆點間的點坐標呢？我們來嘗試下~

還是原來的代碼，傳入一個X坐標參數即可。

然后倆點之間，獲取X坐標對應的Y坐標：

        private bool TryGetOrdinateOnVectorByAbscissa(Point start, Point end, double abscissa, out double ordinate)
        {
            ordinate = 0.0;
            if ((start.X < end.X && abscissa >= start.X && abscissa <= end.X) ||
                (start.X > end.X && abscissa <= start.X && abscissa >= end.X))
            {
                var xRatio = (abscissa - start.X) / (end.X - start.X);
                var yLength = end.Y - start.Y;
                var y = yLength * xRatio + start.Y;
                ordinate = y;
                return true;
            }
            return false;
        }

點擊窗口，在曲線上，獲取點擊處X坐標對應的點。效果圖如下：

 

 Github： Demo