diff --git a/examples/stackedAreaChart.html b/examples/stackedAreaChart.html index 59ecf3e..e1dd192 100644 --- a/examples/stackedAreaChart.html +++ b/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); diff --git a/src/models/stackedArea.js b/src/models/stackedArea.js index c7406f0..9dc93ed 100644 --- a/src/models/stackedArea.js +++ b/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; - }; //============================================================ diff --git a/src/models/stackedAreaChart.js b/src/models/stackedAreaChart.js index 4e48243..3bbf6c7 100644 --- a/src/models/stackedAreaChart.js +++ b/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; };