how to stack series in nvd3 multibar angularjs directive

Question

i want to create a multiple bar chart with nvd3 angularjs directive by cmaurer (nvd3 directive link) but the problem is that i need to stack some series and there is a strange bug. here is my data:

 $scope.exampleData = [
                {
                    "key": "Monto Inicial",
                    "values": [[0, $scope.planAhorro.MontoInicial]]
                }, {
                    "key": "Monto Periodico",
                    "values": [[0, $scope.planAhorro.MontoPeriodico]]
                }, {
                    "key": "Total Sueños",
                    "values": [[1, $scope.planAhorro.Valor]]
                }];

i want to get 2 bars with the values of $scope.planAhorro.MontoInicial and $scope.planAhorro.MontoPeriodico stacked, and the another bar with the value $scope.planAhorro.Valor alone, but the thing is the first 2 stack well and the third stack on top and i don't need it to stack!!

and here is the output:

http://es.tinypic.com/r/2yvjnkw/8

Answer 1

Suppose you need to set up values for all range, in you case: for 0 and 1:

$scope.exampleData = [
            {
                "key": "Monto Inicial",
                "values": [[0, $scope.planAhorro.MontoInicial], [1, 0]],
                "color": "red" 
            }, {
                "key": "Monto Periodico",
                "values": [[0, $scope.planAhorro.MontoPeriodico], [1, 0]],
                "color": "green"
            }, {
                "key": "Total Sueños",
                "values": [[0, ], [1, $scope.planAhorro.Valor]],
                "color": "#0000FF" //blue
            }];

Here is a demo, but I use angular-nvd3 directive instead.