Stacked bar chart not rendering correctly and overlays bars

Question

I am trying to draw a stacked bar chart using angular-nvd3, following this example. I use multiBarChart as the chart type. The output looks like this:

The bars are overlaid, whereas the total bar height, as well as the values displayed on mouse over, are correct. The value of each bar corresponds to the number displayed in the label (label_9: three bars with height 9 each, amounts to 27). The orange bar overlays the other bars, instead of starting at value 18.

Here are my chart options:

$scope.options = {
    chart: {
        type: "multiBarChart",
        height: 450,
        margin: {
            top: 20,
            right: 20,
            bottom: 45,
            left: 45
        },
        clipEdge: true,
        duration: 500,
        stacked: true,
        reduceXTicks: false,
        xAxis: {
            "axisLabel": "Time (ms)",
            "showMaxMin": false
        },
        yAxis: {
            "axisLabel": "Y Axis",
            "axisLabelDistance": -20
        }
    }
};

1. Am I missing something, what could be the cause?
2. What would be suitable steps to dig into the issue?

Note: I use text labels instead of numbers. The issue is the same when I use numbers, as in the example. Grouped mode works nicely.

Answer 1

I found the issue and post it here, in case others find it helpful: My values were strings, instead of numbers, i.e. "9" instead of 9.