0

谁能帮我制作kendoui angular2的图表组件

作为甜甜圈图

我可以按照本页http://www.telerik.com/kendo-angular-ui/components/charts/中的示例来 gt 图表，但如何将其制作为圆环图

谢谢&Rds，Raghu S

4

3 回答 3

2

这是甜甜圈图的示例模板

    <kendo-chart>
      <kendo-chart-title text="Donut Chart"></kendo-chart-title>
      <kendo-chart-series-defaults type="donut">
      </kendo-chart-series-defaults>
      <kendo-chart-series>
        <kendo-chart-series-item [data]="seriesData">
        </kendo-chart-series-item>
      </kendo-chart-series>
    </kendo-chart>

你可以在这个 Plunker 中测试它：

http://plnkr.co/edit/nvOfXk7VGhOl2f4esCfL?p=preview

于 2016-10-05T13:52:02.643 回答
1

添加type="donut"与您的kendo-chart-series-item标签。

于 2016-10-17T11:00:41.917 回答
1 
@Component({
    selector: 'my-app',
    template: `
        <kendo-chart>
          <kendo-chart-title text="Simple Donut Chart">
          </kendo-chart-title>
          <kendo-chart-series-defaults type="donut">
          </kendo-chart-series-defaults>
          <kendo-chart-legend position="top">
          </kendo-chart-legend>
          <kendo-chart-series>
            <kendo-chart-series-item [data]="seriesData">
            </kendo-chart-series-item>
          </kendo-chart-series>
        </kendo-chart>
    `
})
class AppComponent {
    private seriesData = [[4,"1st"],[7,"2nd"],[5,"3rd"]];
}

Plunker 链接：http ://plnkr.co/edit/86dA5xCCSxatBOmapnGo?p=preview

于 2016-10-13T17:10:49.527 回答