How rise a legend click event programmatically?

[lucas]

Hello everyone!

I am using in a project the kendo-chart donut component and I would like to rise the same click event programmatically in a legend as a filter. Is it possible to do in a .TS file? 

In the image is possible to see the donut with legend that I use like a filter. I have the same legends description in a combobox and when my costumers change the combobox, it should change the donut here.  

[Hetali]

Hello Lucas,

In order to perform the Kendo UI Donut Chart's legend click function from the Kendo UI ComboBox selection, use the togglePointVisibility method in the valueChange event of the ComboBox. For example:

<kendo-chart>
  <kendo-chart-series>
    <kendo-chart-series-item
      #chartSeries
      type="donut"
      [data]="data"
    >
    </kendo-chart-series-item>
  </kendo-chart-series>
</kendo-chart>

<p>Toggle Series Item:</p>
<kendo-combobox [data]="kind" (valueChange)="valueChange($event)">
</kendo-combobox>

@ViewChild('chartSeries') public chartSeries;
public toggledIndex;

public valueChange(e) {
  if (e) {
    this.chartSeries.data.forEach((item, index) => {
      if (item.kind === e) {
        this.toggledIndex = index;
        this.chartSeries.togglePointVisibility(index);
      }
    });
  } else {
    if (this.toggledIndex !== null) {
      this.chartSeries.togglePointVisibility(this.toggledIndex);
      this.toggledIndex = null;
    }
  }
}

In this StackBlitz example, the Kendo UI Donut Chart Series Item toggles on both the legend click and the Kendo UI ComboBox Selection.

I hope this helps. Please let me know if I can further assist you.

Regards,
Hetali
Progress Telerik