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

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

以下圖形：

 實現方案

曲線上的點集

Geometry提供了一個函數GetFlattenedPathGeometry，能夠獲取其繪製後顯示的多邊形。

咱們能夠經過其Figures -> PathSegment -> Point，

 1     public List<Point> GetPointsOnPath(Geometry geometry)
 2     {
 3         List<Point> points = new List<Point>();
 4         PathGeometry pathGeometry = geometry.GetFlattenedPathGeometry();
 5         foreach (var figure in pathGeometry.Figures)
 6         {
 7             var ordinateOnPathFigureByAbscissa = GetOrdinateOnPathFigureByAbscissa(figure);
 8             points.AddRange(ordinateOnPathFigureByAbscissa);
 9         }
10         return points;
11     }
12     private List<Point> GetOrdinateOnPathFigureByAbscissa(PathFigure figure)
13     {
14         List<Point> outputPoints = new List<Point>();
15         Point current = figure.StartPoint;
16         foreach (PathSegment s in figure.Segments)
17         {
18             PolyLineSegment segment = s as PolyLineSegment;
19             LineSegment line = s as LineSegment;
20             Point[] points;
21             if (segment != null)
22             {
23                 points = segment.Points.ToArray();
24             }
25             else if (line != null)
26             {
27                 points = new[] { line.Point };
28             }
29             else
30             {
31                 throw new InvalidOperationException("尼瑪！");
32             }
33             foreach (Point next in points)
34             {
35                 var ellipse = new Ellipse()
36                 {
37                     Width = 6,
38                     Height = 6,
39                     Fill = Brushes.Blue
40                 };
41                 Canvas.SetTop(ellipse, next.Y);
42                 Canvas.SetLeft(ellipse, next.X);
43                 ContentCanvas.Children.Add(ellipse);
44                 current = next;
45             }
46         }
47         return outputPoints;
48     }

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

 

曲線上的點

咱們發現，拐角越大，獲取的點越密集。因此能夠看出，角度變化越大，須要的點越密集。

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

咱們是否是能夠曲線救國，經過相鄰的倆個點畫直接，從而獲取倆點間的點座標呢？咱們來嘗試下~

仍是原來的代碼，傳入一個X座標參數便可。

而後倆點之間，獲取X座標對應的Y座標：

 1         private bool TryGetOrdinateOnVectorByAbscissa(Point start, Point end, double abscissa, out double ordinate)
 2         {
 3             ordinate = 0.0;
 4             if ((start.X < end.X && abscissa >= start.X && abscissa <= end.X) ||
 5                 (start.X > end.X && abscissa <= start.X && abscissa >= end.X))
 6             {
 7                 var xRatio = (abscissa - start.X) / (end.X - start.X);
 8                 var yLength = end.Y - start.Y;
 9                 var y = yLength * xRatio + start.Y;
10                 ordinate = y;
11                 return true;
12             }
13             return false;
14         }

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

 

 Github： Demo