covid/index.html at master · VACLab/covid · 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
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <style>
        .on {
            visibility: visible;
        }
        .off {
            visibility: hidden;
        }

        .d3-tip {
            line-height: 1;
            padding: 6px;
            background: rgba(0, 0, 0, 0.8);
            color: #fff;
            border-radius: 4px;
            font-size: 12px;
        }

        /* Creates a small triangle extender for the tooltip */
        .d3-tip:after {
            box-sizing: border-box;
            display: inline;
            font-size: 10px;
            width: 100%;
            line-height: 1;
            color: rgba(0, 0, 0, 0.8);
            content: "\25BC";
            position: absolute;
            text-align: center;
        }

        /* Style northward tooltips specifically */
        .d3-tip.n:after {
            margin: -2px 0 0 0;
            top: 100%;
            left: 0;
        }
    </style>
    <title>COVID-19 in North Carolina</title>
    <link rel="stylesheet" href="css/bootstrap.min.css" crossorigin="anonymous"/>
    <script src="js/jquery-3.4.1.min.js" crossorigin="anonymous"></script>
    <script src="js/bootstrap.bundle.min.js" crossorigin="anonymous"></script>
    <script src="js/d3.min.js" crossorigin="anonymous"></script>
    <script src="js/d3-tip.js" crossorigin="anonymous"></script>
    <script src="js/CovidData.js" crossorigin="anonymous"></script>
    <script src="js/TimeChart.js" crossorigin="anonymous"></script>
    <script src="js/ResizeObserver.js" crossorigin="anonymous"></script>
    <!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-32250702-3"></script>
<script>
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());

  gtag('config', 'UA-32250702-3');
</script>

</head>
<body>
<nav class="navbar navbar-expand-lg navbar-light bg-light">
    <div class="container-fluid" style="padding:0;">
        <div class="navbar-header">
            <a class="navbar-brand" href="#">
                COVID-19 Growth Charts
            </a>
        </div>
        <div id="footerResponsive" class="navbar-collapse">
            <ul class="navbar-nav">
                <li class="nav-item">
                    <a class="nav-link" href="index.html">About</a>
                </li>
                <li class="nav-item dropdown">
                    <a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                        Worldwide
                    </a>
                    <div class="dropdown-menu" aria-labelledby="navbarDropdown">
                        <a class="nav-link" href="world.html">Confirmed Cases <span class="sr-only">(current)</span></a>
                        <a class="nav-link" href="world-deaths.html">Deaths</a>
                    </div>
                </li>
                <li class="nav-item dropdown">
                    <a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                        United States
                    </a>
                    <div class="dropdown-menu" aria-labelledby="navbarDropdown">
                        <a class="nav-link" href="us.html">Confirmed Cases <span class="sr-only">(current)</span></a>
                        <a class="nav-link" href="us-deaths.html">Deaths</a>
                    </div>
                </li>
                <li class="nav-item dropdown">
                    <a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                        North Carolina
                    </a>
                    <div class="dropdown-menu" aria-labelledby="navbarDropdown">
                        <a class="nav-link" href="nc.html">Confirmed Cases <span class="sr-only">(current)</span></a>
                        <a class="nav-link" href="nc-deaths.html">Deaths</a>
                    </div>
                </li>
            </ul>
        </div>
        <ul class="nav navbar-nav navbar-right">
            <li><a href="http://vaclab.unc.edu/"><img style="width: 192px;" src="vaclab_logo.svg"></a></li>
        </ul>
    </div>
</nav>
<div class="row">
    <div style="background: #ffffff; padding-top: 10px; padding-left: 40px; padding-right: 40px; border-bottom: 1px solid lightgray; width: 100%;" class="col-md-12 flex-grow-1">
        <h3>Welcome</h3>
        <p><b>Get started by using the menu bar at the top to select which visualization you'd like to see.</b></p>
        <h3>About This Page</h3>
        <p>
            This website provides interactive growth chart visualizations showing statistics for the spread of COVID-19 over
            time. Charts are provided for both confirmed cases and deaths, counted by country (for global data) or by state
            (within the United States).
        </p>
        <p>
            Data for these charts is sourced from projects on the web which are aggregating statistics in various ways.
            World statistics are from Johns Hopkins as posted <a href="https://github.com/CSSEGISandData/COVID-19">in
            their github repository</a>. Data for the United States and North Carolina pages are obtained from
            <a href="https://usafacts.org/issues/coronavirus/">USAFacts.org</a>. The data sometimes come from scraping
            official sites, manual data entry, or other unreliable methods. Please consider the uncertain nature of the
            data you are viewing when looking at this website's charts. In addition, even "accurate" data has
            significant limitations that depend on local reporting practices, political influence around the world,
            widely variable availability of COVID-19 tests as well as testing criteria. In summary, readers should be
            skeptical consumers of data. Links are provided with each chart to the source data that is used to produce
            the graphics.
        </p>
        <p>
            Ready to begin? Please use the menu bar at the top of this page to select a growth chart that you would like
            to see.
        </p>
    </div>
</div>
<div class="row">
    <div style="margin-top: 15px; text-align: center; font-size: small; width: 100%;" class="col-md-12 flex-grow-1">
        <br/><a href="http://vaclab.unc.edu/"><img style="width: 200px;" src="vaclab_logo.svg"></a>
        <br/>
        This project is available as open source via <a href="https://github.com/VACLab/covid/">the VACLab GitHub repository</a>.
    </div>
</div>
</body>
</html>