rootux / angular-highcharts-directive

An Angular Js Directive which allows to simplify the use of Highcharts charts
MIT License
160 stars 70 forks source link

Added attribute to hide series from outside the chart itself #3

Closed frapontillo closed 11 years ago

frapontillo commented 11 years ago

I have added the attribute hidden-series: it takes an array as input containing the indexes of the series to hide. It defaults to the empty array [], but it can be edited in an external controller in order to hide some series programmaticaly.

For example, you can hide or show all of the series by simply setting all of the indexes in the array:

<chart value="{{lineChart}}" type="line" hidden-series="mHidden"></chart>

In the Controller:

'use strict';

angular.module('chartsExample.controllers',[]).controller('MainCtrl', ['$scope','$http', 
    function($scope,$http) {
        $http.get("charts/lineChart.json").success(function(data) {
                $scope.lineChart = data;
                // Shows all of the series
                $scope.mHidden = [];
        });

        // Hides all of the series
        $scope.hideAll = function() {
            for (var x in $scope.mSeries) {
                $scope.mHidden.push(x);
            }
        };
}]);

Of course, when you deselect a series from within the Highcharts chart, the array is automatically updated as well.