PHPFixing
  • Privacy Policy
  • TOS
  • Ask Question
  • Contact Us
  • Home
  • PHP
  • Programming
  • SQL Injection
  • Web3.0

Saturday, April 23, 2022

[FIXED] how to create a function that starts at the click event of the pie chart

 April 23, 2022     angular, kendo-chart, kendo-ui, kendo-ui-angular2, pie-chart     No comments   

Issue

how to create a function that starts at the click event of the pie chart?

i would to pass the selected item to a function

<kendo-chart-series>
    <kendo-chart-series-item
           type="pie" [data]="dataSourcePieChart"
           categoryField="cost" field="cost">
           <kendo-chart-series-item-labels
              position="outsideEnd"
              color="#000"
              [content]="labelContent">
           </kendo-chart-series-item-labels>
     </kendo-chart-series-item>
</kendo-chart-series>

enter image description here


Solution

Bind seriesClick event to kendo-chart.

SeriesClickEvent

@Component({
  selector: 'my-app',
  template: `
    <kendo-chart (seriesClick)="seriesClick($event)">
      <kendo-chart-series>
        <kendo-chart-series-item  
            type="donut" [data]="data"
            categoryField="kind" field="share">
          <kendo-chart-series-item-labels
            [content]="labelContent"
            
            color="#fff" background="none">
          </kendo-chart-series-item-labels>
        </kendo-chart-series-item>
      </kendo-chart-series>
      <kendo-chart-legend [visible]="false"></kendo-chart-legend>
    </kendo-chart>
  `
})
export class AppComponent {
  public data: any[] = [{
    kind: 'Hydroelectric', share: 0.175
  }, {
    kind: 'Nuclear', share: 0.238
  }, {
    kind: 'Coal', share: 0.118
  }, {
    kind: 'Solar', share: 0.052
  }, {
    kind: 'Wind', share: 0.225
  }, {
    kind: 'Other', share: 0.192
  }];

  public labelContent(e: any): string {
    return e.category;
  }
  
  public seriesClick(e: any): void {
      console.log(e.category)
  }
}

Example: seriesClick



Answered By - dev_in_progress
Answer Checked By - Marie Seifert (PHPFixing Admin)
  • Share This:  
  •  Facebook
  •  Twitter
  •  Stumble
  •  Digg
Newer Post Older Post Home

0 Comments:

Post a Comment

Note: Only a member of this blog may post a comment.

Total Pageviews

Featured Post

Why Learn PHP Programming

Why Learn PHP Programming A widely-used open source scripting language PHP is one of the most popular programming languages in the world. It...

Subscribe To

Posts
Atom
Posts
Comments
Atom
Comments

Copyright © PHPFixing