Javascript angularjs nvd3指令显示半饼图

您好，我正在尝试使用创建一个饼图，但我的图表被除以一半，我不明白为什么我要设置宽度和高度，下面是我的代码：

html:

谢谢你的时间

编辑->新代码：

              <nvd3-pie-chart
                        data="exampleData"
                        id="exampleId"
                        width="500"
                        x="xFunction()"
                        y="yFunction()"
                        showlegend="true"
                        tooltips="true"
                        showlabels="true"
                        labeltype="percent">
                        <svg  width="1000" height="350"></svg>
             </nvd3-pie-chart>

我找到了这个plunker，但我不明白为什么宽度和高度不能均匀缩放图表。我想这是因为指令的目标是创建圆，而不是省略号，所以它得到宽度和高度的较低值，并使用它来计算直径。我解决了它！！！！nvd3饼图宽度管理图表所在的背景的宽度，我认为是乘以2，svg管理饼图的大小，但您必须包括图例空间，我的代码现在是这样的（请参见编辑）

$scope.exampleData = [{
            key: "5 Stars",
            y: 25
        }, {
            key: "4 Stars",
            y: 32
        }, {
            key: "3 Stars",
            y: 99
        }, {
            key: "2 Stars",
            y: 120
        }, {
            key: "1 Stars",
            y: 64
        }];

        $scope.xFunction = function () {
            return function (d) {
                return d.key;
            };
        };

        $scope.yFunction = function () {
            return function (d) {
                return d.y;
            };
        };

              <nvd3-pie-chart
                        data="exampleData"
                        id="exampleId"
                        width="500"
                        x="xFunction()"
                        y="yFunction()"
                        showlegend="true"
                        tooltips="true"
                        showlabels="true"
                        labeltype="percent">
                        <svg  width="1000" height="350"></svg>
             </nvd3-pie-chart>