Bezier贝塞尔曲线的原理、二次贝塞尔曲线的实现

Bezier曲线的原理

Bezier曲线是应用于二维图形的曲线。曲线由顶点和控制点组成,通过改变控制点坐标可以改变曲线的形状。

一次Bezier曲线公式:

一次Bezier曲线是由P0至P1的连续点,描述的一条线段

二次Bezier曲线公式:

二次Bezier曲线是 P0至P1 的连续点Q0和P1至P2 的连续点Q1 组成的线段上的连续点B(t),描述一条抛物线。

三次Bezier曲线公式:

二次Bezier曲线的实现

#include <vector>

class CBezierCurve
{
public:
    CBezierCurve();
    ~CBezierCurve();

    void SetCtrlPoint(POINT& stPt);

    bool CreateCurve();

    void Draw(CDC* pDC);

private:
        // 主要算法,计算曲线各个点坐标
    void CalCurvePoint(float t, POINT& stPt);

private:
        // 顶点和控制点数组
    std::vector<POINT> m_vecCtrlPt;
        // 曲线上各点坐标数组
    std::vector<POINT> m_vecCurvePt;
};
    #include <math.h>
    #include "BezierCurve.h"  

    CBezierCurve::CBezierCurve()
    {
    }  

    CBezierCurve::~CBezierCurve()
    {
    }  

    void CBezierCurve::SetCtrlPoint(POINT& stPt)
    {
        m_vecCtrlPt.push_back(stPt);
    }  

    void CBezierCurve::CreateCurve()
    {
        // 确保是二次曲线,2个顶点一个控制点
        assert(m_vecCtrlPt.size() == 3);  

        // t的增量, 可以通过setp大小确定需要保存的曲线上点的个数
        float step = 0.01;
        for (float t = 0.0; t <= 1.0; t += step)
        {
            POINT stPt;
            CalCurvePoint(t, stPt);
            m_vecCurvePt.push_back(stPt);
        }
    }  

    void CBezierCurve::Draw(CDC* pDC)
    {
        // 画出曲线上个点,若不连续可以用直线连接各点
        int nCount = m_vecCurvePt.size();
        for (int i = 0; i < nCount; ++i)
        {
            pDC->SetPixel(m_vecCurvePt[i], 0x000000);
        }
    }  

    void CBezierCurve::CalCurvePoint(float t, POINT& stPt)
    {
            // 确保是二次曲线,2个顶点一个控制点
        assert(m_vecCtrlPt.size() == 3);  

        // 计算曲线点坐标,此为2次算法,改变此处可以实现多次曲线
        float x = (float)m_vecCtrlPt[0].x * pow(1 - t, 2)   +
                  (float)m_vecCtrlPt[1].x * t * (1 - t) * 2 +
                  (float)m_vecCtrlPt[2].x * pow(t, 2);
        float y = (float)m_vecCtrlPt[0].y * pow(1 - t, 2)   +
                  (float)m_vecCtrlPt[1].y * t * (1 - t) * 2 +
                  (float)m_vecCtrlPt[2].y * pow(t, 2);
        stPt.x =x;
        stPt.y= y;
    }  

Bezier贝塞尔曲线的原理、二次贝塞尔曲线的实现

时间: 2024-11-09 14:44:02

Bezier贝塞尔曲线的原理、二次贝塞尔曲线的实现的相关文章

贝塞尔曲线:原理、自定义贝塞尔曲线View、使用!!!

一.原理 转自:http://www.2cto.com/kf/201401/275838.html Android动画学习Demo(3) 沿着贝塞尔曲线移动的Property Animation Property Animation中最重要,最基础的一个类就是ValueAnimator了.Property Animation利用ValueAnimator来跟踪记录对象属性已经变化了多长时间及当前这个时间点的值. 而在ValueAnimator中,又封装了两个类: 1)TimeInterpolat

Android 利用二次贝塞尔曲线模仿购物车添加物品抛物线动画

