1.需求 WPF本身沒有直接把點集合繪製成曲線的函數。可以通過貝塞爾曲線函數來繪製。 貝塞爾曲線類是：BezierSegment，三次貝塞爾曲線，通過兩個控制點來控制開始和結束方向。 QuadraticBezierSegment，二次貝塞爾，通過一個控制點來控制彎曲方向。 本文使用的是三次。 圖片來 ...
1.需求
WPF本身沒有直接把點集合繪製成曲線的函數。可以通過貝塞爾曲線函數來繪製。
貝塞爾曲線類是：BezierSegment，三次貝塞爾曲線，通過兩個控制點來控制開始和結束方向。
QuadraticBezierSegment，二次貝塞爾，通過一個控制點來控制彎曲方向。
本文使用的是三次。
圖片來源維基百科
2.思路
參考文檔是：https://www.cnblogs.com/pangliang/archive/2011/03/24/1993308.html
大值思路是根據當前點，前一個點，後一個點，再後一個點。共四個點，來生成一條三次貝塞爾曲線。
曲線需要（開始點，結束點，控制點1，控制點2），圖中標識的兩個紅色點即是控制點。
代碼主要是計算兩個紅色的控制點。
先計算相鄰點的中點【橙色】。
再將中點的連線平移到相鄰的位置【藍色點】，取得虛線，得到虛線的端點【紅色】。
紅色，即為控制點。
3.主要代碼
/// <summary>
/// 獲得貝塞爾曲線
/// </summary>
/// <param name="currentPt">當前點</param>
/// <param name="lastPt">上一個點</param>
/// <param name="nextPt1">下一個點1</param>
/// <param name="nextPt2">下一個點2</param>
/// <returns></returns>
private BezierSegment GetBezierSegment(Point currentPt, Point lastPt, Point nextPt1, Point nextPt2)
{
//計算中點
var lastC = GetCenterPoint(lastPt, currentPt);
var nextC1 = GetCenterPoint(currentPt, nextPt1); //貝塞爾控制點
var nextC2 = GetCenterPoint(nextPt1, nextPt2);
//計算相鄰中點連線跟目的點的垂足
//效果並不算太好，因為可能點在兩個線上或者線的延長線上，計算會有誤差
//所以就直接使用中點平移方法。
//var C1 = GetFootPoint(lastC, nextC1, currentPt);
//var C2 = GetFootPoint(nextC1, nextC2, nextPt1);
//計算“相鄰中點”的中點
var c1 = GetCenterPoint(lastC, nextC1);
var c2 = GetCenterPoint(nextC1, nextC2);
//計算【"中點"的中點】需要的點位移
var controlPtOffset1 = currentPt - c1;
var controlPtOffset2 = nextPt1 - c2;
//移動控制點
var controlPt1 = nextC1 + controlPtOffset1;
var controlPt2 = nextC1 + controlPtOffset2;
//如果覺得曲線幅度太大，可以將控制點向當前點靠近一定的繫數。
controlPt1 = controlPt1 + 0 * (currentPt - controlPt1);
controlPt2 = controlPt2 + 0 * (nextPt1 - controlPt2);
var bzs = new BezierSegment(controlPt1, controlPt2, nextPt1, true);
return bzs;
}
效果圖如下：
4.源碼下載
https://files.cnblogs.com/files/chlm/WPF%E5%85%89%E6%BB%91%E6%9B%B2%E7%BA%BF%E5%9B%BE.rar
感謝閱讀，希望可以幫到你
