sangeeta

Hi, I am using the fusion charts angular plugin and retrieving data from the server using AJAX. Are there any examples on how to do this for multiple graphs. I have used static data and it works but having some issues with the dynamic data. I have an array in my scope that stores the chart data from the server and then in the html I use ng-repeat to iterate through this array and pass the data to the fusioncharts directive. Any help is appreciated!!!!

Hi, I am using fusioncharts v 3.11.3 with the Angular plugin. I have been trying to address this issue all day with no luck!!! I have upto 10 graphs on a page and I issues AJAX requests to get the graph data in JSON format. I am using multi-series graphs and the server is sending back the categories and dataset in the response. The chart seems to be rendering fine in Chrome, but the x-axis labels don't show up in firefox. The interesting thing is that the tooltip and showData flag in the category objects are honored in Firefox but no label text is rendered. I think my usage is correct and the versions are all compatible because when I use the data source sample from the Angular fusion charts website - it renders with the x-axis label in firefox. So something is not exactly as expected in the data I am passing to fusion charts or the angular plugin. Here's the code in the HTML file: <div class="col-xs-12 col-sm-6" ng-repeat="ds in dataSource"> <div class="portlet light bordered"> <div class="portlet-title"> <div class="caption font-green"> <span class="caption-subject bold graph-name">{{ds.name}}</span> </div> <div class="portlet-body"> <fusioncharts width="100%" height="500" dataFormat="json" type="{{ds.type}}" dataSource="{{ ds }}"> </fusioncharts> </div> .... Javascript code: $scope.dataSource[idx].chart = response.chart.chart; $scope.dataSource[idx].chart["labelDisplay"] = "rotate"; $scope.dataSource[idx].chart["slantLabels"] = "1"; $scope.dataSource[idx].categories = response.chart.categories; $scope.dataSource[idx].dataset = response.chart.dataset; JSON from Server: {"chart":{ "chart":{"bgAlpha":"0,0","showBorder":"0","animation":"0","showValues":"0","rotateNames":"1","baseFont":"Verdana","baseFontSize":"9","baseFontColor":"474747","divlinecolor":"cccccc","showAlternateHGridColor":"1","alternateHGridColor":"f0f8ff","hoverCapBgColor":"ffffcc","hoverCapBorderColor":"cccccc","numVDivLines":"9","formatNumberScale":"0","vDivlinecolor":"cccccc","showAlternateVGridColor":"1","alternateVGridColor":"e0e8ff"}, "categories":[{"category":[{"label":"08 Jan"},{"label":"09 Jan"},{"label":"10 Jan"},{"label":"11 Jan"},{"label":"12 Jan"},{"label":"13 Jan"},{"label":"14 Jan"},{"label":"15 Jan"},{"label":"16 Jan"},{"label":"17 Jan"},{"label":"18 Jan"},{"label":"19 Jan"},{"label":"20 Jan"},{"label":"21 Jan"},{"label":"22 Jan"},{"label":"23 Jan"},{"label":"24 Jan"},{"label":"25 Jan"},{"label":"26 Jan"},{"label":"27 Jan"},{"label":"28 Jan"},{"label":"29 Jan"},{"label":"30 Jan"},{"label":"31 Jan"},{"label":"01 Feb"},{"label":"02 Feb"},{"label":"03 Feb"},{"label":"04 Feb"},{"label":"05 Feb"},{"label":"06 Feb"},{"label":"07 Feb"}]}], "dataset":[{"seriesName":"Success (Total)","color":"E8141B","data":[{"value":"0"},{"value":"0"},{"value":"0"},{"value":"0"},{"value":"0"},{"value":"0"},{"value":"0"},{"value":"0"},{"value":"0"},{"value":"0"},{"value":"0"},{"value":"0"},{"value":"0"},{"value":"0"},{"value":"0"},{"value":"0"},{"value":"0"},{"value":"0"},{"value":"0"},{"value":"0"},{"value":"0"},{"value":"0"},{"value":"0"},{"value":"0"},{"value":"0"},{"value":"0"},{"value":"0"},{"value":"0"},{"value":"0"},{"value":"0"},{"value":"0"}]},{"seriesName":"Failed (Total)","color":"006FBE","data":[{"value":"0"},{"value":"0"},{"value":"0"},{"value":"0"},{"value":"0"},{"value":"0"},{"value":"0"},{"value":"0"},{"value":"0"},{"value":"0"},{"value":"0"},{"value":"0"},{"value":"0"},{"value":"0"},{"value":"0"},{"value":"0"},{"value":"0"},{"value":"0"},{"value":"0"},{"value":"0"},{"value":"0"},{"value":"0"},{"value":"0"},{"value":"0"},{"value":"0"},{"value":"0"},{"value":"3"},{"value":"0"},{"value":"0"},{"value":"0"},{"value":"3"}]}]}, "chartType":"StackedColumn2D"}} Any help with this issue is appreciated since I've been beating my head all day trying to resolve this issue!