Fixed stackedArea chart transitionDuration.

examples/stackedAreaChart.html

@@ -199,7 +199,7 @@ nv.addGraph(function() {
                 .x(function(d) { return d[0] })
                 .y(function(d) { return d[1] })
                 .color(keyColor)
-                .transitionDuration(250);
+                .transitionDuration(300);
                 //.clipEdge(true);
 
 // chart.stacked.scatter.clipVoronoi(false);
@@ -212,7 +212,8 @@ nv.addGraph(function() {
 
   d3.select('#chart1')
     .datum(histcatexplong)
-      .transition().duration(0).call(chart);
+    .transition().duration(0)
+    .call(chart);
 
   nv.utils.windowResize(chart.update);
 
@@ -237,8 +238,6 @@ nv.addGraph(function() {
 
   d3.select('#chart2')
     .datum(histcatexpshort)
-    .transition().duration(0)
-      //.transition().duration(500)
       .call(chart);
 
   nv.utils.windowResize(chart.update);

src/models/stackedArea.js

@@ -21,7 +21,6 @@ nv.models.stackedArea = function() {
     , y //can be accessed via chart.yScale()
     , scatter = nv.models.scatter()
     , dispatch =  d3.dispatch('tooltipShow', 'tooltipHide', 'areaClick', 'areaMouseover', 'areaMouseout')
-    , transitionDuration = 500  //allow users to override stacked area transition duration.
     ;
 
   scatter
@@ -121,13 +120,8 @@ nv.models.stackedArea = function() {
       var scatterWrap = g.select('.nv-scatterWrap')
           .datum(data);
 
-      //d3.transition(scatterWrap).call(scatter);
       scatterWrap.call(scatter);
 
-
-
-
-
       defsEnter.append('clipPath')
           .attr('id', 'nv-edge-clip-' + id)
         .append('rect');
@@ -188,7 +182,7 @@ nv.models.stackedArea = function() {
               seriesIndex: i
             });
           })
-      path.exit().transition().duration(transitionDuration)
+      path.exit().transition()
           .attr('d', function(d,i) { return zeroArea(d.values,i) })
           .remove();
       path
@@ -196,7 +190,7 @@ nv.models.stackedArea = function() {
             return d.color || color(d, d.seriesIndex) 
           })
           .style('stroke', function(d,i){ return d.color || color(d, d.seriesIndex) });
-      path.transition().duration(transitionDuration)
+      path.transition()
           .attr('d', function(d,i) { 
             return area(d.values,i) 
           });
@@ -340,12 +334,6 @@ nv.models.stackedArea = function() {
 	    interpolate = _;
 	    return chart;
   };
-  
-  chart.transitionDuration = function(_) {
-      if (!arguments.length) return transitionDuration;
-      transitionDuration = _;
-      return chart;
-  };
   //============================================================
 
 

src/models/stackedAreaChart.js

@@ -37,6 +37,7 @@ nv.models.stackedAreaChart = function() {
     , dispatch = d3.dispatch('tooltipShow', 'tooltipHide', 'stateChange', 'changeState')
     , controlWidth = 250
     , cData = ['Stacked','Stream','Expanded']
+    , transitionDuration = 250
     ;
 
   xAxis
@@ -78,7 +79,7 @@ nv.models.stackedAreaChart = function() {
           availableHeight = (height || parseInt(container.style('height')) || 400)
                              - margin.top - margin.bottom;
 
-      chart.update = function() { container.transition().call(chart); };
+      chart.update = function() { container.transition().duration(transitionDuration).call(chart); };
       chart.container = this;
 
       //set state.disabled
@@ -237,7 +238,7 @@ nv.models.stackedAreaChart = function() {
       var stackedWrap = g.select('.nv-stackedWrap')
           .datum(data);
 
-      stackedWrap.call(stacked);
+      stackedWrap.transition().call(stacked);
 
       //------------------------------------------------------------
 
@@ -293,7 +294,6 @@ nv.models.stackedAreaChart = function() {
         state.disabled = data.map(function(d) { return !!d.disabled });
         dispatch.stateChange(state);
 
-        //selection.transition().call(chart);
         chart.update();
       });
 
@@ -558,10 +558,8 @@ nv.models.stackedAreaChart = function() {
   };
 
   chart.transitionDuration = function(_) {
-    if (!arguments.length) return stacked.transitionDuration();
-    stacked.transitionDuration(_);
-    xAxis.transitionDuration(_);
-    yAxis.transitionDuration(_);
+    if (!arguments.length) return transitionDuration;
+    transitionDuration = _;
     return chart;
   };