<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
<script src="https://cdn.jsdelivr.net/npm/d3"></script>
<script src="https://cdn.jsdelivr.net/npm/luxon@^2"></script>
<script src="https://cdn.jsdelivr.net/npm/chartjs-adapter-luxon@^1"></script>
<script>
Promise.all([
d3.csv('/assets/csv/stats-weight.csv'),
d3.csv('/assets/csv/stats-sugar.csv'),
d3.csv('/assets/csv/stats-sugar-self.csv'),
d3.csv('/assets/csv/stats-chol.csv')
]).then(function([weight,sugarT,sugarS,chol]){
makeChartW(weight);
makeChartST(sugarT);
makeChartSS(sugarS);
makeChartC(chol);
});
/*=====*/
/*START WEIGHT*/
/*=====*/
function makeChartW(wt) {
var ctxW = document.getElementById('weightChart');
var labels = wt.map(function(d) {return d.date});
var kg = wt.map(function(d) {return d.weight});
var chartW = new Chart(ctxW, {
type: 'line',
data: {
labels: labels,
datasets: [{
label: 'Weight (kg)',
data: kg,
backgroundColor: '#ff0000',
borderColor: '#ff0000',
}]
},
options: {
maintainAspectRatio: false,
scales: {
x: {
type: 'time'
},
y: {
min: 75,
max: 90
}
}
}
});
};
/*=====*/
/*END WEIGHT*/
/*=====*/
/*=====*/
/*START SUGAR TEST*/
/*=====*/
function makeChartST(bs) {
var ctxST = document.getElementById('sugarChartTest');
var labels = bs.map(function(d) {return d.date});
var hb = bs.map(function(d) {return d.hb});
var gl = bs.map(function(d) {return d.gl});
var covid = bs.map(function(d) {return d.covid});
var chartS = new Chart(ctxST, {
type: 'line',
data: {
labels: labels,
datasets: [{
label: 'Three month Hb glyc. (%)',
data: hb,
backgroundColor: '#0000ff',
borderColor: '#0000ff',
yAxisID: 'y',
},
{
label: 'Morning blood sugar (mg/dL)',
data: gl,
backgroundColor: '#00ff00',
borderColor: '#00ff00',
yAxisID: 'y1',
},
{
label: 'Covid line',
data: covid,
backgroundColor: '#ff0000',
borderColor: '#ff0000',
yAxisID: 'y',
}],
},
options: {
scales: {
x: {
type: 'time',
min: '2011-11-01',
},
y: {
min: 0,
max: 10,
position: 'left',
},
y1: {
min: 50,
max: 200,
position: 'right',
grid: {
drawOnChartArea: false, // only want the grid lines for one axis to show up
},
}
}
}
});
};
/*=====*/
/*END SUGAR TEST*/
/*=====*/
/*=====*/
/*START SUGAR SELF*/
/*=====*/
function makeChartSS(bss) {
var ctxSS = document.getElementById('sugarChartSelf');
var labels = bss.map(function(d) {return d.date});
var gl = bss.map(function(d) {return d.gl});
var notes = bss.map(function(d) {return d.notes});
var chartS = new Chart(ctxSS, {
type: 'line',
data: {
labels: labels,
datasets: [{
label: 'Morning blood sugar - self (mg/dL)',
data: gl,
backgroundColor: '#00ff00',
borderColor: '#00ff00',
yAxisID: 'y',
}],
},
options: {
scales: {
x: {
type: 'time',
min: '2022-09-27',
},
y: {
min: 80,
max: 200,
}
}
}
});
};
/*=====*/
/*END SUGAR SELF*/
/*=====*/
/*=====*/
/*START CHOLESTOROL*/
/*=====*/
function makeChartC(ch) {
var ctxC = document.getElementById('cholChart');
var dates = ch.map(function(d) {return d.date});
var tot = ch.map(function(d) {return d.tot});
var ldl = ch.map(function(d) {return d.ldl});
var hdl = ch.map(function(d) {return d.hdl});
var chartC = new Chart(ctxC, {
type: 'line',
data: {
labels: dates,
datasets: [{
label: 'Total',
data: tot,
backgroundColor: '#0000ff',
borderColor: '#0000ff',
yAxisID: 'y',
},
{
label: 'LDL (bad)',
data: ldl,
backgroundColor: '#ff0000',
borderColor: '#ff0000',
yAxisID: 'y',
},
{
label: 'HDL (good)',
data: hdl,
backgroundColor: '#00ff00',
borderColor: '#00ff00',
yAxisID: 'y',
}],
},
options: {
scales: {
x: {
type: 'time',
min: '2011-11-01',
},
y: {
min: 0,
max: 250,
},
}
}
});
};
/*=====*/
/*END CHOLESTOROL*/
/*=====*/
</script>