Merge pull request #1268 from Graylog2/master

Add spline custom interpolation

spec/shape.line-spec.js

@@ -30,7 +30,7 @@ describe('c3 chart shape line', function () {
             });
         });
 
-        it('should chnage to step chart', function () {
+        it('should change to step chart', function () {
             args.data.type = 'step';
             expect(true).toBeTruthy();
         });
@@ -42,6 +42,15 @@ describe('c3 chart shape line', function () {
             });
         });
 
+        it('should change to spline chart', function () {
+            args.data.type = 'spline';
+            expect(true).toBeTruthy();
+        });
+
+        it('should use cardinal interpolation by default', function () {
+            expect(chart.internal.config.spline_interpolation_type).toBe('cardinal');
+        });
+
     });
 
     describe('point.show option', function () {
@@ -96,4 +105,40 @@ describe('c3 chart shape line', function () {
 
     });
 
+    describe('spline.interpolation option', function () {
+
+        it('should update args', function () {
+            args = {
+                data: {
+                    columns: [
+                        ['data1', 30, 200, 100, 400, -150, 250],
+                        ['data2', 50, 20, 10, 40, 15, 25],
+                        ['data3', -150, 120, 110, 140, 115, 125]
+                    ],
+                    type: 'spline'
+                },
+                spline: {
+                    interpolation: {
+                        type: 'monotone'
+                    }
+                }
+            };
+            expect(true).toBeTruthy();
+        });
+
+        it('should update interpolation function', function() {
+            expect(chart.internal.getInterpolate(chart.data()[0])).toBe('monotone');
+        });
+
+        it('should not use a non-valid interpolation', function () {
+            args.spline.interpolation.type = 'foo';
+            expect(true).toBeTruthy();
+        });
+
+        it('should use cardinal interpolation when given option is not valid', function() {
+            expect(chart.internal.getInterpolate(chart.data()[0])).toBe('cardinal');
+        });
+
+    });
+
 });

src/config.js

@@ -188,6 +188,8 @@ c3_chart_internal_fn.getDefaultConfig = function () {
         donut_title: "",
         donut_expand: {},
         donut_expand_duration: 50,
+        // spline
+        spline_interpolation_type: 'cardinal',
         // region - region to change style
         regions: [],
         // tooltip - show when mouseover on each data

src/shape.js

@@ -67,5 +67,6 @@ c3_chart_internal_fn.isWithinShape = function (that, d) {
 
 c3_chart_internal_fn.getInterpolate = function (d) {
     var $$ = this;
-    return $$.isSplineType(d) ? "cardinal" : $$.isStepType(d) ? $$.config.line_step_type : "linear";
+    var interpolation = $$.isInterpolationType() ? $$.config.spline_interpolation_type : 'cardinal';
+    return $$.isSplineType(d) ? interpolation : $$.isStepType(d) ? $$.config.line_step_type : "linear";
 };

src/type.js

@@ -89,3 +89,6 @@ c3_chart_internal_fn.lineOrScatterData = function (d) {
 c3_chart_internal_fn.barOrLineData = function (d) {
     return this.isBarType(d) || this.isLineType(d) ? d.values : [];
 };
+c3_chart_internal_fn.isInterpolationType = function () {
+    return ['linear', 'linear-closed', 'basis', 'basis-open', 'basis-closed', 'bundle', 'cardinal', 'cardinal-open', 'cardinal-closed', 'monotone'].indexOf(this.config.spline_interpolation_type) >= 0;
+};