设置Kendo角饼图的类别轴标签标题

时间:2018-08-07 10:09:55

标签: angular kendo-ui kendo-ui-angular2

我是Kendo UI的新手,正在尝试实现饼图。我无法为图表设置类别“轴标签”标题。我不确定这是否适用于饼图。

代码输入法:https://plnkr.co/edit/9WGlMwwvbqaFFytoP2Do?p=preview

我尝试了一些解决方法,但似乎没有帮助。任何帮助将不胜感激。预先感谢。

app.component.ts --- *

import { Component } from '@angular/core';
import { AxisLabelsPosition } from '@progress/kendo-angular-charts';

@Component({
  selector: 'my-app',
  template: `
    <kendo-chart [seriesColors]="['orange', 'red']">
      <kendo-chart-legend position="bottom"></kendo-chart-legend>
      <kendo-chart-title position="top" text="Pie Chart Title \n testing "></kendo-chart-title>

      <kendo-chart-series>
        <kendo-chart-series-item type="pie" [data]="pieData" field="value"
          categoryField="category"  [title]="{text:'testing'}" text = "testing gjkdfgjkhd">
        </kendo-chart-series-item>
      </kendo-chart-series>




      <kendo-chart-category-axis [title]="{'text':'testingLabe'}">
            <kendo-chart-category-axis-item >
                <kendo-chart-category-axis-item-labels rotation="auto"> 
                </kendo-chart-category-axis-item-labels>
            </kendo-chart-category-axis-item>

        </kendo-chart-category-axis>

        <kendo-chart-value-axis>
            <kendo-chart-value-axis-item  [axisCrossingValue]="[0, -1000]">
                <kendo-chart-value-axis-item-labels>
                </kendo-chart-value-axis-item-labels>
            </kendo-chart-value-axis-item>
        </kendo-chart-value-axis>

        // <kendo-chart-value-axis>
        //   <kendo-chart-value-axis-item >
        //       <kendo-chart-value-axis-item-labels [content]="ReturningString">
        //     </kendo-chart-value-axis-item-labels>
        //   </kendo-chart-value-axis-item>
        // </kendo-chart-value-axis>


    </kendo-chart>
  `
})
export export class AppComponent {
   public categoryLabelsPosition: AxisLabelsPosition = 'onAxis';
   public valueLabelsPosition: AxisLabelsPosition = 'start';
  public pieData: any = [
    { category: 'Eaten', value: 0.42 },
    { category: 'Not eaten', value: 0.58 }
  ]

  ReturningString(e){
    console.log(e);
    return 'testinglabeld'
  }
}

0 个答案:

没有答案