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

感谢阅读,希望可以帮到你

WPF绘制光滑连续贝塞尔曲线的更多相关文章

  1. canvas绘制二次贝塞尔曲线----演示二次贝塞尔四个参数的作用

    canvas中绘制二次贝塞尔曲线的方法为ctx.quadraticCurveTo(x1,y1,x2,y2); 四个参数分别为两个控制点的坐标.开始点即当前canvas中目前的点,如果想从指定的点开始, ...

  2. canvas 绘制三次贝塞尔曲线

    代码: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8 ...

  3. canvas 绘制二次贝塞尔曲线

    代码: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8 ...

  4. WPF贝塞尔曲线示例

    WPF贝塞尔曲线示例 贝塞尔曲线在之前使用SVG的时候其实就已经有接触到了,但应用未深,了解的不是很多,最近在进行图形操作的时候需要用到贝塞尔曲线,所以又重新来了解WPF中贝塞尔曲线的绘制. 一阶贝塞 ...

  5. canvas绘制贝塞尔曲线

    原文:canvas绘制贝塞尔曲线 1.绘制二次方贝塞尔曲线 quadraticCurveTo(cp1x,cp1y,x,y); 其中参数cp1x和cp1y是控制点的坐标,x和y是终点坐标 数学公式表示如 ...

  6. Canvas中绘制贝塞尔曲线

    ① 什么是贝塞尔曲线? 在数学的数值分析领域中,贝济埃曲线(英语:Bézier curve,亦作“贝塞尔”)是计算机图形学中相当重要的参数曲线.更高维度的广泛化贝济埃曲线就称作贝济埃曲面,其中贝济埃三 ...

  7. iOS:使用贝塞尔曲线绘制图表(折线图、柱状图、饼状图)

    1.介绍: UIBezierPath :画贝塞尔曲线的path类 UIBezierPath定义 : 贝赛尔曲线的每一个顶点都有两个控制点,用于控制在该顶点两侧的曲线的弧度. 曲线的定义有四个点:起始点 ...

  8. n阶贝塞尔曲线绘制(C/C#)

    原文:n阶贝塞尔曲线绘制(C/C#) 贝塞尔是很经典的东西,轮子应该有很多的.求n阶贝塞尔曲线用到了 德卡斯特里奥算法(De Casteljau's Algorithm) 需要拷贝代码请直接使用本文最 ...

  9. OpenGL 实践之贝塞尔曲线绘制

    说到贝塞尔曲线,大家肯定都不陌生,网上有很多关于介绍和理解贝塞尔曲线的优秀文章和动态图. 以下两个是比较经典的动图了. 二阶贝塞尔曲线: 三阶贝塞尔曲线: 由于在工作中经常要和贝塞尔曲线打交道,所以简 ...

随机推荐

  1. C++实现Date日期类

    定义一个Date类,包含三个属性年.月.日 实现了如下功能: 年月日的增加.减少:2017年10月1日加上100个月30天是2025年5月31日 输出某天是星期几:2017年10月1日是星期日 判断某 ...

  2. JS面向对象与面向过程

    前言 面向对象编程: 就是将你的需求抽象成一个对象,然后针对这个对象分析其特征(属性)与动作(方法)--这个对象就称之为类 面向过程编程: 特点:封装,就是将你需要的功能放在一个对象里面 ------ ...

  3. Python 中 Iterator(迭代器)和Iterable(迭代对象)的区别

    直接可以用作for循环的数据类型有以下几种: tuple.list.dict.str等, 上述数据类型可以用作for循环的叫做可迭代对象Iterable.可以使用isinstance判断一个对象是否是 ...

  4. Oracle查询优化改写--------------------高级查询

    一.给结果集分页 二.重新生成房间号 三.跳过表中n行 四.排列组合去重

  5. UWP 使用Windows.Media.FaceAnalysis.FaceDetector检测人脸

    话说现在检测人脸的技术有很多.有在线AI服务,比如Megvii Face++,Microsoft Cognitive Services,Tencent AI等等.还有本地的库实现的,比如OpenCV. ...

  6. hadoop集群简单搭建

    分布式搭建 在ubuntu下创建hadoop用户组和用户 bigdata@master:~$sudo addgroup hadoop bigdata@master:~$sudo adduser --i ...

  7. 《团队-手机app便签-开发文档》

    项目托管平台地址:https://github.com/Vcandoit/Notepad.git 我主要负责文件存储部分,文字部分使用sqlite保存. 因为我们想实现备忘录记录照片.语音的功能,所以 ...

  8. C语言作业--数组

    一.PTA实验作业 题目1:7-5 数组循环左移 1. 本题PTA提交列表 2. 设计思路 定义俩个整数 n,m 定义循环变量i,j,x 定义变量k用来存放下标 定义变量number用于交换数值 定义 ...

  9. 201621123062《java程序设计》第十周作业总结

    1. 本周学习总结 1.1 以你喜欢的方式(思维导图或其他)归纳总结异常相关内容. 思维导图: 2. 书面作业 本次PTA作业题集异常 2.1. 常用异常 结合题集题目7-1回答 2.1.1 自己以前 ...

  10. 20162328蔡文琛week07

    学号 2016-2017-2 <程序设计与数据结构>第X周学习总结 教材学习内容总结 多态引用在不同的时候可以指向不同类型的对象. 多态引用在运行时才将方法调用用于它的定义绑定在一起. 引 ...