continuing

This commit is contained in:
frankknoll
2023-06-09 17:53:00 +02:00
parent 491f7828f9
commit b348de37ea
2 changed files with 142 additions and 89 deletions

View File

@@ -1,6 +1,7 @@
class BatchCodeTableInitializer {
#batchCodeTableElement;
#barChartDescriptions;
constructor(batchCodeTableElement) {
this.#batchCodeTableElement = batchCodeTableElement;
@@ -8,51 +9,77 @@ class BatchCodeTableInitializer {
initialize() {
const self = this;
this.#batchCodeTableElement.DataTable(
{
ajax: 'data/batchCodeTables/Global.json',
initComplete: function (settings) {
batchCodeTable = settings.oInstance.api();
const columnSearch = new ColumnSearch(batchCodeTable.column(self.#getColumnIndex('Company')));
columnSearch.columnContentUpdated();
},
language:
{
searchPlaceholder: "Enter Batch Code"
},
searching: true,
search:
{
return: true
},
processing: true,
deferRender: true,
order: [[this.#getColumnIndex('Adverse Reaction Reports'), "desc"]],
columnDefs:
[
BarChartDescriptionsProvider
.getBarChartDescriptions()
.then(barChartDescriptions => {
this.#barChartDescriptions = barChartDescriptions;
this.#batchCodeTableElement.DataTable(
{
ajax: 'data/batchCodeTables/Global.json',
initComplete: function (settings) {
batchCodeTable = settings.oInstance.api();
const columnSearch = new ColumnSearch(batchCodeTable.column(self.#getColumnIndex('Company')));
columnSearch.columnContentUpdated();
},
language:
{
searchable: false,
targets: [
this.#getColumnIndex('Adverse Reaction Reports'),
this.#getColumnIndex('Deaths'),
this.#getColumnIndex('Disabilities'),
this.#getColumnIndex('Life Threatening Illnesses'),
this.#getColumnIndex('Severe reports'),
this.#getColumnIndex('Lethality')
searchPlaceholder: "Enter Batch Code"
},
searching: true,
search:
{
return: true
},
processing: true,
deferRender: true,
order: [[this.#getColumnIndex('Adverse Reaction Reports'), "desc"]],
columnDefs:
[
{
searchable: false,
targets: [
this.#getColumnIndex('Adverse Reaction Reports'),
this.#getColumnIndex('Deaths'),
this.#getColumnIndex('Disabilities'),
this.#getColumnIndex('Life Threatening Illnesses'),
this.#getColumnIndex('Severe reports'),
this.#getColumnIndex('Lethality')
]
},
{
orderable: false,
targets:
[
this.#getColumnIndex('Batch'),
this.#getColumnIndex('Company'),
this.#getColumnIndex('Countries')
]
},
{
render: data => {
const numberInPercent = parseFloat(data);
return !isNaN(numberInPercent) ? numberInPercent.toFixed(2) + "%" : '';
},
targets: [this.#getColumnIndex('Severe reports'), this.#getColumnIndex('Lethality')]
},
{
width: "1000px",
render: function (data, type, row, meta) {
return null;
},
createdCell: (cell, cellData, row, rowIndex, colIndex) => {
const batchcode = row[this.#getColumnIndex('Batch')];
if (batchcode in this.#barChartDescriptions) {
const barChartDescription = this.#barChartDescriptions[batchcode];
barChartDescription['batchcode'] = batchcode;
new BatchcodeByCountryBarChartView(cell).displayBatchcodeByCountryBarChart(barChartDescription);
}
},
className: "dt-head-center",
targets: [this.#getColumnIndex('Countries')]
}
]
},
{
orderable: false,
targets: [this.#getColumnIndex('Batch'), this.#getColumnIndex('Company')]
},
{
render: (data, type, row) => {
const numberInPercent = parseFloat(data);
return !isNaN(numberInPercent) ? numberInPercent.toFixed(2) + " %" : '';
},
targets: [this.#getColumnIndex('Severe reports'), this.#getColumnIndex('Lethality')]
}
]
});
});
}
@@ -74,6 +101,8 @@ class BatchCodeTableInitializer {
return 6;
case 'Lethality':
return 7;
case 'Countries':
return 8;
}
}
}

View File

@@ -1,11 +1,12 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<meta content="width=device-width, initial-scale=1.0" name="viewport"/>
<title>Batch Codes of Coronavirus 2019 Vaccines</title>
<!-- Google tag (gtag.js) -->
<!-- FK-FIXME: reactivate
<meta charset="utf-8" />
<meta content="width=device-width, initial-scale=1.0" name="viewport" />
<title>Batch Codes of Coronavirus 2019 Vaccines</title>
<!-- Google tag (gtag.js) -->
<!-- FK-FIXME: reactivate
<script async="" src="https://www.googletagmanager.com/gtag/js?id=G-ERHYDH4P64"></script>
<script>
window.dataLayer = window.dataLayer || [];
@@ -14,55 +15,78 @@
gtag('config', 'G-ERHYDH4P64');
</script> -->
<link href="https://cdn.datatables.net/1.13.1/css/jquery.dataTables.css" rel="stylesheet" type="text/css"/>
<link href="batchCodeTable.css" rel="stylesheet" type="text/css"/>
<link href="forkMeOnGitHub.css" rel="stylesheet" type="text/css"/>
<script crossorigin="anonymous" integrity="sha512-T5Bneq9hePRO8JR0S/0lQ7gdW+ceLThvC80UjwkMRz+8q+4DARVZ4dqKoyENC7FcYresjfJ6ubaOgIE35irf4w==" referrerpolicy="no-referrer" src="https://cdnjs.cloudflare.com/ajax/libs/noUiSlider/15.5.1/nouislider.min.js"></script>
<link crossorigin="anonymous" href="https://cdnjs.cloudflare.com/ajax/libs/noUiSlider/15.5.1/nouislider.css" integrity="sha512-MKxcSu/LDtbIYHBNAWUQwfB3iVoG9xeMCm32QV5hZ/9lFaQZJVaXfz9aFa0IZExWzCpm7OWvp9zq9gVip/nLMg==" referrerpolicy="no-referrer" rel="stylesheet"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script charset="utf8" src="https://cdn.datatables.net/1.13.1/js/jquery.dataTables.min.js" type="text/javascript"></script>
<script src="https://cdn.jsdelivr.net/npm/chart.js@4.2.0/dist/chart.umd.min.js"></script>
<script src="./Utils.js"></script>
<script src="./UIUtils.js"></script>
<script src="./ColumnSearch.js"></script>
<script src="./BatchCodeTableInitializer.js"></script>
<script>
<link href="https://cdn.datatables.net/1.13.1/css/jquery.dataTables.css" rel="stylesheet" type="text/css" />
<link href="batchCodeTable.css" rel="stylesheet" type="text/css" />
<link href="forkMeOnGitHub.css" rel="stylesheet" type="text/css" />
<script crossorigin="anonymous"
integrity="sha512-T5Bneq9hePRO8JR0S/0lQ7gdW+ceLThvC80UjwkMRz+8q+4DARVZ4dqKoyENC7FcYresjfJ6ubaOgIE35irf4w=="
referrerpolicy="no-referrer"
src="https://cdnjs.cloudflare.com/ajax/libs/noUiSlider/15.5.1/nouislider.min.js"></script>
<link crossorigin="anonymous" href="https://cdnjs.cloudflare.com/ajax/libs/noUiSlider/15.5.1/nouislider.css"
integrity="sha512-MKxcSu/LDtbIYHBNAWUQwfB3iVoG9xeMCm32QV5hZ/9lFaQZJVaXfz9aFa0IZExWzCpm7OWvp9zq9gVip/nLMg=="
referrerpolicy="no-referrer" rel="stylesheet" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script charset="utf8" src="https://cdn.datatables.net/1.13.1/js/jquery.dataTables.min.js"
type="text/javascript"></script>
<script src="https://cdn.jsdelivr.net/npm/chart.js@4.2.0/dist/chart.umd.min.js"></script>
<script src="./Utils.js"></script>
<script src="./UIUtils.js"></script>
<script src="./ColumnSearch.js"></script>
<script src="./BatchCodeTableInitializer.js"></script>
<script src="./BarChartDescriptionsProvider.js"></script>
<script src="./BatchcodeByCountryBarChartView.js"></script>
<script src="./BatchcodeByCountryBarChart.js"></script>
<script>
$(document).ready(function () {
const batchCodeTableInitializer = new BatchCodeTableInitializer($('#batchCodeTable'));
batchCodeTableInitializer.initialize();
});
</script>
</head>
<body>
<h1>Batch Codes of Coronavirus 2019 Vaccines</h1>
<table class="display" id="batchCodeTable">
<thead>
<tr>
<th>Batch</th>
<th>Adverse Reaction Reports</th>
<th>Deaths</th>
<th>Disabilities</th>
<th>Life Threatening Illnesses</th>
<th>Company</th>
<th>Severe reports</th>
<th>Lethality</th>
</tr>
</thead>
</table>
<footer>
<dl>
<dt>Data Source:</dt>
<dd><a href="https://vaers.hhs.gov/data/datasets.html" target="_blank">Vaccine Adverse Event Reporting System
<h1>Batch Codes of Coronavirus 2019 Vaccines</h1>
<table class="display" id="batchCodeTable">
<thead>
<tr>
<th>Batch</th>
<th>Adverse Reaction Reports</th>
<th>Deaths</th>
<th>Disabilities</th>
<th>Life Threatening Illnesses</th>
<th>Company</th>
<th>Severe reports</th>
<th>Lethality</th>
<th>Countries</th>
</tr>
</thead>
</table>
<footer>
<dl>
<dt>Data Source:</dt>
<dd><a href="https://vaers.hhs.gov/data/datasets.html" target="_blank">Vaccine Adverse Event Reporting System
(VAERS)</a></dd>
<dt>Last updated:</dt>
<dd id="last_updated">June 02, 2023</dd>
</dl>
<span id="forkongithub"><a href="https://github.com/KnollFrank/HowBadIsMyBatch" target="_blank">Fork me on
<dt>Last updated:</dt>
<dd id="last_updated">June 02, 2023</dd>
</dl>
<span id="forkongithub"><a href="https://github.com/KnollFrank/HowBadIsMyBatch" target="_blank">Fork me on
GitHub</a></span>
<div class="clearfix"></div>
</footer>
<template id="template-canvas">
<canvas></canvas>
</template>
<div class="clearfix"></div>
</footer>
<template id="template-canvas">
<canvas></canvas>
</template>
<template id="template-chartWithSlider">
<div class="chartWithSlider">
<div class="chartContainer">
<canvas class="canvas"></canvas>
</div>
<!-- FK-TODO: remove sliderContainer and slider -->
<div class="sliderContainer">
<div class="slider"></div>
</div>
</div>
</template>
</body>
</html>