tomversluys.github.io/index.html at main · tomversluys/tomversluys.github.io · 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
<!DOCTYPE html>
<html>
<head>
    <title>My GitHub Page</title>
    <style>
        /* General styling */
        body {
            font-family: Arial, sans-serif;
            background-color: #f4f4f4;
            margin: 0;
            padding: 20px;
        }

        h1 {
            background-color: #2e3d49;
            color: #dcdcdc;
            padding: 14px 20px;
            margin: 8px 0;
        }

        /* Aligning images */
        #fig1, #fig2 {
            width: 400px;  /* Explicit width */
            height: auto;  /* Height will adjust automatically based on aspect ratio */
            object-fit: contain;  /* Maintains aspect ratio */
            margin: 0 5px; /* Adding small margins to either side */
        }

        /* For a specific size for Figure 3 */
        #fig3 {
            width: 800px;
            display: block;
            margin-left: auto;
            margin-right: auto;
        }

        /* Styling figure legends */
        figcaption {
            text-align: left;  /* Aligned to left */
            margin-top: 8px;
        }

        figcaption b {
            font-weight: bold;
        }

        /* Styling project background section */
        .info-background {
            background-color: #f1f1f1;
            padding: 16px;
            margin-top: 20px;
            border: 1px solid #ccc;
            border-radius: 8px;
        }

        /* For placing figures side by side */
        .figure-wrapper {
            display: flex;
            justify-content: center;
            gap: 1px;  /* Increased gap size to prevent overlap */
        }

        /* Add spacing between figures */
        figure {
            margin-bottom: 25px;
        }

        /* Differentiate sequential projects */
        .project {
            background-color: #ffffff;
            margin-top: 30px;
            padding: 20px;
            border: 1px solid #ccc;
            border-radius: 8px;
        }
    </style>
</head>
<body>
    <h1>Welcome to my data science portfolio!</h1>
    <p>I recently completed my PhD in Life Sciences (focusing on biostatistics) at Imperial College London.
        Here, I'll be showcasing a few personal projects I've recently worked on.</p>

    <div class="project">
        <h2>War impact analysis: a time-series study using Google Trends, gold prices, and stock market volatility data</h2>

        <div class="info-background">
                <p><strong>Background and key takeaway:</strong></p>
            <p>What shifts when war captivates public attention? Here, I use Google Trends, NASDAQ, and YFinance data to reveal that heightened war interest produces a surge in religiosity. Yet, surprisingly, stock market volatility (VIX) and safe-haven assets like gold remain relatively unaffected.</p>

       <p><strong>Data:</strong></p>
<ul>
    <li>Google trends</li>
    <li>NASDAQ and Yfinance APIs</li>
</ul>
<p><strong>Tools:</strong></p>
<ul>
    <li>Python</li>
    <li>SQL</li>
    <li>Google Cloud (Big Query)</li>
</ul>
<p><strong>Statistical methods:</strong></p>
<ul>
    <li>Vector autoregression</li>
</ul>

            </p>
            <!-- Other content -->
        </div>

        <!-- Adding images side by side -->
        <div class="figure-wrapper">
            <figure>
                <img id="fig1" src="fig1.png" alt="Figure 1.">
                <figcaption><b>Figure 1.</b> Mean monthly normalised time series (scale to 100 as maximum value across period) </figcaption>
            </figure>
            <figure>
                <img id="fig2" src="fig2.png" alt="Figure 2.">
                <figcaption><b>Figure 2.</b> Autocorrelation plots displaying the correlation between sequential values, along with 95% confidence interval (shaded ribbon)</figcaption>
            </figure>
        </div>

        <div class="info-background">
    <p>The monthly change in war interest is significantly correlated with monthly changes in religiosity,
        but not with changes in gold prices or stock market volatility.</p>
    <div>
        <p>We can tentatively infer, then, that as people become more aware of global conflict, interest in religion also increases.</p>
    </div>
</div>

        <!-- Adding Figure 3 back in -->
        <figure>
            <img id="fig3" src="fig3.png" alt="Figure 3.">
            <figcaption><b>Figure 3.</b> The change in monthly mean normalised time series (top), calculated as first differences.
                The correlation between the monthly change after adjusting for autocorrelation in both series, with 95% confidence intervals (bottom)</figcaption>
        </figure>
    </div>
</body>
</html>