AngularJS Live Example

HTML

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script>
<script src="http://static.fusioncharts.com/code/latest/fusioncharts.js"></script>
<script src="https://static.fusioncharts.com/code/latest/themes/fusioncharts.theme.fint.js?cacheBust=838"></script>
<script src="http://fusioncharts.github.io/angular-fusioncharts/demos/js/angular-fusioncharts.min.js"></script>
<html ng-app="HelloApp">

  <body ng-controller="MyController">

    <fusioncharts id="mychartcontainer" chartid="mychart" width="{{width}}" height="400" type="{{type}}" dataSource="{{dataSource}}"></fusioncharts>


  </body>

</html>

JavaScript

var app = angular.module('HelloApp', ["ng-fusioncharts"])
app.controller('MyController', function($scope) {
      $scope.type = "mscolumn3d";
      $scope.width = 600;
      $scope.dataSource = 
        {
          "chart": {
            "caption": "Sales in Last Two Years",
            "subCaption": "Quarter-wise comparison",
            "xAxisName": "Quarter",
            "yAxisName": "Sales (In USD)",
            "numberPrefix": "$",
            "theme": "fint"
          },

          "categories": [{
            "category": [{
              "label": "Q1"
            }, {
              "label": "Q2"
            }, {
              "label": "Q3"
            }, {
              "label": "Q4"
            }]
          }],
          "dataset": [{
            "seriesname": "Previous Year",
            "data": [{
              "value": "10000"
            }, {
              "value": "11500"
            }, {
              "value": "12500"
            }, {
              "value": "15000"
            }]
          }, {
            "seriesname": "Current Year",
            "data": [{
              "value": "25400"
            }, {
              "value": "29800"
            }, {
              "value": "21800"
            }, {
              "value": "26800"
            }]
          }]
        }
      });