In my Angular application, I am attempting to capture the dataplotClick event in a pie2d chart of Fusion Charts. I came across an example of a bar chart with events here. When I directly create the events object within the main scope, everything works as expected.
When it works:
$scope.events = {
dataplotClick:function(evnt,data) {
var lbl = data.toolText.split(",")[0];
console.log(lbl);
$scope.$apply(function() {
$scope.stFilter = {'EV_STATE_NUMBER':lbl};
});
}
}
When it doesn't work:
$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 Markup:
<fusioncharts
width="90%"
height="100%"
type="pie2d"
datasource="{{fcb.effiPerformance}}"
events="my.events" // Does not work
events="events" // Works fine
> </fusioncharts>
Since I have multiple charts within an ng-repeat, I need to attach event functions to each of them. Can anyone provide guidance on how to achieve this?