80 lines
2.5 KiB
JavaScript
80 lines
2.5 KiB
JavaScript
class HistogramTable {
|
|
|
|
#tableElement;
|
|
#table;
|
|
#sumFrequencies;
|
|
|
|
constructor(tableElement) {
|
|
this.#tableElement = tableElement;
|
|
}
|
|
|
|
initialize() {
|
|
this.#table = this.#createEmptyTable();
|
|
}
|
|
|
|
display(frequencyBySymptom) {
|
|
const symptom_frequency_pairs = Object.entries(frequencyBySymptom);
|
|
this.#setTableRows(symptom_frequency_pairs);
|
|
}
|
|
|
|
#createEmptyTable() {
|
|
return this.#tableElement.DataTable(
|
|
{
|
|
language:
|
|
{
|
|
searchPlaceholder: "Enter Symptom"
|
|
},
|
|
search:
|
|
{
|
|
return: false
|
|
},
|
|
processing: true,
|
|
deferRender: true,
|
|
order: [[this.#getColumnIndex('Frequency'), "desc"]],
|
|
columnDefs:
|
|
[
|
|
{
|
|
searchable: true,
|
|
targets: [
|
|
this.#getColumnIndex('Symptom')
|
|
]
|
|
},
|
|
{
|
|
render: (data, type, row, meta) => {
|
|
// FK-TODO: refactor
|
|
const numberWithBar = UIUtils.instantiateTemplate('template-number-with-bar');
|
|
const bar = numberWithBar.querySelector('.bar');
|
|
bar.style.width = (data / this.#sumFrequencies * 100).toString() + "%";
|
|
const number = numberWithBar.querySelector('.number');
|
|
number.textContent = data;
|
|
return numberWithBar.outerHTML;
|
|
},
|
|
targets: [this.#getColumnIndex('Frequency')]
|
|
}
|
|
]
|
|
});
|
|
}
|
|
|
|
#getColumnIndex(columnName) {
|
|
switch (columnName) {
|
|
case 'Symptom':
|
|
return 0;
|
|
case 'Frequency':
|
|
return 1;
|
|
}
|
|
}
|
|
|
|
#setTableRows(symptom_frequency_pairs) {
|
|
this.#sumFrequencies = this.#getSumFrequencies(symptom_frequency_pairs);
|
|
this.#table
|
|
.clear()
|
|
.rows.add(symptom_frequency_pairs)
|
|
.draw();
|
|
}
|
|
|
|
#getSumFrequencies(symptom_frequency_pairs) {
|
|
const frequencies = symptom_frequency_pairs.map(symptom_frequency_pair => symptom_frequency_pair[1])
|
|
return Utils.sum(frequencies);
|
|
}
|
|
}
|