add expand duration config for pie, gauge, and donut charts

c3.js

@@ -1175,22 +1175,25 @@
             pie_label_show: true,
             pie_label_format: undefined,
             pie_label_threshold: 0.05,
-            pie_expand: true,
+            pie_expand: {},
+            pie_expand_duration: 50,
             // gauge
             gauge_label_show: true,
             gauge_label_format: undefined,
-            gauge_expand: true,
             gauge_min: 0,
             gauge_max: 100,
             gauge_units: undefined,
             gauge_width: undefined,
+            gauge_expand: {},
+            gauge_expand_duration: 50,
             // donut
             donut_label_show: true,
             donut_label_format: undefined,
             donut_label_threshold: 0.05,
             donut_width: undefined,
-            donut_expand: true,
             donut_title: "",
+            donut_expand: {},
+            donut_expand_duration: 50,
             // region - region to change style
             regions: [],
             // tooltip - show when mouseover on each data
@@ -4733,9 +4736,9 @@
         $$.svg.selectAll($$.selectorTargets(targetIds, '.' + CLASS.chartArc)).each(function (d) {
             if (! $$.shouldExpand(d.data.id)) { return; }
             $$.d3.select(this).selectAll('path')
-                .transition().duration(50)
+                .transition().duration($$.expandDuration(d.data.id))
                 .attr("d", $$.svgArcExpanded)
-                .transition().duration(100)
+                .transition().duration($$.expandDuration(d.data.id) * 2)
                 .attr("d", $$.svgArcExpandedSub)
                 .each(function (d) {
                     if ($$.isDonutType(d.data)) {
@@ -4753,15 +4756,34 @@
         targetIds = $$.mapToTargetIds(targetIds);
 
         $$.svg.selectAll($$.selectorTargets(targetIds, '.' + CLASS.chartArc)).selectAll('path')
-            .transition().duration(50)
+            .transition().duration(function(d) {
+                return $$.expandDuration(d.data.id);
+            })
             .attr("d", $$.svgArc);
         $$.svg.selectAll('.' + CLASS.arc)
             .style("opacity", 1);
     };
 
+    c3_chart_internal_fn.expandDuration = function (id) {
+        var $$ = this, config = $$.config;
+
+        if ($$.isDonutType(id)) {
+            return config.donut_expand_duration;
+        } else if ($$.isGaugeType(id)) {
+            return config.gauge_expand_duration;
+        } else if ($$.isPieType(id)) {
+            return config.pie_expand_duration;
+        } else {
+            return 50;
+        }
+
+    };
+
     c3_chart_internal_fn.shouldExpand = function (id) {
         var $$ = this, config = $$.config;
-        return ($$.isDonutType(id) && config.donut_expand) || ($$.isGaugeType(id) && config.gauge_expand) || ($$.isPieType(id) && config.pie_expand);
+        return ($$.isDonutType(id) && config.donut_expand) ||
+               ($$.isGaugeType(id) && config.gauge_expand) ||
+               ($$.isPieType(id) && config.pie_expand);
     };
 
     c3_chart_internal_fn.shouldShowArcLabel = function () {

src/arc.js

@@ -143,9 +143,9 @@ c3_chart_internal_fn.expandArc = function (targetIds) {
     $$.svg.selectAll($$.selectorTargets(targetIds, '.' + CLASS.chartArc)).each(function (d) {
         if (! $$.shouldExpand(d.data.id)) { return; }
         $$.d3.select(this).selectAll('path')
-            .transition().duration(50)
+            .transition().duration($$.expandDuration(d.data.id))
             .attr("d", $$.svgArcExpanded)
-            .transition().duration(100)
+            .transition().duration($$.expandDuration(d.data.id) * 2)
             .attr("d", $$.svgArcExpandedSub)
             .each(function (d) {
                 if ($$.isDonutType(d.data)) {
@@ -163,15 +163,34 @@ c3_chart_internal_fn.unexpandArc = function (targetIds) {
     targetIds = $$.mapToTargetIds(targetIds);
 
     $$.svg.selectAll($$.selectorTargets(targetIds, '.' + CLASS.chartArc)).selectAll('path')
-        .transition().duration(50)
+        .transition().duration(function(d) {
+            return $$.expandDuration(d.data.id);
+        })
         .attr("d", $$.svgArc);
     $$.svg.selectAll('.' + CLASS.arc)
         .style("opacity", 1);
 };
 
+c3_chart_internal_fn.expandDuration = function (id) {
+    var $$ = this, config = $$.config;
+
+    if ($$.isDonutType(id)) {
+        return config.donut_expand_duration;
+    } else if ($$.isGaugeType(id)) {
+        return config.gauge_expand_duration;
+    } else if ($$.isPieType(id)) {
+        return config.pie_expand_duration;
+    } else {
+        return 50;
+    }
+
+};
+
 c3_chart_internal_fn.shouldExpand = function (id) {
     var $$ = this, config = $$.config;
-    return ($$.isDonutType(id) && config.donut_expand) || ($$.isGaugeType(id) && config.gauge_expand) || ($$.isPieType(id) && config.pie_expand);
+    return ($$.isDonutType(id) && config.donut_expand) ||
+           ($$.isGaugeType(id) && config.gauge_expand) ||
+           ($$.isPieType(id) && config.pie_expand);
 };
 
 c3_chart_internal_fn.shouldShowArcLabel = function () {

src/config.js

@@ -161,22 +161,25 @@ c3_chart_internal_fn.getDefaultConfig = function () {
         pie_label_show: true,
         pie_label_format: undefined,
         pie_label_threshold: 0.05,
-        pie_expand: true,
+        pie_expand: {},
+        pie_expand_duration: 50,
         // gauge
         gauge_label_show: true,
         gauge_label_format: undefined,
-        gauge_expand: true,
         gauge_min: 0,
         gauge_max: 100,
         gauge_units: undefined,
         gauge_width: undefined,
+        gauge_expand: {},
+        gauge_expand_duration: 50,
         // donut
         donut_label_show: true,
         donut_label_format: undefined,
         donut_label_threshold: 0.05,
         donut_width: undefined,
-        donut_expand: true,
         donut_title: "",
+        donut_expand: {},
+        donut_expand_duration: 50,
         // region - region to change style
         regions: [],
         // tooltip - show when mouseover on each data