Hermite Curve_part3

by KUO YOU-TING

HTML

<script src="http://cdnjs.cloudflare.com/ajax/libs/three.js/r70/three.min.js"></script>
<div id="info">Hermite 2D Curve
    <br/> 
    <a href="javascript:showTime(0);">Bisection</a>
    <a href="javascript:showTime(1);">Newton</a>
</div>
<div id="dataShow"></div>

CSS

#info {
    position: absolute;
    top: 0px;
    width: 100%;
    padding: 10px;
    text-align: center;
    color: #ffff00
}
a {
    color: white;
}
#dataShow {
    position: absolute;
    bottom: 20px;
    width: 100%;
    padding:5px;
    text-align: center;
    color: #00ffff;
}
body {
    margin: 0px;
    overflow: hidden;
}

JavaScript

var clock = new THREE.Clock();
var camera, scene, renderer, border;
var mouse = new THREE.Vector2();
var curve;
var count = 0;
var p0, p1, p2, p3;
var q = [];
var coefficient; //六次方多項式
var t0, t1, t2;
var angleShow, time;

init();
animate();
drawCircle();

function showTime(option) { // 時間計算在onDocumentMouseDown
    if (option === 0) {
        time = t1-t0;
    } else {
        time = t2-t1;;
    }
    angleShow.innerHTML = time;
}

function eval (coeff, x) {
	var a6=coeff[0],a5=coeff[1],a4=coeff[2],a3=coeff[3],
        a2=coeff[4],a1=coeff[5],a0=coeff[6];
	var fx = x*(x*(x*(x*(x*(a6*x+a5)+a4)+a3)+a2)+a1)+a0;
    var dfx = x*(x*(x*(x*(6*a6*x+5*a5)+4*a4)+3*a3)+2*a2)+a1;
    return [fx,dfx];
}

function bisection (func, interval, eps) {
    var xLo = interval[0];
    var xHi = interval[1];
    
	fHi = func(coefficient,xHi)[0];
	fLo = func(coefficient,xLo)[0];
    if (fLo * fHi > 0)
        return undefined;
    
	var xMid, fHi, fLo, fMid;
	var iter = 0;
    while (xHi - xLo > eps) {
        ++iter;
		xMid = (xLo+xHi)/2;
		fMid = func(coefficient,xMid)[0];
		
        if (Math.abs(fMid) < eps)
			return [xMid, iter];

        else if (fMid*fLo < 0) { 
			xHi = xMid;
			fHi = fMid;
		} else { 
			xLo = xMid;
			fLo = fMid;
		}
	}
    
	return [(xLo+xHi)/2, iter];
}


function Newton (eval, x0, epsilon) {
    var eps = epsilon || 1e-4;
 	var imax = 20;
    for (var i = 0; i < imax; i++) {
	    var fdf = eval (coefficient, x0);
        x1 = x0 - fdf[0]/fdf[1];
        if (Math.abs(x1 - x0) < eps)
            break;
        x0 = x1;
    }
    return [x1, i];
}

function FourPointForm(q0, q1, q2, q3, mes) {
    var curveGroup = new THREE.Object3D();
    curveGroup.add(drawHermiteCurve(q0, q1.clone().sub(q0), q3, q3.clone().sub(q2)));

    var point, tangent;
    point = new THREE.Mesh(new THREE.CircleGeometry(1, 12), new THREE.MeshBasicMaterial());
    point.position.copy(q0);
    curveGroup.add(point);
    tangent = new THREE.Mesh(new THREE.PlaneBufferGeometry(2, 2), new...