Search code examples
angulartypescriptfusioncharts

How to create onclick event on pie slice of fusion charts


I have integrated the fusion pie chart with below code:

app.component.ts file

const data = {
  chart: {
    caption: "Checkout Programs",
    subcaption: "",
    showvalues: "1",
    showpercentintooltip: "0",
    numberprefix: "Serial:",
    enablemultislicing: "1",
    theme: "fusion"
  },

  data: [ 
{
  "label": "card",
  "value": 1
}, {
  "label": "Currency",
  "value": 2
}, {
  "label": "Holding",
  "value": 3
}, {
  "label": "Payment Network",
  "value": 4
}
 ]
};

and below lines in app.component.html file:

 <fusioncharts
    [width]="width"
    [height]="height"
    [type]="type"
    [dataFormat]="dataFormat"
    [dataSource]="dataSource"
    >
  </fusioncharts>

Image:

enter image description here

Now, I want to run some function if user clicks the pie chart slice (Onclick() event in pie chart slice). and I just want to get the label value inside the method. if user clicks "card" slice in pie chart then the method prints console.log(event); as "cards".

Can anyone help me to achieve this.


Solution

  • Thanks to Theunis for point out an exact solution that I'm looking for.

    Used the same code base that mentioned under entityClick:

    Please refer below link:

    https://www.fusioncharts.com/dev/api/fusioncharts/fusioncharts-events

    Thanks once again.