visualization-experiments/case2.html at master · ledancs/visualization-experiments · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>

</head>
<style>
    div{
        width: 100%;
    }
    svg{
        display: block;
        margin: auto;
    }
    body{
        font-family: sans-serif;
    }
</style>
<body>

<div>
    <svg id="hgraphContainer" width="1750" height="950" ></svg>
</div>

</body>
<script type="text/javascript" src="measurement.js"></script>
<script type="text/javascript" src="snap.svg.js"></script>
<script type="text/javascript" src="hgraph/hgraph.js"></script>
<script>
    var systolic = new Measurement("Systolic", 100, 130, 135, "mmHG (avg)"); // 120
    var diastolic = new Measurement("Diastolic", 70, 85, 86, "mmHG (avg)"); // 80
    var bloodPressureG = new GroupedMs("Blood Pressure", [systolic, diastolic]);

    // 54-60 Athlete
    // 74-77 Average
    // for a 50 year old person
    var restingHeartRate = new Measurement("Resting Heart Rate", 54, 77, 70, "bpm (avg)");
    var fitnessIndex = new Measurement("Fitness Index", 70, 120, 90, "(avg)");
    // Hand Grip Strength Test
    // http://kinesiologists.ca/wp/bcrpa-certification/personal-trainer-store/free-resources/assessment-grip-strength/
    // the upper high is 64 but there is no really "bad" upper value
    var muscularForce = new Measurement("Muscular force", 51, 80, 60, "%");
    // 1, 2 are poor, 3 is borderline and 4, and 5 are good
    // no upper bound
    var muscularEndurance = new Measurement("Muscular endurance", 2.5, 6, 3, "");
    var balance = new Measurement("Balance", 1, 4, 2, "");
    var physicalFitnessG = new GroupedMs("Fitness", [fitnessIndex, restingHeartRate, muscularForce, muscularEndurance, balance]);

    var weeklyActiveDays = new Measurement("Weekly Active Days", 3, 10, 4, "(avg)"); // ideal 5
    var stepsPerDay = new Measurement("Steps per Day", 7000, 20000, 8000, "(avg)"); // the higher the better so there is no upper bound
    var exerciseG = new GroupedMs("Exercise", [weeklyActiveDays, stepsPerDay]);

    var bodyMassIndex = new Measurement("Body Mass Index", 18.5, 29.9, 26, "BMI");
    var waistDiameter = new Measurement("Waist Diameter", 20, 80, 78, "cm");
    var fatPercentage = new Measurement("Fat Percentage", 23, 33.9, 32, "%");
    var bodyCompositionG = new GroupedMs("Body Composition", [bodyMassIndex, waistDiameter, fatPercentage]);

    var timeInBed = new Measurement("Time in Bed", 7, 10, 8, "hours (avg)");
    var timeAsleep = new Measurement("Time Asleep", 6, 9, 5, "hours (avg)");
    var sleepG = new GroupedMs("Sleep", [timeInBed, timeAsleep]);

    // http://www.mayoclinic.org/diseases-conditions/high-blood-cholesterol/in-depth/cholesterol-levels/art-20048245
    var fBGluc = new Measurement("fB-Gluc", 4, 6, 5.8, "mmol/l");
    var cholesterol = new Measurement("Cholesterol", 0, 6.2,4.7, "mmol/l");
    var ldl = new Measurement("LDL", 0, 4.1, 2.8, "mmol/l"); // bad cholesterol
    var hdl = new Measurement("HDL", 1.3, 2.2, 1.2, "mmol/l"); // good cholesterol
    var hemoglobine = new Measurement("Hemoglobine", 134, 167, 141, "gl/l");
    var labTestsG = new GroupedMs("Lab Tests", [hemoglobine, fBGluc, cholesterol, ldl, hdl]);

    var tobacco = new Measurement("Tobacco", -5, 5, 0, ""); // zero is ideal
    var alcohol = new Measurement("Alcohol", 0, 10, 6, "AUDIT"); // this is based on a scale
    var drugAbuse = new Measurement("Drug Abuse", -5, 5, 0, ""); // zero is ideal
    var medicationAbuse = new Measurement("Medication Abuse", -5, 5, 0, "");
    var drugsG = new GroupedMs("Drugs", [tobacco, alcohol, drugAbuse, medicationAbuse]);

    var depression = new Measurement("Depression", -9, 9, 11, "");
    var stressRecovery = new Measurement("Stress Recovery", 20, 70, 15, "");
    var stressLevel = new Measurement("Stress Level", 0, 60, 35, "%");
    var optimism = new Measurement("Optimism", 14, 24, 13, "");
    var emotionalG = new GroupedMs("Emotional wellbeing", [depression, stressRecovery, stressLevel, optimism]);

    var g = new hgraph("hgraphContainer", [exerciseG, bloodPressureG, bodyCompositionG, sleepG, physicalFitnessG, labTestsG, drugsG, emotionalG]);
</script>
</html>