Angularjs NVD3折线图不起作用

Question

我是角度Js的新手。我正在尝试根据http get的响应创建一个折线图。

我的http回复：

[{"itemValue":1,"customerListSize":5},{"itemValue":2,"customerListSize":11},{"itemValue"
:66,"customerListSize":1},{"itemValue":3,"customerListSize":6},{"itemValue":4,"customerListSize"
:8},{"itemValue":5,"customerListSize":6},{"itemValue":6,"customerListSize":4},{"itemValue"
:199,"customerListSize":1},{"itemValue":7,"customerListSize":6},{"itemValue":8,"customerListSize"
:2},{"itemValue":9,"customerListSize":2},{"itemValue":10,"customerListSize":2},{"itemValue"
:11,"customerListSize":5},{"itemValue":12,"customerListSize":2},{"itemValue":13,"customerListSize"
:1},{"itemValue":15,"customerListSize":2},{"itemValue":18,"customerListSize":1},{"itemValue"
:19,"customerListSize":1},{"itemValue":275,"customerListSize":1},{"itemValue":84,"customerListSize"
:1},{"itemValue":22,"customerListSize":1},{"itemValue":24,"customerListSize":1},{"itemValue"
:26,"customerListSize":1},{"itemValue":27,"customerListSize":1},{"itemValue":155,"customerListSize"
:1},{"itemValue":31,"customerListSize":3},{"itemValue":33,"customerListSize":1},{"itemValue"
:35,"customerListSize":1},{"itemValue":38,"customerListSize":1},{"itemValue":169,"customerListSize"
:1},{"itemValue":42,"customerListSize":1},{"itemValue":107,"customerListSize":1},{"itemValue"
:48,"customerListSize":1},{"itemValue":53,"customerListSize":1},{"itemValue":61,"customerListSize"
:1}]

My Angular code：

var TestApp = angular.module('TestApp', [
    'TestControllers',
    'TestDirectives',
    'ngAnimate',
    'ngResource',
    'ngCookies',
    'ngRoute',
    'ngTable',
    'ngMaterial',
    'ui.bootstrap',
    'smart-table',
    'n3-line-chart',
    'nvd3ChartDirectives'
]);

var TestControllers = angular.module('TestControllers');

TestControllers.controller('homePageCtrl', ['$scope','$route','$filter', '$http', '$location','$window','$timeout',
    function($scope, $route, $filter, $http, $location, $window, $timeout) {

    $scope.loading = true;
    var lineChart = "line";
    var lineData = {};
    $http.get('/getFeatures.do', {params: {'feature': lineChart}}).success(function (data) {

        angular.forEach(data, function(item) {
            lineData[item.itemValue] = item.customerListSize;
        });
            $scope.loading = false;
    });
    }]);

Html：

<div id="home" ng-controller="homePageCtrl">
<img id="mySpinner" src="../img/progress.gif" ng-show="loading" />
    <nvd3-line-chart data="lineData"
                     id="test"
                     width="550"
                     height="350"
                     showXAxis="true"
                     showYAxis="true">
        <svg></svg>
    </nvd3-line-chart>
</div>

但页面中没有任何内容。我在这里做错了吗？请就此向我提出建议。