홈>

angular - kendo-chart-series의 kendo-chart-series-item-label에 템플릿을 추가하는 방법은 무엇입니까?

kendo-chart-series-item-labels에 템플릿을 추가하려고합니다. 이 링크에서 비슷한 예를 사용했습니다 : https://plnkr.co/edit/eICeHxnl0JoIwuRYyRSt?p = 미리보기

이 방법을 사용하는 대신 app.components.ts 파일에서 :

public labelContent(e: any): string {
        return `${ e.category }: \n ${e.value}%`;
    }

요소 자체에 템플릿을 가질 수 있습니까? 예 :

<kendo-chart-series-item-labels
                                  color="gray"
                                  position="outsideEnd"
                                  template="#= category # - #= kendo.format('{0:P}', percentage)#"
                                  align="column"
                                  background="none">

이 템플릿이 작동하지 않습니다. 제 질문은 템플릿을 작성하여 값을 표시하는 방법입니다.

감사합니다!

angularkendo-ui
  • 답변 # 1

    현재 kendo-chart-series-item-labels 내에서 템플릿을 직접 설정할 수있는 방법이 없습니다  요소. 그러나 사용할 수있는 3 가지 대안이 있습니다.

    옵션 A-형식 문자열

    표시된 숫자의 형식 만 '만'원하는 경우 format 를 활용할 수 있습니다  입력은 모든 종류의 숫자 형식에 적용됩니다.

    <kendo-chart-series-item-labels [format]="'n2'">
</kendo-chart-series-item-labels>

    옵션 B-콘텐츠 콜백

    이것은 당신이 연결 한 예제에서 이미 한 것입니다. 기본적으로 당신은 function 를 제공  라벨의 모양을 지정합니다.

    <kendo-chart-series-item-labels [content]="contentString">
</kendo-chart-series-item-labels>
public contentString(content) {
    // return the formatted label as a string
}

    옵션 C-시각적 콘텐츠 콜백

    옵션 B와 매우 유사하지만 표시해야 할 문자열을 반환하는 대신 kendo-drawing 를 반환합니다.  요소.

    <kendo-chart-series-item-labels [visual]="contentVisual">
</kendo-chart-series-item-labels>
public contentVisual(content: SeriesLabelsVisualArgs) {
    // return the formatted label as a kendo-drawing-element
}

    그 옵션에 대한 자세한 설명은 해당 웹 사이트에서 찾을 수 있습니다.

  • 이전 단일 Spring 앱에서 여러 인증 프롬프트
  • 다음 php - 600MP 이미지를 효율적으로 샘플링하는 방법
    • 관련 질문