Okay, so I have finally figured this out. When you are using a directive like nvd3-line-plus-bar-chart
in AngularJS, you need to watch for changes in height, because the angular-nvd3-directive does not do this automatically, at least for the height parameter.
This little piece of code in the nvd3LinePlusBarChart
directive did it for me:
scope.$watch('height',function(height) {
if (height) {
if (scope.chart) {
return scope.d3Call(scope.data, scope.chart);
}
}
});
That's it! And in my own directive, I just update the height on event call like so:
scope.$on('someEvent', function() {
scope.$apply(function(){
scope.height = height;
})
});
}
Hope this helps everyone else who is struggling!