Ошибка: недопустимое значение для <path> attribute d = ".. для круговой диаграммы

Я создаю диаграмму пончиков в d3.js и AngularJS. У меня есть функция drawGraph функции директивной ссылки. Данные представляют собой массив объектов и поступают с сервера. Вот как выглядит функция.

Функция:

scope.drawGraph = function(data){
            console.log(data);
            var width = 560,
                height = 400,
                radius = Math.min(width, height) / 2.6,
                legendRectSize = 18,
                legendSpacing = 4; 

            var color = d3.scale.category20();

            var pie = d3.layout.pie()
                        .value(function(d) { return d.amount; })
                        .sort(null);

            var arc = d3.svg.arc()
                        .innerRadius(radius - 90)
                        .outerRadius(radius - 70);

            var svg = d3.select("#chart").append("svg")
                        .attr("width", width)
                        .attr("height", height)
                        .append("g")
                        .attr("transform", "translate(" + width / 2 + "," + height / 2 + ")");

            var path = svg.selectAll("path")
                        .data(pie(data))
                        .enter().append("path")
                        .attr("fill", function(d, i) {return color(i); })
                        .attr("d", arc);

            var ticks = svg.selectAll("line").data(pie(data)).enter().append("line");
                        ticks.attr("x1", 0)
                        .attr("x2", 0)
                        .attr("y1", -radius+10)
                        .attr("y2", -radius+70)
                        .attr("stroke", "gray")
                        .attr("transform", function(d) {
                          return "rotate(" + (d.startAngle+d.endAngle)/2 * (180/Math.PI) + ")";
                        });

            var labels = svg.selectAll("text").data(pie(data)).enter().append("text");
                        labels.attr("class", "value")
                       .attr("transform", function(d) {
                           var dist=radius+5;
                           var winkel=(d.startAngle+d.endAngle)/2;
                           var x=dist*Math.sin(winkel);
                           var y=-dist*Math.cos(winkel);
                           return "translate(" + x + "," + y + ")";
                        })
                        .attr("dy", "0.35em")
                        .attr("text-anchor", "middle")
                        .style('fill', 'rgba(0, 0, 0, 0.498039)')
                        .text(function(d){
                            return d.data.category;
                        });
        };

scope.drawGraph(scope.data); // Function call

scope.data:

[{amount: 100, category: 'food'},{amount: 150, category: 'fuel'}, {amount: 50, category: 'grocery'},{amount: 250, category: 'Entertainment'}]

Вот что возвращает консоль:

Ошибка: недопустимое значение для атрибута d = "M5.134096196425442e-15, -83.84615384615384A83.84615384615384,883.84615384615384 0 1,1 NaN, NaNLNaN, NaNA63.84615384615384,63.84615384615384 0 1,0 3,909449397278089e-15, -63. 84615384615384Z"

А также:

Ошибка: недопустимое значение для атрибута d = "MNaN, NaNA83.84615384615384,83.84615384615384 0 1,1 NaN, NaNLNaN, NaNA63.84615384615384,63.84615384615384 0 1,0 NaN, NaNZ"

Ошибка: недопустимое значение для атрибута transform = "rotate (NaN)"

Ошибка: недопустимое значение для атрибута transform = "translate (NaN, NaN)"

Я относительно новичок в d3.js.

Заранее спасибо.