Fix first and last segment of cardinal splines.

Repeat the Bézier segment control point, not the Cardinal control point.
d3 · Nov 13, 2015 · 4a695bb · 4a695bb
1 parent a100fd9
commit 4a695bb
Show file tree

Hide file tree

Showing 4 changed files with 21 additions and 17 deletions.
diff --git a/src/interpolate/cardinal-closed.js b/src/interpolate/cardinal-closed.js
@@ -39,7 +39,7 @@ CardinalClosed.prototype = {
     x = +x, y = +y;
     switch (this._state) {
       case 0: this._state = 1; this._x3 = x, this._y3 = y; break;
-      case 1: this._state = 2; this._x4 = x, this._y4 = y; this._context.moveTo(x, y); break;
+      case 1: this._state = 2; this._context.moveTo(this._x4 = x, this._y4 = y); break;
       case 2: this._state = 3; this._x5 = x, this._y5 = y; break;
       default: {
         this._context.bezierCurveTo(

diff --git a/src/interpolate/cardinal.js b/src/interpolate/cardinal.js
@@ -20,9 +20,11 @@ Cardinal.prototype = {
       case 1: this._context.closePath(); break;
       case 2: this._context.lineTo(this._x2, this._y2); break;
       case 3: {
-        this._context.quadraticCurveTo(
-          this._x1 + this._k * (this._x2 - this._x0) * 3 / 2,
-          this._y1 + this._k * (this._y2 - this._y0) * 3 / 2,
+        this._context.bezierCurveTo(
+          this._x1 + this._k * (this._x2 - this._x0),
+          this._y1 + this._k * (this._y2 - this._y0),
+          this._x2,
+          this._y2,
           this._x2,
           this._y2
         );
@@ -37,9 +39,11 @@ Cardinal.prototype = {
       case 1: this._state = 2; break;
       case 2: {
         this._state = 3;
-        this._context.quadraticCurveTo(
-          this._x2 + this._k * (this._x1 - x) * 3 / 2,
-          this._y2 + this._k * (this._y1 - y) * 3 / 2,
+        this._context.bezierCurveTo(
+          this._x1,
+          this._y1,
+          this._x2 + this._k * (this._x1 - x),
+          this._y2 + this._k * (this._y1 - y),
           this._x2,
           this._y2
         );

diff --git a/src/line.js b/src/line.js
@@ -74,7 +74,7 @@ export default function() {
     return line;
   };
 
-  line.interpolate = function(_, tension) {
+  line.interpolate = function(_, a) {
     if (!arguments.length) return interpolate;
     if (typeof _ === "function") interpolate = _;
     else switch (_ + "") {
@@ -85,9 +85,9 @@ export default function() {
       case "basis": interpolate = basis; break;
       case "basis-open": interpolate = basisOpen; break;
       case "basis-closed": interpolate = basisClosed; break;
-      case "cardinal": interpolate = cardinal(tension); break;
-      case "cardinal-open": interpolate = cardinalOpen(tension); break;
-      case "cardinal-closed": interpolate = cardinalClosed(tension); break;
+      case "cardinal": interpolate = cardinal(a); break;
+      case "cardinal-open": interpolate = cardinalOpen(a); break;
+      case "cardinal-closed": interpolate = cardinalClosed(a); break;
       case "cubic": interpolate = cubic; break;
       default: interpolate = linear; break;
     }

diff --git a/test/line-test.js b/test/line-test.js
@@ -47,8 +47,8 @@ tape("line.interpolate(\"cardinal\", tension) sets the cardinal interpolation te
   test.equal(l([]), null);
   test.equal(l([[0, 1]]), "M0,1Z");
   test.equal(l([[0, 1], [1, 3]]), "M0,1L1,3");
-  test.equal(l([[0, 1], [1, 3], [2, 1]]), "M0,1Q0.55,3,1,3Q1.45,3,2,1");
-  test.equal(l([[0, 1], [1, 3], [2, 1], [3, 3]]), "M0,1Q0.55,3,1,3C1.3,3,1.7,1,2,1Q2.45,1,3,3");
+  test.equal(l([[0, 1], [1, 3], [2, 1]]), "M0,1C0,1,0.7,3,1,3C1.3,3,2,1,2,1");
+  test.equal(l([[0, 1], [1, 3], [2, 1], [3, 3]]), "M0,1C0,1,0.7,3,1,3C1.3,3,1.7,1,2,1C2.3,1,3,3,3,3");
   test.end();
 });
 
@@ -57,8 +57,8 @@ tape("line.interpolate(\"cardinal\", tension) coerces the specified tension to a
   test.equal(l([]), null);
   test.equal(l([[0, 1]]), "M0,1Z");
   test.equal(l([[0, 1], [1, 3]]), "M0,1L1,3");
-  test.equal(l([[0, 1], [1, 3], [2, 1]]), "M0,1Q0.55,3,1,3Q1.45,3,2,1");
-  test.equal(l([[0, 1], [1, 3], [2, 1], [3, 3]]), "M0,1Q0.55,3,1,3C1.3,3,1.7,1,2,1Q2.45,1,3,3");
+  test.equal(l([[0, 1], [1, 3], [2, 1]]), "M0,1C0,1,0.7,3,1,3C1.3,3,2,1,2,1");
+  test.equal(l([[0, 1], [1, 3], [2, 1], [3, 3]]), "M0,1C0,1,0.7,3,1,3C1.3,3,1.7,1,2,1C2.3,1,3,3,3,3");
   test.end();
 });
 
@@ -185,8 +185,8 @@ tape("line.interpolate(\"cardinal\")(data) generates the expected path", functio
   test.equal(l([]), null);
   test.equal(l([[0, 1]]), "M0,1Z");
   test.equal(l([[0, 1], [1, 3]]), "M0,1L1,3");
-  test.equal(l([[0, 1], [1, 3], [2, 1]]), "M0,1Q0.5,3,1,3Q1.5,3,2,1");
-  test.equal(l([[0, 1], [1, 3], [2, 1], [3, 3]]), "M0,1Q0.5,3,1,3C1.3333333333333333,3,1.6666666666666667,1,2,1Q2.5,1,3,3");
+  test.equal(l([[0, 1], [1, 3], [2, 1]]), "M0,1C0,1,0.6666666666666667,3,1,3C1.3333333333333333,3,2,1,2,1");
+  test.equal(l([[0, 1], [1, 3], [2, 1], [3, 3]]), "M0,1C0,1,0.6666666666666667,3,1,3C1.3333333333333333,3,1.6666666666666667,1,2,1C2.3333333333333335,1,3,3,3,3");
   test.end();
 });