examples/curveReverse.html

<!DOCTYPE html>
<html>
<head>
    <title>Curve Reversal</title>

    <script src="js/verb.min.js"></script>
    <script src="js/three.min.js"></script>
    <script src="js/verbToThreeConversion.js"></script>
    <script src="js/OrbitControls.js"></script>
    <script src="js/codemirror.js"></script>
    <script src="js/javascript.js"></script>
    <script src="js/threeBasic.js"></script>

    <link href='https://fonts.googleapis.com/css?family=Source+Sans+Pro:400,300' rel='stylesheet' type='text/css'>

    <link rel="stylesheet" href="css/codemirror.css">
    <link rel="stylesheet" href="css/example.css">
    <link rel="stylesheet" href="css/colorforth.css">
</head>
<body>

<div id="button">Show/Hide Code</div>
<div id="viewer" class="col">
    <div id="title"></div>
</div>
<div id="code-container" class="col scroll-y"></div>

</body>
<script id="script">
	setupScene();

    var c = new verb.geom.Arc([0,0,0], [1,0,0], [0,1,0], 20, 0, Math.PI/ 2 );
    var cr = c.reverse(); // returns a reversed copy
    var crr = cr.reverse(); // returns the original

    // all curves will be coincident. comment out these lines in order to see the individual curves.
	addCurveToScene( c.toThreeGeometry(), new THREE.LineBasicMaterial({ color: 0xff0000}) );
	addCurveToScene( cr.toThreeGeometry(), new THREE.LineBasicMaterial({ color: 0x00ff00}) );
	addCurveToScene( crr.toThreeGeometry(), new THREE.LineBasicMaterial({ color: 0x0000ff}) );

	renderScene();
</script>

<script src="js/example.js"></script>

</html>