I have a few google-donutpie charts on my page which initialized dynamically. I can with help of "on-select" to know whict slice was clicked.
But I need to make selection of slice from code. How to do it?
PS: I don't use google.visualization and want skip using this way
package.json : "angular-google-charts": "^0.1.6"
HTML
<google-chart
id="chart_{{ i }}"
on-select="company.selectChartHandler($event)"
(click)="($event.target)"
[title]="company.chart.title"
[type]="company.chart.type"
[data]="company.chart.data"
[columnNames]="company.chart.columnNames"
[options]="company.chart.options"
[width]="company.chart.width"
[height]="company.chart.height"
>
</google-chart>
TypeScript
export class CompanyRecord {
chart;
selectChartHandler(selectedItem) {
let selectedItemIndex;
if (selectedItem[0]) {
selectedItemIndex = selectedItem[0].row;
}
}
private _configureChart() {
this.isShowChart = true;
this.colors = this._googleChartsService.getColorPalette();
const chartsSlicesColorPalette = this._googleChartsService.getColoredSlicesConfig(this.colors);
this.chart = new Object({
title: '',
type: 'PieChart',
data: this.PercentageData,
columnNames: ['Data1', 'Value'],
options: {
pieHole: 0.6,
tooltip: { trigger: 'none' },
legend: 'none',
slices: chartsSlicesColorPalette,
pieSliceText: 'none',
chartArea: {
width: '100%',
height: '90%'
}
},
width: 300,
height: 300
});
}
}