events is not working in angularjs fusion charts

问题

I am trying to capture dataplotClick event in pie2d chart of fusion charts using angular. I'm referring this example Bar chart with events. When I create object events directly to the scope then it's working.

Working

$scope.events = {
                        dataplotClick:function(evnt,data) {
                            var lbl = data.toolText.split(",")[0];
                            console.log(lbl);
                            $scope.$apply(function() {
                                $scope.stFilter = {'EV_STATE_NUMBER':lbl};
                            });
                        }
                    }

Not working

$scope.my = {};
$scope.my.events = {
                    dataplotClick:function(evnt,data) {
                        var lbl = data.toolText.split(",")[0];
                        console.log(lbl);
                        $scope.$apply(function() {
                            $scope.stFilter = {'EV_STATE_NUMBER':lbl};
                        });
                    }
                }

HTML

<fusioncharts 
      width="90%" 
      height="100%"
      type="pie2d"
      datasource="{{fcb.effiPerformance}}"
      events="my.events" // Not working
      events="events" // Working
> </fusioncharts>

As I have more than one charts inside ng-repeat, I have to attach event function for each of them. Help me if anyone knows how to achieve it.

回答1:

The FusionCharts angular plugin can access only the direct child objects inside the controller scope. Refer to the following code at line 346 of the source code from https://github.com/fusioncharts/angular-fusioncharts/blob/master/src/angular-fusioncharts.js.

if (scope.$parent[attrs.events]) {

To define different events for different charts inside same controller you can define different event object names. e.g.-

//Controller
$scope.chart1_events = {
      dataplotClick:function(evnt,data) {
          var lbl = data.toolText.split(",")[0];
          console.log(lbl);
          $scope.$apply(function() {
              $scope.stFilter = {'EV_STATE_NUMBER':lbl};
          });
      }
}

//HTML
<fusioncharts 
  width="90%" 
  height="100%"
  type="pie2d"
  datasource="{{fcb.effiPerformance}}"
  events="chart1_events"
> </fusioncharts>

Sample- http://jsfiddle.net/ayanonly1/57gxf5e1/

Update:- The issue is fixed in V3.0 of the plugin.

来源：https://stackoverflow.com/questions/30235942/events-is-not-working-in-angularjs-fusion-charts

标签

javascript

angularjs

fusioncharts