Take advantage of Chartjs new update function
This commit is contained in:
parent
80664740a8
commit
dc1bc3b4a2
@ -48,7 +48,9 @@ export class HomeComponent implements OnInit {
|
||||
this.keys = temp; // invoke update in rb-multiselect
|
||||
this.initChart();
|
||||
|
||||
this.calcFieldSelectKeys();
|
||||
// only neccesary if keys get preselected
|
||||
//this.calcFieldSelectKeys();
|
||||
|
||||
// fetch all samples populated with according group
|
||||
this.getSamples();
|
||||
}
|
||||
@ -77,8 +79,7 @@ export class HomeComponent implements OnInit {
|
||||
}
|
||||
});
|
||||
}
|
||||
this.myChart.destroy();
|
||||
this.initChart();
|
||||
const datasets = this.updateGraph();
|
||||
}
|
||||
|
||||
// preset select
|
||||
@ -99,7 +100,7 @@ export class HomeComponent implements OnInit {
|
||||
}
|
||||
|
||||
// get data for graph based on active keys
|
||||
async getData() {
|
||||
updateGraph() {
|
||||
let nameList: string[] = [];
|
||||
let dataList: number[] = [];
|
||||
|
||||
@ -109,20 +110,20 @@ export class HomeComponent implements OnInit {
|
||||
dataList.push(key.count);
|
||||
}
|
||||
})
|
||||
return { names: nameList, count: dataList };
|
||||
this.myChart.data.labels = nameList;
|
||||
this.myChart.data.datasets[0].data = dataList;
|
||||
this.myChart.update();
|
||||
}
|
||||
|
||||
// draw graph
|
||||
async initChart() {
|
||||
const data = await this.getData();
|
||||
|
||||
this.myChart = new Chart("myChart", {
|
||||
type: 'bar',
|
||||
data: {
|
||||
labels: data.names,
|
||||
labels: [],
|
||||
datasets: [{
|
||||
label: 'Number of samples per group',
|
||||
data: data.count,
|
||||
data: [],
|
||||
backgroundColor: 'rgba(0, 86, 145, 1)',
|
||||
pointRadius: 4,
|
||||
pointHoverRadius: 7
|
||||
|
Loading…
Reference in New Issue
Block a user