using gentella dashboard

This commit is contained in:
frankknoll
2023-04-16 21:26:00 +02:00
parent ec98862dc4
commit a1987f6331
5 changed files with 50343 additions and 49879 deletions

View File

@@ -44,7 +44,7 @@ class AdverseReactionReportsChartView {
ADRDescr['Life Threatening Illnesses'],
ADRDescr['Adverse Reaction Reports'] - (ADRDescr['Deaths'] + ADRDescr['Disabilities'] + ADRDescr['Life Threatening Illnesses'])
],
hoverOffset: 4
backgroundColor: '#1a73e8'
}]
};
}

View File

@@ -32,7 +32,8 @@ class HistogramChartView {
labels: symptoms,
datasets: [{
label: histoDescr.batchcode,
data: frequencies
data: frequencies,
backgroundColor: '#1a73e8'
}]
};
}

View File

@@ -2,7 +2,10 @@
<html>
<head>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
<!-- Meta, title, CSS, favicons, etc. -->
<meta charset="utf-8" />
<meta content="IE=edge" http-equiv="X-UA-Compatible" />
<meta content="width=device-width, initial-scale=1.0" name="viewport" />
<title>Batch Codes of Coronavirus 2019 Vaccines</title>
<!-- Google tag (gtag.js) -->
@@ -15,7 +18,12 @@
gtag('config', 'G-ERHYDH4P64');
</script> -->
<link href="batchCodeTable.css" rel="stylesheet" type="text/css" />
<!-- Bootstrap -->
<link href="gentelella/vendors/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet" />
<!-- Font Awesome -->
<link href="gentelella/vendors/font-awesome/css/font-awesome.min.css" rel="stylesheet" />
<!-- Custom Theme Style -->
<link href="gentelella/build/css/custom.css" rel="stylesheet" />
<link href="forkMeOnGitHub.css" rel="stylesheet" type="text/css" />
<script crossorigin="anonymous"
integrity="sha512-T5Bneq9hePRO8JR0S/0lQ7gdW+ceLThvC80UjwkMRz+8q+4DARVZ4dqKoyENC7FcYresjfJ6ubaOgIE35irf4w=="
@@ -24,10 +32,6 @@
<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>
<link href="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/css/select2.min.css" rel="stylesheet" />
<script src="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/js/select2.min.js"></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="./GoogleAnalytics.js"></script>
@@ -37,7 +41,9 @@
<script src="./AdverseReactionReportsChartView.js"></script>
<script src="./BatchCodeDetailsView.js"></script>
<script>
$(document).ready(function () {
document.addEventListener(
"DOMContentLoaded",
event => {
BatchCodeSelectInitializer.initialize(
{
batchCodeSelectElement: $('#batchCodeSelect'),
@@ -48,10 +54,24 @@
</script>
</head>
<body>
<body class="nav-md">
<div class="container body">
<div class="main_container">
<!-- top navigation -->
<div class="top_nav">
</div>
<!-- top navigation -->
<!-- page content -->
<div class="right_col" role="main">
<div>
<div class="page-title">
<div class="title_left">
<h1>Batch Codes of Coronavirus 2019 Vaccines</h1>
</div>
</div>
<div class="clearfix"></div>
<p>
Check out your batch code:
<label>Check out your batch code:</label>
<select id="batchCodeSelect" name="batchCode">
<option disabled="" hidden="" selected="" value="">Select Batch</option>
<option value="FE6208">FE6208</option>
@@ -49759,10 +49779,25 @@
<option value="Ø94F21A">Ø94F21A</option>
</select>
</p>
<div id="batchCodeDetails" style="width: 50%">
<h3>Results or Outcomes of Adverse Events</h3>
<div id="batchCodeDetails" class="row">
<div class="col-xs-12 col-sm-6">
<div class="x_panel">
<div class="x_title">
<h3>Outcomes of Adverse Events</h3>
<div class="clearfix"></div>
</div>
<div class="x_content">
<canvas id="adverseReactionReportsChartView"></canvas>
</div>
</div>
</div>
<div class="col-xs-12 col-sm-6">
<div class="x_panel">
<div class="x_title">
<h3>Frequencies of Reported Symptoms</h3>
<div class="clearfix"></div>
</div>
<div class="x_content">
<div class="chartWithSlider">
<div class="chartContainer">
<canvas class="canvas"></canvas>
@@ -49772,6 +49807,16 @@
</div>
</div>
</div>
</div>
</div>
</div>
<div class="clearfix"></div>
</div>
</div>
</div>
<!-- page content -->
<!-- footer content -->
<footer>
<dl>
<dt>Data Source:</dt>
<dd><a href="https://vaers.hhs.gov/data/datasets.html" target="_blank">Vaccine Adverse Event Reporting System
@@ -49779,7 +49824,25 @@
<dt>Last updated:</dt>
<dd id="last_updated">April 07, 2023</dd>
</dl>
<span id="forkongithub"><a href="https://github.com/KnollFrank/HowBadIsMyBatch">Fork me on GitHub</a></span>
<span id="forkongithub"><a href="https://github.com/KnollFrank/HowBadIsMyBatch" target="_blank">Fork me on GitHub</a></span>
<div class="clearfix"></div>
</footer>
</div>
<!-- jQuery -->
<script src="gentelella/vendors/jquery/dist/jquery.min.js"></script>
<link href="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/css/select2.min.css" rel="stylesheet" />
<script src="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/js/select2.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/chart.js@4.2.0/dist/chart.umd.min.js"></script>
<!-- Bootstrap -->
<script src="gentelella/vendors/bootstrap/dist/js/bootstrap.min.js"></script>
<!-- FastClick -->
<script src="gentelella/vendors/fastclick/lib/fastclick.js"></script>
<!-- Chart.js -->
<script src="https://cdn.jsdelivr.net/npm/chart.js@^3"></script>
<script src="https://cdn.jsdelivr.net/npm/moment@^2"></script>
<script src="https://cdn.jsdelivr.net/npm/chartjs-adapter-moment@^1"></script>
<!-- Custom Theme Scripts -->
<script src="gentelella/build/js/custom.js"></script>
</body>
</html>

View File

@@ -4911,10 +4911,10 @@ table thead .checkbox.radio { margin-top:-7px;margin-top:-21px; }
flex-direction: row;
}
.chartWithSlider .chart {
.chartWithSlider .chartContainer {
flex: 95%;
}
.chartWithSlider .slider {
.chartWithSlider .sliderContainer {
flex: 5%;
}

File diff suppressed because one or more lines are too long