krispo / angular-nvd3

AngularJS directive for NVD3 reusable charting library (based on D3). Easily customize your charts via JSON API.

Home Page:http://krispo.github.io/angular-nvd3

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

multiBarHorizontalChart not reading stacked option properly

inolasco opened this issue · comments

It seems angular-nvd3 is treating the stacked parameter as an object instead of a boolean as it should be. So charts which had stacked: true are not correctly set as stacked.

Removing 'stacked' from :

                            else if ([
                                ....
                                'stack2',
                                'stacked',
                                'multibar',
                                ...
                            ].indexOf(key) >= 0){
                                if (options.chart[key] === undefined || options.chart[key] === null) {
                                    if (scope._config.extended) options.chart[key] = {};
                                }
                                configure(scope.chart[key], options.chart[key], options.chart.type);
                            }

Seems to fix it

This issue may apply to other bar chart variants as well

This affects also multiBarChart. Fix described by @inolasco seems to also fix multiBarChart.

I am using angular-nvd3 1.0.0-beta.

I think this configuration was meant for overriding dispatch events for the stackedAreaChart:

$scope.options = {
  chart: {
    type: 'stackedAreaChart',
    ...
    stacked: {
      dispatch: {
        areaClick: function(event) {
          ...
        }
      }
    }
  }
}

But this creates a conflict for the stacked option of other charts.
Unfortunate naming convention by the NVD3 library. The fix by @inolasco works if you don't need to listen to stackedAreaChart events.

Indeed @allienx , you are correct. I figured stacked was probably used for something else as well, just didn't know what that 'else' was, which you've cleared up. So a better, real fix is needed, mine is just a temporary fix.

Is there a permanent fix for this implemented yet?
If not, I can create a pull request based on the solution shown in the following code. I'm just adding a case handler for 'stackedAreaChart' model's stacked event (assuming stacked event gets only generated from the StackedAreaChart and 'stacked' property is used as an option on the other models).

else if ([
    'lines',
    'lines1',
    'lines2',
    'bars',
    'bars1',
    'bars2',
    'stack1',
    'stack2',
    'stacked',
    'multibar',
    'discretebar',
    'pie',
    'scatter',
    'bullet',
    'sparkline',
    'legend',
    'distX',
    'distY',
    'xAxis',
    'x2Axis',
    'yAxis',
    'yAxis1',
    'yAxis2',
    'y1Axis',
    'y2Axis',
    'y3Axis',
    'y4Axis',
    'interactiveLayer',
    'controls'
].indexOf(key) >= 0){
    // special case handler for stackedAreaChart model's stacked event
    // stacked is an option on the other models
    if (key === 'stacked' && options.chart.type !== 'stackedAreaChart') {
        scope.chart[key](options.chart[key]);
    } 
    else {
        if (options.chart[key] === undefined || options.chart[key] === null) {
            if (scope._config.extended) {
                options.chart[key] = {};
            }
        }
        configure(scope.chart[key], options.chart[key], options.chart.type);
    }
}

Fixed, thanks everyone!