0.首先,先给出一张效果gif图. 1.贝塞尔曲线原理及相关公式参考:http://www.jianshu.com/p/c0d7ad796cee 作者:许方镇. 2.原理:计算被点击 view.购物车view 以及他们所在父容器相对于屏幕的坐标. 3.在呗点击View坐标位置 父容器通过addView 增加需要完成动画的imgview. 4.自定义估值器 通过二次贝塞尔曲线公式(2个数据点,一个控制点)完成抛物线路径上的点xy坐标计算. 5.利用属性动画 +自定义估值器 完成imgview在父容

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

canvas中绘制二次贝塞尔曲线的方法为ctx.quadraticCurveTo(x1,y1,x2,y2); 四个参数分别为两个控制点的坐标.开始点即当前canvas中目前的点,如果想从指定的点开始,需要使用ctx.moveTo(x,y)方法 演示效果如下图 上代码: html <!doctype html> <html> <head> <meta charset="utf-8"> <title>无标题文档</title

二次贝塞尔曲线公式及导函数

二次贝塞尔曲线公式: B(t)=(1-t)2P0+2t(1-t)P1+t2P2,t∈[0,1] 二次贝塞尔曲线导函数: y,=2((1-t)(P1-P0)+t(P2-P1)) 要让二次贝塞尔曲线过Pt点,则控制点应为 Pc=2Pt-(P0+P2)/2 两直线的斜率分别为K1.K2,则夹角θ有 tanθ=|(k2- k1)/(1+ k1k2)|

并发编程 15—— 线程池 之 原理二

Java并发编程实践 目录 并发编程 01—— ConcurrentHashMap 并发编程 02—— 阻塞队列和生产者-消费者模式 并发编程 03—— 闭锁CountDownLatch 与 栅栏CyclicBarrier 并发编程 04—— Callable和Future 并发编程 05—— CompletionService : Executor 和 BlockingQueue 并发编程 06—— 任务取消 并发编程 07—— 任务取消 之 中断 并发编程 08—— 任务取消 之 停止基于线

一、掌握Samba服务的配置原理;二、在linux下配置samba共享服务

一.掌握Samba服务的配置原理二.在linux下配置samba共享服务(匿名共享.身份验证.账户映射.访问控制)Samba介绍:Samba是运行在Linux与Unix之上的免费共享服务的软件,是典型服务器/客户端模式,它有两个进程,一个是smbd,主要是用来管理共享文件的进程,另一个是nmbd,用来实现主机名到IP地址的转换(相当于Windows下的NetBIOS的功能),smbd运行在TCP的139.445端口,nmbd则运行在UDP的137.138端口(运行samba服务后可以用如:net

支持向量机原理(二) 线性支持向量机的软间隔最大化模型

? ? ? ? ? ?支持向量机原理(一) 线性支持向量机 支持向量机原理(二) 线性支持向量机的软间隔最大化模型 支持向量机原理(三)线性不可分支持向量机与核函数 支持向量机原理(四)SMO算法原理 支持向量机原理(五)线性支持回归 在支持向量机原理(一) 线性支持向量机中,我们对线性可分SVM的模型和损失函数优化做了总结.最后我们提到了有时候不能线性可分的原因是线性数据集里面多了少量的异常点,由于这些异常点导致了数据集不能线性可分,本篇就对线性支持向量机如何处理这些异常点的原理方法做一个总结

canvas 绘制二次贝塞尔曲线

代码: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>canvas</title> <script> function init() { var canvas=document.getElementById('canvas'); var ctx=canvas.getContext('2d')

曲线之美 --贝塞尔曲线

原文:http://blog.csdn.net/killwd/article/details/1460478 贝塞尔曲线   维基百科 http://zh.wikipedia.org/wiki/%E8%B2%9D%E8%8C%B2%E6%9B%B2%E7%B7%9A 在图形图像编程时,我们常常需要根据一系列已知点坐标来确 定一条光滑曲线.其中有些曲线需要严格地通过所有的已知点,而有些曲线却不一定需要.在后者中,比较有代表性的一类曲线是贝塞尔曲线(Bézier Splines). 网友们可能注意到