OpenGL绘制简单的参数曲线（一）——三次Hermite曲线

　　网上这类曲线绘制的文章非常多，但是大多都是代码一贴就完事了，甚至连参数怎么调也没说清楚。我翻阅了不少资料，这里做个汇总，主要也就介绍一下几类简单的曲线绘制，如Hermite曲线、Bezier曲线等。今天先说说Hermite曲线，基本上最常见的就是两点确定的三次Hermite曲线了。

　　按照惯例，我们先来介绍一下Hermite曲线的原理。Hermite曲线是给定曲线段的两个端点坐标以及两端点处的切线矢量来描述的曲线。平面上一条三次参数曲线可以表示为：

图1

　　空间Hermite曲线跟上述类似，只是加一个z分量。根据上式，该曲线的矢量表达式为：

　

图2

　　这些带箭头的变量都是向量。我们根据几何定义，t=0时，曲线表达式的值就是P₀点，t=1时，曲线表达式的值就是P₁点。我们就得到了P₀、P₁、P₀'、P₁'的关系式，从而解得各个代数系数：

 

图3

　　于是，矩阵表达式为：

图4

　　中间的矩阵M是由初始条件确定的一个矩阵。写到这里我们已经具备了基础知识。这个两点确定的三次Hermite曲线主要有四个参数，P₀和P₁分别表示起始和终点位置，P₀'和P₁'分别表示起点和终点的方向（不过略微有点差异，大家可以根据程序自己调试感受下），下面我贴出代码，大家结合代码就能更理解了。

 

#include <math.h>
#include <gl/glut.h>
#include <iostream>
using namespace std;
  
struct  Point2
{
	double x;
	double y;

	Point2(int px, int py) { x = px; y = py; }
};

Point2 P0(100, 200);
Point2 P1(350, 200);
Point2 derP0(200, 200);
Point2 derP1(200, 200);

bool mouseLeftDown = false;
bool mouseRightDown = false;
 
/*计算Hermite曲线*/
void Hermit(int n)  
{  
	float f1, f2, f3, f4;  

	double deltaT = 1.0 / n;  
	
	glBegin(GL_LINE_STRIP);  
	for (int i = 0; i <= n; i++) {  

		double T = i * deltaT;

		f1 = 2.0*pow(T, 3)  - 3.0*pow(T, 2) + 1.0;  
		f2 = -2.0*pow(T, 3)  + 3.0*pow(T, 2);  
		f3 =  pow(T, 3)   - 2.0*pow(T, 2) + T;  
		f4 =  pow(T, 3)  - pow(T, 2);  

		glVertex2f( f1*P0.x + f2*P1.x + f3*derP0.x + f4*derP1.x,  
			f1*P0.y + f2*P1.y + f3*derP0.y + f4*derP1.y );  
	}  
	glEnd();  
}  
  
/*用鼠标进行绘制，完成后可改变控制点，拖动即可*/
void display(){
    glClear(GL_COLOR_BUFFER_BIT);

    glLineWidth(1.5);
    glColor3f (1.0, 0.0, 0.0);
	glBegin(GL_LINES);
	glVertex2f(P0.x, P0.y);
	glVertex2f(P0.x + derP0.x/4, P0.y + derP0.y/4);
	glVertex2f(P1.x, P1.y);
	glVertex2f(P1.x - derP1.x/4, P1.y - derP1.y/4);
    glEnd();

	glColor3f (0.0, 0.0, 1.0);
	glPointSize(10.0f);

	glBegin(GL_POINTS);
	glVertex2f(P0.x, P0.y);
	glVertex2f(P0.x + derP0.x/4, P0.y + derP0.y/4);
	glVertex2f(P1.x, P1.y);
	glVertex2f(P1.x - derP1.x/4, P1.y - derP1.y/4);
	glEnd();
  
    Hermit(20);
  
    glFlush();
    glutSwapBuffers();
}
  
void init()
{
    glClearColor(1.0, 1.0, 1.0, 0.0);
    glShadeModel(GL_FLAT);
}
  
void myReshape(int w, int h)
{
    glViewport(0, 0, (GLsizei)w, (GLsizei)h);
    glMatrixMode(GL_PROJECTION);
    glLoadIdentity();
    gluOrtho2D(0.0, (GLsizei)w, (GLsizei)h, 0.0);
    glMatrixMode(GL_MODELVIEW);
    glLoadIdentity();
}
  
void mouse(int button, int state, int x, int y)
{
	if (button == GLUT_LEFT_BUTTON && state == GLUT_DOWN)
	{
		mouseLeftDown = true;
	}

	if (button == GLUT_LEFT_BUTTON && state == GLUT_UP)
	{
		mouseLeftDown = false;
	}

	if (button == GLUT_RIGHT_BUTTON && state == GLUT_DOWN)
	{
		mouseRightDown = true;
	}

	if (button == GLUT_RIGHT_BUTTON && state == GLUT_UP)
	{
		mouseRightDown = false;
	}
}

double distance(int x1, int y1, int x2, int y2)
{
	return sqrt((x1-x2) * (x1 -x2) + (y1-y2) * (y1-y2));
}

void motion(int x, int y)
{
    if (mouseLeftDown)
	{  
		if (distance(P0.x + derP0.x/4, P0.y + derP0.y/4, x, y) < 20)
		{
			derP0.x = (x - P0.x)*4;
			derP0.y = (y - P0.y)*4;
		}

		if (distance(P1.x - derP1.x/4, P1.y - derP1.y/4, x, y) < 20)
		{
			derP1.x = (P1.x - x)*4;
			derP1.y = (P1.y - y)*4;
		}
    }

    glutPostRedisplay();
}
  
int  main(int argc, char** argv)
{
    glutInit(&argc, argv);
    glutInitDisplayMode (GLUT_DOUBLE | GLUT_RGB );
    glutInitWindowSize (450, 450);
    glutInitWindowPosition (200, 200);
    glutCreateWindow ("hello");
    init ();
  
    glutDisplayFunc(display);
    glutReshapeFunc(myReshape);
    glutMouseFunc(mouse);
    glutMotionFunc(motion);
  
    glutMainLoop();
    return 0;
}