Update slides

This commit is contained in:
BerriJ committed 2025-06-15 11:55:33 +02:00
1 parent e84df0ca8f
commit 2b22506fb8
1 file changed
+431 -234
+431 -234
View File
@@ -934,7 +934,7 @@ position: absolute;
top: 0; top: 0;
left: 0; left: 0;
opacity: 0; opacity: 0;
transform: translate(-50%, -50%); transform: translate(-30%, 0%);
transition: opacity 0.4s ease-in-out; transition: opacity 0.4s ease-in-out;
z-index: 99; z-index: 99;
} }
@@ -25879,12 +25879,11 @@ Berrisch, J. <span class="citation" data-cites="berrisch2025rcpptimer">(<a href=
<span id="cb1-3"><a href></a></span> <span id="cb1-3"><a href></a></span>
<span id="cb1-4"><a href></a><span class="dt">void</span> main<span class="op">(){</span></span> <span id="cb1-4"><a href></a><span class="dt">void</span> main<span class="op">(){</span></span>
<span id="cb1-5"><a href></a> Rcpp<span class="op">::</span>Timer timer<span class="op">;</span></span> <span id="cb1-5"><a href></a> Rcpp<span class="op">::</span>Timer timer<span class="op">;</span></span>
<span id="cb1-6"><a href></a> Rcpp<span class="op">::</span>Timer<span class="op">::</span>ScopedTimer _<span class="op">(</span>timer<span class="op">,</span> <span class="st">&quot;ST&quot;</span><span class="op">);</span></span> <span id="cb1-6"><a href></a></span>
<span id="cb1-7"><a href></a></span> <span id="cb1-7"><a href></a> timer<span class="op">.</span>tic<span class="op">();</span></span>
<span id="cb1-8"><a href></a> timer<span class="op">.</span>tic<span class="op">();</span></span> <span id="cb1-8"><a href></a> <span class="co">// Code to be timed</span></span>
<span id="cb1-9"><a href></a> <span class="co">// Some more code</span></span> <span id="cb1-9"><a href></a> timer<span class="op">.</span>toc<span class="op">();</span></span>
<span id="cb1-10"><a href></a> timer<span class="op">.</span>toc<span class="op">();</span></span> <span id="cb1-10"><a href></a><span class="op">}</span></span></code><button title="Copy to Clipboard" class="code-copy-button"><i class="bi"></i></button></pre></div>
<span id="cb1-11"><a href></a><span class="op">}</span> <span class="co">// ScopedTimer will stop automatically</span></span></code><button title="Copy to Clipboard" class="code-copy-button"><i class="bi"></i></button></pre></div>
</div></div> </div></div>
</section> </section>
<section> <section>
@@ -25911,6 +25910,10 @@ Berrisch, J. <span class="citation" data-cites="berrisch2025rcpptimer">(<a href=
<ul> <ul>
<li>Vertical aggregation</li> <li>Vertical aggregation</li>
</ul></li> </ul></li>
<li>Combining at an angle
<ul>
<li><span class="citation" data-cites="taylor2023angular">Taylor &amp; Meng (<a href="#/references" role="doc-biblioref" onclick>2023</a>)</span></li>
</ul></li>
</ul> </ul>
</div><div class="column" style="width:4%;"> </div><div class="column" style="width:4%;">
@@ -25923,7 +25926,7 @@ Berrisch, J. <span class="citation" data-cites="berrisch2025rcpptimer">(<a href=
<div class="cell-output-display"> <div class="cell-output-display">
<div> <div>
<figure> <figure>
<p><img role="img" data-src="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0nMS4wJyBlbmNvZGluZz0nVVRGLTgnID8+CjxzdmcgeG1sbnM9J2h0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnJyB4bWxuczp4bGluaz0naHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluaycgY2xhc3M9J3N2Z2xpdGUnIHdpZHRoPSc3MjAuMDBwdCcgaGVpZ2h0PSc0MzIuMDBwdCcgdmlld0JveD0nMCAwIDcyMC4wMCA0MzIuMDAnPgo8ZGVmcz4KICA8c3R5bGUgdHlwZT0ndGV4dC9jc3MnPjwhW0NEQVRBWwogICAgLnN2Z2xpdGUgbGluZSwgLnN2Z2xpdGUgcG9seWxpbmUsIC5zdmdsaXRlIHBvbHlnb24sIC5zdmdsaXRlIHBhdGgsIC5zdmdsaXRlIHJlY3QsIC5zdmdsaXRlIGNpcmNsZSB7CiAgICAgIGZpbGw6IG5vbmU7CiAgICAgIHN0cm9rZTogIzAwMDAwMDsKICAgICAgc3Ryb2tlLWxpbmVjYXA6IHJvdW5kOwogICAgICBzdHJva2UtbGluZWpvaW46IHJvdW5kOwogICAgICBzdHJva2UtbWl0ZXJsaW1pdDogMTAuMDA7CiAgICB9CiAgICAuc3ZnbGl0ZSB0ZXh0IHsKICAgICAgd2hpdGUtc3BhY2U6IHByZTsKICAgIH0KICBdXT48L3N0eWxlPgo8L2RlZnM+CjxyZWN0IHdpZHRoPScxMDAlJyBoZWlnaHQ9JzEwMCUnIHN0eWxlPSdzdHJva2U6IG5vbmU7IGZpbGw6ICNGRkZGRkY7Jy8+CjxkZWZzPgogIDxjbGlwUGF0aCBpZD0nY3BNQzR3TUh3M01qQXVNREI4TUM0d01IdzBNekl1TURBPSc+CiAgICA8cmVjdCB4PScwLjAwJyB5PScwLjAwJyB3aWR0aD0nNzIwLjAwJyBoZWlnaHQ9JzQzMi4wMCcgLz4KICA8L2NsaXBQYXRoPgo8L2RlZnM+CjxnIGNsaXAtcGF0aD0ndXJsKCNjcE1DNHdNSHczTWpBdU1EQjhNQzR3TUh3ME16SXVNREE9KSc+CjwvZz4KPGRlZnM+CiAgPGNsaXBQYXRoIGlkPSdjcE1Ua3VNREY4TWpJd0xqazVmREU1TGpBeGZERXlOQzQ1T1E9PSc+CiAgICA8cmVjdCB4PScxOS4wMScgeT0nMTkuMDEnIHdpZHRoPScyMDEuOTgnIGhlaWdodD0nMTA1Ljk4JyAvPgogIDwvY2xpcFBhdGg+CjwvZGVmcz4KPGcgY2xpcC1wYXRoPSd1cmwoI2NwTVRrdU1ERjhNakl3TGprNWZERTVMakF4ZkRFeU5DNDVPUT09KSc+Cjxwb2x5bGluZSBwb2ludHM9JzI2LjQ5LDEyNC45MSAzOS44NSwxMTIuOTMgNTMuMjEsMTEyLjE3IDY2LjU3LDkwLjI1IDc5LjkyLDkxLjAxIDkzLjI4LDkxLjA1IDEwNi42NCw3Ni4wMiAxMjAuMDAsNjcuNDcgMTMzLjM2LDYxLjQ2IDE0Ni43Miw1OS44NSAxNjAuMDgsNDEuNzAgMTczLjQzLDQxLjU3IDE4Ni43OSw0MC43NiAyMDAuMTUsNDMuNTMgMjEzLjUxLDE2LjAzICcgc3R5bGU9J3N0cm9rZS13aWR0aDogMy4wMDsgc3Ryb2tlOiAjMjA1MEYwOycgLz4KPC9nPgo8ZGVmcz4KICA8Y2xpcFBhdGggaWQ9J2NwTUM0d01Id3lOREF1TURCOE1DNHdNSHd4TkRRdU1EQT0nPgogICAgPHJlY3QgeD0nMC4wMCcgeT0nMC4wMCcgd2lkdGg9JzI0MC4wMCcgaGVpZ2h0PScxNDQuMDAnIC8+CiAgPC9jbGlwUGF0aD4KPC9kZWZzPgo8ZyBjbGlwLXBhdGg9J3VybCgjY3BNQzR3TUh3eU5EQXVNREI4TUM0d01Id3hORFF1TURBPSknPgo8L2c+CjxkZWZzPgogIDxjbGlwUGF0aCBpZD0nY3BNalU1TGpBeGZEUTJNQzQ1T1h3eE9TNHdNWHd4TWpRdU9Uaz0nPgogICAgPHJlY3QgeD0nMjU5LjAxJyB5PScxOS4wMScgd2lkdGg9JzIwMS45OCcgaGVpZ2h0PScxMDUuOTgnIC8+CiAgPC9jbGlwUGF0aD4KPC9kZWZzPgo8ZyBjbGlwLXBhdGg9J3VybCgjY3BNalU1TGpBeGZEUTJNQzQ1T1h3eE9TNHdNWHd4TWpRdU9Uaz0pJz4KPHBvbHlsaW5lIHBvaW50cz0nMjY2LjQ5LDExOS4xNCAyNzkuODUsMTE2Ljc5IDI5My4yMSwxMTMuOTQgMzA2LjU3LDExMC40OSAzMTkuOTIsMTA2LjM2IDMzMy4yOCwxMDEuNDMgMzQ2LjY0LDk1LjU5IDM2MC4wMCw4OC43NyAzNzMuMzYsODAuOTMgMzg2LjcyLDcyLjE1IDQwMC4wOCw2Mi43MyA0MTMuNDMsNTMuMjMgNDI2Ljc5LDQ0LjU3IDQ0MC4xNSwzNy45NCA0NTMuNTEsMzQuNTAgJyBzdHlsZT0nc3Ryb2tlLXdpZHRoOiAzLjAwOyBzdHJva2U6ICMyMDUwRjA7JyAvPgo8L2c+CjxkZWZzPgogIDxjbGlwUGF0aCBpZD0nY3BNalF3TGpBd2ZEUTRNQzR3TUh3d0xqQXdmREUwTkM0d01BPT0nPgogICAgPHJlY3QgeD0nMjQwLjAwJyB5PScwLjAwJyB3aWR0aD0nMjQwLjAwJyBoZWlnaHQ9JzE0NC4wMCcgLz4KICA8L2NsaXBQYXRoPgo8L2RlZnM+CjxnIGNsaXAtcGF0aD0ndXJsKCNjcE1qUXdMakF3ZkRRNE1DNHdNSHd3TGpBd2ZERTBOQzR3TUE9PSknPgo8L2c+CjxnIGNsaXAtcGF0aD0ndXJsKCNjcE1qVTVMakF4ZkRRMk1DNDVPWHd4T1M0d01Yd3hNalF1T1RrPSknPgo8dGV4dCB4PSczMTIuNDYnIHk9Jzc4LjAwJyBzdHlsZT0nZm9udC1zaXplOiAxNS44NHB4O2ZpbGw6ICMyMDUwRjA7IGZvbnQtZmFtaWx5OiAiTGliZXJhdGlvbiBTYW5zIjsnIHRleHRMZW5ndGg9JzEyLjk1cHgnIGxlbmd0aEFkanVzdD0nc3BhY2luZ0FuZEdseXBocyc+dzwvdGV4dD4KPHRleHQgeD0nMzI1LjQwJyB5PSc4MS4wMycgc3R5bGU9J2ZvbnQtc2l6ZTogMTEuMDlweDtmaWxsOiAjMjA1MEYwOyBmb250LWZhbWlseTogIkxpYmVyYXRpb24gU2FucyI7JyB0ZXh0TGVuZ3RoPSc3LjA1cHgnIGxlbmd0aEFkanVzdD0nc3BhY2luZ0FuZEdseXBocyc+MTwvdGV4dD4KPHRleHQgeD0nMzMyLjQ1JyB5PSc3OC4wMCcgc3R5bGU9J2ZvbnQtc2l6ZTogMTkuODBweDtmaWxsOiAjMjA1MEYwOyBmb250LWZhbWlseTogIkRlamFWdSBTYW5zIjsnIHRleHRMZW5ndGg9JzcuNzNweCcgbGVuZ3RoQWRqdXN0PSdzcGFjaW5nQW5kR2x5cGhzJz4oPC90ZXh0Pgo8dGV4dCB4PSczNDAuMTgnIHk9Jzc4LjAwJyBzdHlsZT0nZm9udC1zaXplOiAxNS44NHB4O2ZpbGw6ICMyMDUwRjA7IGZvbnQtZmFtaWx5OiAiTGliZXJhdGlvbiBTYW5zIjsnIHRleHRMZW5ndGg9JzYuMjFweCcgbGVuZ3RoQWRqdXN0PSdzcGFjaW5nQW5kR2x5cGhzJz50PC90ZXh0Pgo8dGV4dCB4PSczNDYuMzgnIHk9Jzc4LjAwJyBzdHlsZT0nZm9udC1zaXplOiAxOS44MHB4O2ZpbGw6ICMyMDUwRjA7IGZvbnQtZmFtaWx5OiAiRGVqYVZ1IFNhbnMiOycgdGV4dExlbmd0aD0nNy43M3B4JyBsZW5ndGhBZGp1c3Q9J3NwYWNpbmdBbmRHbHlwaHMnPik8L3RleHQ+CjxsaW5lIHgxPSc0MjYuNzknIHkxPSc5Ni41MycgeDI9JzQ1My41MScgeTI9JzEyMS4wNycgc3R5bGU9J3N0cm9rZS13aWR0aDogMy4wMDsnIC8+Cjxwb2x5bGluZSBwb2ludHM9JzQzNS45NCwxMTcuMTUgNDUzLjUxLDEyMS4wNyA0NDguMTIsMTAzLjg5ICcgc3R5bGU9J3N0cm9rZS13aWR0aDogMy4wMDsnIC8+CjwvZz4KPGRlZnM+CiAgPGNsaXBQYXRoIGlkPSdjcE5EazVMakF4ZkRjd01DNDVPWHd4T1M0d01Yd3hNalF1T1RrPSc+CiAgICA8cmVjdCB4PSc0OTkuMDEnIHk9JzE5LjAxJyB3aWR0aD0nMjAxLjk4JyBoZWlnaHQ9JzEwNS45OCcgLz4KICA8L2NsaXBQYXRoPgo8L2RlZnM+CjxnIGNsaXAtcGF0aD0ndXJsKCNjcE5EazVMakF4ZkRjd01DNDVPWHd4T1M0d01Yd3hNalF1T1RrPSknPgo8L2c+CjxkZWZzPgogIDxjbGlwUGF0aCBpZD0nY3BNVGt1TURGOE1qSXdMams1ZkRFMk15NHdNWHd5TmpndU9Uaz0nPgogICAgPHJlY3QgeD0nMTkuMDEnIHk9JzE2My4wMScgd2lkdGg9JzIwMS45OCcgaGVpZ2h0PScxMDUuOTgnIC8+CiAgPC9jbGlwUGF0aD4KPC9kZWZzPgo8ZyBjbGlwLXBhdGg9J3VybCgjY3BNVGt1TURGOE1qSXdMams1ZkRFMk15NHdNWHd5TmpndU9Uaz0pJz4KPHBvbHlsaW5lIHBvLine truncated <p><img role="img" data-src="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0nMS4wJyBlbmNvZGluZz0nVVRGLTgnID8+CjxzdmcgeG1sbnM9J2h0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnJyB4bWxuczp4bGluaz0naHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluaycgY2xhc3M9J3N2Z2xpdGUnIHdpZHRoPSc3MjAuMDBwdCcgaGVpZ2h0PSc1NzYuMDBwdCcgdmlld0JveD0nMCAwIDcyMC4wMCA1NzYuMDAnPgo8ZGVmcz4KICA8c3R5bGUgdHlwZT0ndGV4dC9jc3MnPjwhW0NEQVRBWwogICAgLnN2Z2xpdGUgbGluZSwgLnN2Z2xpdGUgcG9seWxpbmUsIC5zdmdsaXRlIHBvbHlnb24sIC5zdmdsaXRlIHBhdGgsIC5zdmdsaXRlIHJlY3QsIC5zdmdsaXRlIGNpcmNsZSB7CiAgICAgIGZpbGw6IG5vbmU7CiAgICAgIHN0cm9rZTogIzAwMDAwMDsKICAgICAgc3Ryb2tlLWxpbmVjYXA6IHJvdW5kOwogICAgICBzdHJva2UtbGluZWpvaW46IHJvdW5kOwogICAgICBzdHJva2UtbWl0ZXJsaW1pdDogMTAuMDA7CiAgICB9CiAgICAuc3ZnbGl0ZSB0ZXh0IHsKICAgICAgd2hpdGUtc3BhY2U6IHByZTsKICAgIH0KICBdXT48L3N0eWxlPgo8L2RlZnM+CjxyZWN0IHdpZHRoPScxMDAlJyBoZWlnaHQ9JzEwMCUnIHN0eWxlPSdzdHJva2U6IG5vbmU7IGZpbGw6ICNGRkZGRkY7Jy8+CjxkZWZzPgogIDxjbGlwUGF0aCBpZD0nY3BNQzR3TUh3M01qQXVNREI4TUM0d01IdzFOell1TURBPSc+CiAgICA8cmVjdCB4PScwLjAwJyB5PScwLjAwJyB3aWR0aD0nNzIwLjAwJyBoZWlnaHQ9JzU3Ni4wMCcgLz4KICA8L2NsaXBQYXRoPgo8L2RlZnM+CjxnIGNsaXAtcGF0aD0ndXJsKCNjcE1DNHdNSHczTWpBdU1EQjhNQzR3TUh3MU56WXVNREE9KSc+CjwvZz4KPGRlZnM+CiAgPGNsaXBQYXRoIGlkPSdjcE1Ua3VNREY4TWpJd0xqazVmREU1TGpBeGZERTNNaTQ1T1E9PSc+CiAgICA8cmVjdCB4PScxOS4wMScgeT0nMTkuMDEnIHdpZHRoPScyMDEuOTgnIGhlaWdodD0nMTUzLjk4JyAvPgogIDwvY2xpcFBhdGg+CjwvZGVmcz4KPGcgY2xpcC1wYXRoPSd1cmwoI2NwTVRrdU1ERjhNakl3TGprNWZERTVMakF4ZkRFM01pNDVPUT09KSc+Cjxwb2x5bGluZSBwb2ludHM9JzI2LjQ5LDE3Mi44NyAzOS44NSwxNTUuNDcgNTMuMjEsMTU0LjM3IDY2LjU3LDEyMi41MiA3OS45MiwxMjMuNjIgOTMuMjgsMTIzLjY4IDEwNi42NCwxMDEuODQgMTIwLjAwLDg5LjQyIDEzMy4zNiw4MC42OSAxNDYuNzIsNzguMzUgMTYwLjA4LDUxLjk4IDE3My40Myw1MS43OSAxODYuNzksNTAuNjIgMjAwLjE1LDU0LjYzIDIxMy41MSwxNC42OSAnIHN0eWxlPSdzdHJva2Utd2lkdGg6IDMuMDA7IHN0cm9rZTogIzgwQzY4NDsnIC8+CjwvZz4KPGRlZnM+CiAgPGNsaXBQYXRoIGlkPSdjcE1DNHdNSHd5TkRBdU1EQjhNQzR3TUh3eE9USXVNREE9Jz4KICAgIDxyZWN0IHg9JzAuMDAnIHk9JzAuMDAnIHdpZHRoPScyNDAuMDAnIGhlaWdodD0nMTkyLjAwJyAvPgogIDwvY2xpcFBhdGg+CjwvZGVmcz4KPGcgY2xpcC1wYXRoPSd1cmwoI2NwTUM0d01Id3lOREF1TURCOE1DNHdNSHd4T1RJdU1EQT0pJz4KPC9nPgo8ZGVmcz4KICA8Y2xpcFBhdGggaWQ9J2NwTWpVNUxqQXhmRFEyTUM0NU9Yd3hPUzR3TVh3eE56SXVPVGs9Jz4KICAgIDxyZWN0IHg9JzI1OS4wMScgeT0nMTkuMDEnIHdpZHRoPScyMDEuOTgnIGhlaWdodD0nMTUzLjk4JyAvPgogIDwvY2xpcFBhdGg+CjwvZGVmcz4KPGcgY2xpcC1wYXRoPSd1cmwoI2NwTWpVNUxqQXhmRFEyTUM0NU9Yd3hPUzR3TVh3eE56SXVPVGs9KSc+Cjxwb2x5bGluZSBwb2ludHM9JzI2Ni40OSwxNjQuNTAgMjc5Ljg1LDE2MS4wOCAyOTMuMjEsMTU2LjkzIDMwNi41NywxNTEuOTMgMzE5LjkyLDE0NS45MiAzMzMuMjgsMTM4Ljc2IDM0Ni42NCwxMzAuMjggMzYwLjAwLDEyMC4zNyAzNzMuMzYsMTA4Ljk3IDM4Ni43Miw5Ni4yMiA0MDAuMDgsODIuNTMgNDEzLjQzLDY4LjczIDQyNi43OSw1Ni4xNSA0NDAuMTUsNDYuNTIgNDUzLjUxLDQxLjUxICcgc3R5bGU9J3N0cm9rZS13aWR0aDogMy4wMDsgc3Ryb2tlOiAjODBDNjg0OycgLz4KPC9nPgo8ZGVmcz4KICA8Y2xpcFBhdGggaWQ9J2NwTWpRd0xqQXdmRFE0TUM0d01Id3dMakF3ZkRFNU1pNHdNQT09Jz4KICAgIDxyZWN0IHg9JzI0MC4wMCcgeT0nMC4wMCcgd2lkdGg9JzI0MC4wMCcgaGVpZ2h0PScxOTIuMDAnIC8+CiAgPC9jbGlwUGF0aD4KPC9kZWZzPgo8ZyBjbGlwLXBhdGg9J3VybCgjY3BNalF3TGpBd2ZEUTRNQzR3TUh3d0xqQXdmREU1TWk0d01BPT0pJz4KPC9nPgo8ZyBjbGlwLXBhdGg9J3VybCgjY3BNalU1TGpBeGZEUTJNQzQ1T1h3eE9TNHdNWHd4TnpJdU9Uaz0pJz4KPHRleHQgeD0nMzEyLjQ2JyB5PScxMDIuMDAnIHN0eWxlPSdmb250LXNpemU6IDE1Ljg0cHg7ZmlsbDogIzgwQzY4NDsgZm9udC1mYW1pbHk6ICJMaWJlcmF0aW9uIFNhbnMiOycgdGV4dExlbmd0aD0nMTIuOTVweCcgbGVuZ3RoQWRqdXN0PSdzcGFjaW5nQW5kR2x5cGhzJz53PC90ZXh0Pgo8dGV4dCB4PSczMjUuNDAnIHk9JzEwNS4wMycgc3R5bGU9J2ZvbnQtc2l6ZTogMTEuMDlweDtmaWxsOiAjODBDNjg0OyBmb250LWZhbWlseTogIkxpYmVyYXRpb24gU2FucyI7JyB0ZXh0TGVuZ3RoPSc3LjA1cHgnIGxlbmd0aEFkanVzdD0nc3BhY2luZ0FuZEdseXBocyc+MTwvdGV4dD4KPHRleHQgeD0nMzMyLjQ1JyB5PScxMDIuMDAnIHN0eWxlPSdmb250LXNpemU6IDE5LjgwcHg7ZmlsbDogIzgwQzY4NDsgZm9udC1mYW1pbHk6ICJEZWphVnUgU2FucyI7JyB0ZXh0TGVuZ3RoPSc3LjczcHgnIGxlbmd0aEFkanVzdD0nc3BhY2luZ0FuZEdseXBocyc+KDwvdGV4dD4KPHRleHQgeD0nMzQwLjE4JyB5PScxMDIuMDAnIHN0eWxlPSdmb250LXNpemU6IDE1Ljg0cHg7ZmlsbDogIzgwQzY4NDsgZm9udC1mYW1pbHk6ICJMaWJlcmF0aW9uIFNhbnMiOycgdGV4dExlbmd0aD0nNi4yMXB4JyBsZW5ndGhBZGp1c3Q9J3NwYWNpbmdBbmRHbHlwaHMnPnQ8L3RleHQ+Cjx0ZXh0IHg9JzM0Ni4zOCcgeT0nMTAyLjAwJyBzdHlsZT0nZm9udC1zaXplOiAxOS44MHB4O2ZpbGw6ICM4MEM2ODQ7IGZvbnQtZmFtaWx5OiAiRGVqYVZ1IFNhbnMiOycgdGV4dExlbmd0aD0nNy43M3B4JyBsZW5ndGhBZGp1c3Q9J3NwYWNpbmdBbmRHbHlwaHMnPik8L3RleHQ+CjxsaW5lIHgxPSc0MjYuNzknIHkxPScxMzEuNjQnIHgyPSc0NTMuNTEnIHkyPScxNjcuMjknIHN0eWxlPSdzdHJva2Utd2lkdGg6IDMuMDA7IHN0cm9rZTogIzQxNDE0MTsnIC8+Cjxwb2x5bGluZSBwb2ludHM9JzQzNi45NiwxNjAuMjEgNDUzLjUxLDE2Ny4yOSA0NTEuMzYsMTQ5LjQyICcgc3R5bGU9J3N0cm9rZS13aWR0aDogMy4wMDsgc3Ryb2tlOiAjNDE0MTQxOycgLz4KPC9nPgo8ZGVmcz4KICA8Y2xpcFBhdGggaWQ9J2NwTkRrNUxqQXhmRGN3TUM0NU9Yd3hPUzR3TVh3eE56SXVPVGs9Jz4KICAgIDxyZWN0IHg9JzQ5OS4wMScgeT0nMTkuMDEnIHdpZHRoPScyMDEuOTgnIGhlaWdodD0nMTUzLjk4JyAvPgogIDwvY2xpcFBhdGg+CjwvZGVmcz4KPGcgY2xpcC1wYXRoPSd1cmwoI2NwTkRrNUxqQXhmRGN3TUM0NU9Yd3hPUzR3TVh3eE56SXVPVGs9KSc+CjwvZz4KPGRlZnM+CiAgPGNsaXBQYXRoIGlkPSdjcE1Ua3VNREY4TWpJd0xqazVmREl4TVM0d01Yd3pOalF1T1RrPSc+CiAgICA8cmVjdCB4PScxOS4wMScgeT0nMjExLjAxJyB3aWR0aD0nMjAxLjk4JyBoZWlnaHQ9JzE1My45OCcgLz4KICA8L2NsaXBQYXRoPgo8L2RlZnM+CjxnIGNsaXAtcGF0aD0ndXJsKCNjcE1Ua3VNLine truncated
</figure> </figure>
</div> </div>
</div> </div>
@@ -25931,11 +25934,218 @@ Berrisch, J. <span class="citation" data-cites="berrisch2025rcpptimer">(<a href=
</div> </div>
<div id="tabset-1-2"> <div id="tabset-1-2">
<div class="cell"> <div class="cell">
<div class="cell-output-display"> <div class="sourceCode cell-code hidden" id="cb2" data-startfrom="853" data-source-offset="0"><pre class="sourceCode numberSource js number-lines code-with-copy"><code class="sourceCode javascript" style="counter-reset: source-line 852;"><span id="cb2-853"><a href></a>d3 <span class="op">=</span> <span class="pp">require</span>(<span class="st">&quot;d3@7&quot;</span>)</span></code><button title="Copy to Clipboard" class="code-copy-button"><i class="bi"></i></button></pre></div>
<div class="cell-output cell-output-display">
<div id="ojs-cell-1" data-nodetype="declaration">
</div>
</div>
</div>
<div class="cell">
<div class="sourceCode cell-code hidden" id="cb3" data-startfrom="857" data-source-offset="0"><pre class="sourceCode numberSource js number-lines code-with-copy"><code class="sourceCode javascript" style="counter-reset: source-line 856;"><span id="cb3-857"><a href></a>cdf_data <span class="op">=</span> <span class="fu">FileAttachment</span>(<span class="st">&quot;assets/crps_learning/weights_plot/cdf_data.csv&quot;</span>)<span class="op">.</span><span class="fu">csv</span>({ <span class="dt">typed</span><span class="op">:</span> <span class="kw">true</span> })</span></code><button title="Copy to Clipboard" class="code-copy-button"><i class="bi"></i></button></pre></div>
<div class="cell-output cell-output-display">
<div id="ojs-cell-2" data-nodetype="declaration">
</div>
</div>
</div>
<div class="cell">
<div class="sourceCode cell-code hidden" id="cb4" data-startfrom="862" data-source-offset="-0"><pre class="sourceCode numberSource js number-lines code-with-copy"><code class="sourceCode javascript" style="counter-reset: source-line 861;"><span id="cb4-862"><a href></a><span class="kw">function</span> <span class="fu">updateChartInner</span>(g<span class="op">,</span> x<span class="op">,</span> y<span class="op">,</span> linesGroup<span class="op">,</span> color<span class="op">,</span> line<span class="op">,</span> data) {</span>
<span id="cb4-863"><a href></a> <span class="co">// Update axes with transitions</span></span>
<span id="cb4-864"><a href></a> x<span class="op">.</span><span class="fu">domain</span>(d3<span class="op">.</span><span class="fu">extent</span>(data<span class="op">,</span> d <span class="kw">=&gt;</span> d<span class="op">.</span><span class="at">x</span>))<span class="op">;</span></span>
<span id="cb4-865"><a href></a> g<span class="op">.</span><span class="fu">select</span>(<span class="st">&quot;.x-axis&quot;</span>)<span class="op">.</span><span class="fu">transition</span>()<span class="op">.</span><span class="fu">duration</span>(<span class="dv">1500</span>)<span class="op">.</span><span class="fu">call</span>(d3<span class="op">.</span><span class="fu">axisBottom</span>(x)<span class="op">.</span><span class="fu">ticks</span>(<span class="dv">10</span>))<span class="op">;</span></span>
<span id="cb4-866"><a href></a> y<span class="op">.</span><span class="fu">domain</span>([<span class="dv">0</span><span class="op">,</span> d3<span class="op">.</span><span class="fu">max</span>(data<span class="op">,</span> d <span class="kw">=&gt;</span> d<span class="op">.</span><span class="at">y</span>)])<span class="op">;</span></span>
<span id="cb4-867"><a href></a> g<span class="op">.</span><span class="fu">select</span>(<span class="st">&quot;.y-axis&quot;</span>)<span class="op">.</span><span class="fu">transition</span>()<span class="op">.</span><span class="fu">duration</span>(<span class="dv">1500</span>)<span class="op">.</span><span class="fu">call</span>(d3<span class="op">.</span><span class="fu">axisLeft</span>(y)<span class="op">.</span><span class="fu">ticks</span>(<span class="dv">5</span>))<span class="op">;</span></span>
<span id="cb4-868"><a href></a></span>
<span id="cb4-869"><a href></a> <span class="co">// Group data by basis function</span></span>
<span id="cb4-870"><a href></a> <span class="kw">const</span> dataByFunction <span class="op">=</span> <span class="bu">Array</span><span class="op">.</span><span class="fu">from</span>(d3<span class="op">.</span><span class="fu">group</span>(data<span class="op">,</span> d <span class="kw">=&gt;</span> d<span class="op">.</span><span class="at">b</span>))<span class="op">;</span></span>
<span id="cb4-871"><a href></a> <span class="kw">const</span> keyFn <span class="op">=</span> d <span class="kw">=&gt;</span> d[<span class="dv">0</span>]<span class="op">;</span></span>
<span id="cb4-872"><a href></a></span>
<span id="cb4-873"><a href></a> <span class="co">// Update basis function lines</span></span>
<span id="cb4-874"><a href></a> <span class="kw">const</span> u <span class="op">=</span> linesGroup<span class="op">.</span><span class="fu">selectAll</span>(<span class="st">&quot;path&quot;</span>)<span class="op">.</span><span class="fu">data</span>(dataByFunction<span class="op">,</span> keyFn)<span class="op">;</span></span>
<span id="cb4-875"><a href></a> u<span class="op">.</span><span class="fu">join</span>(</span>
<span id="cb4-876"><a href></a> enter <span class="kw">=&gt;</span> enter<span class="op">.</span><span class="fu">append</span>(<span class="st">&quot;path&quot;</span>)<span class="op">.</span><span class="fu">attr</span>(<span class="st">&quot;fill&quot;</span><span class="op">,</span><span class="st">&quot;none&quot;</span>)<span class="op">.</span><span class="fu">attr</span>(<span class="st">&quot;stroke-width&quot;</span><span class="op">,</span><span class="dv">3</span>)</span>
<span id="cb4-877"><a href></a> <span class="op">.</span><span class="fu">attr</span>(<span class="st">&quot;stroke&quot;</span><span class="op">,</span> (_<span class="op">,</span> i) <span class="kw">=&gt;</span> <span class="fu">color</span>(i))<span class="op">.</span><span class="fu">attr</span>(<span class="st">&quot;d&quot;</span><span class="op">,</span> d <span class="kw">=&gt;</span> <span class="fu">line</span>(d[<span class="dv">1</span>]<span class="op">.</span><span class="fu">map</span>(pt <span class="kw">=&gt;</span> ({<span class="dt">x</span><span class="op">:</span> pt<span class="op">.</span><span class="at">x</span><span class="op">,</span> <span class="dt">y</span><span class="op">:</span> <span class="dv">0</span>}))))</span>
<span id="cb4-878"><a href></a> <span class="op">.</span><span class="fu">style</span>(<span class="st">&quot;opacity&quot;</span><span class="op">,</span><span class="dv">0</span>)<span class="op">,</span></span>
<span id="cb4-879"><a href></a> update <span class="kw">=&gt;</span> update<span class="op">,</span></span>
<span id="cb4-880"><a href></a> exit <span class="kw">=&gt;</span> exit<span class="op">.</span><span class="fu">transition</span>()<span class="op">.</span><span class="fu">duration</span>(<span class="dv">1000</span>)<span class="op">.</span><span class="fu">style</span>(<span class="st">&quot;opacity&quot;</span><span class="op">,</span><span class="dv">0</span>)<span class="op">.</span><span class="fu">remove</span>()</span>
<span id="cb4-881"><a href></a> )</span>
<span id="cb4-882"><a href></a> <span class="op">.</span><span class="fu">transition</span>()<span class="op">.</span><span class="fu">duration</span>(<span class="dv">1000</span>)</span>
<span id="cb4-883"><a href></a> <span class="op">.</span><span class="fu">attr</span>(<span class="st">&quot;d&quot;</span><span class="op">,</span> d <span class="kw">=&gt;</span> <span class="fu">line</span>(d[<span class="dv">1</span>]))</span>
<span id="cb4-884"><a href></a> <span class="op">.</span><span class="fu">attr</span>(<span class="st">&quot;stroke&quot;</span><span class="op">,</span> (_<span class="op">,</span> i) <span class="kw">=&gt;</span> <span class="fu">color</span>(i))</span>
<span id="cb4-885"><a href></a> <span class="op">.</span><span class="fu">style</span>(<span class="st">&quot;opacity&quot;</span><span class="op">,</span><span class="dv">1</span>)<span class="op">;</span></span>
<span id="cb4-886"><a href></a>}</span>
<span id="cb4-887"><a href></a></span>
<span id="cb4-888"><a href></a>chart <span class="op">=</span> {</span>
<span id="cb4-889"><a href></a> <span class="co">// State variable for selected mu parameter</span></span>
<span id="cb4-890"><a href></a> <span class="kw">let</span> selectedMu <span class="op">=</span> <span class="dv">1</span><span class="op">;</span></span>
<span id="cb4-891"><a href></a> </span>
<span id="cb4-892"><a href></a> <span class="kw">const</span> filteredData <span class="op">=</span> () <span class="kw">=&gt;</span> cdf_data<span class="op">.</span><span class="fu">filter</span>(d <span class="kw">=&gt;</span></span>
<span id="cb4-893"><a href></a> <span class="bu">Math</span><span class="op">.</span><span class="fu">abs</span>(selectedMu <span class="op">-</span> d<span class="op">.</span><span class="at">mu</span>) <span class="op">&lt;</span> <span class="fl">0.001</span></span>
<span id="cb4-894"><a href></a> )<span class="op">;</span></span>
<span id="cb4-895"><a href></a> </span>
<span id="cb4-896"><a href></a> <span class="kw">const</span> container <span class="op">=</span> d3<span class="op">.</span><span class="fu">create</span>(<span class="st">&quot;div&quot;</span>)</span>
<span id="cb4-897"><a href></a> <span class="op">.</span><span class="fu">style</span>(<span class="st">&quot;max-width&quot;</span><span class="op">,</span> <span class="st">&quot;none&quot;</span>)</span>
<span id="cb4-898"><a href></a> <span class="op">.</span><span class="fu">style</span>(<span class="st">&quot;width&quot;</span><span class="op">,</span> <span class="st">&quot;100%&quot;</span>)<span class="op">;</span></span>
<span id="cb4-899"><a href></a> </span>
<span id="cb4-900"><a href></a> <span class="kw">const</span> controlsContainer <span class="op">=</span> container<span class="op">.</span><span class="fu">append</span>(<span class="st">&quot;div&quot;</span>)</span>
<span id="cb4-901"><a href></a> <span class="op">.</span><span class="fu">style</span>(<span class="st">&quot;display&quot;</span><span class="op">,</span> <span class="st">&quot;flex&quot;</span>)</span>
<span id="cb4-902"><a href></a> <span class="op">.</span><span class="fu">style</span>(<span class="st">&quot;gap&quot;</span><span class="op">,</span> <span class="st">&quot;20px&quot;</span>)</span>
<span id="cb4-903"><a href></a> <span class="op">.</span><span class="fu">style</span>(<span class="st">&quot;align-items&quot;</span><span class="op">,</span> <span class="st">&quot;center&quot;</span>)<span class="op">;</span></span>
<span id="cb4-904"><a href></a> </span>
<span id="cb4-905"><a href></a> <span class="co">// Single slider control for mu</span></span>
<span id="cb4-906"><a href></a> <span class="kw">const</span> sliderContainer <span class="op">=</span> controlsContainer<span class="op">.</span><span class="fu">append</span>(<span class="st">&#39;div&#39;</span>)</span>
<span id="cb4-907"><a href></a> <span class="op">.</span><span class="fu">style</span>(<span class="st">&#39;display&#39;</span><span class="op">,</span><span class="st">&#39;flex&#39;</span>)</span>
<span id="cb4-908"><a href></a> <span class="op">.</span><span class="fu">style</span>(<span class="st">&#39;align-items&#39;</span><span class="op">,</span><span class="st">&#39;center&#39;</span>)</span>
<span id="cb4-909"><a href></a> <span class="op">.</span><span class="fu">style</span>(<span class="st">&#39;gap&#39;</span><span class="op">,</span><span class="st">&#39;10px&#39;</span>)</span>
<span id="cb4-910"><a href></a> <span class="op">.</span><span class="fu">style</span>(<span class="st">&#39;flex&#39;</span><span class="op">,</span><span class="st">&#39;1&#39;</span>)<span class="op">;</span></span>
<span id="cb4-911"><a href></a> </span>
<span id="cb4-912"><a href></a> sliderContainer<span class="op">.</span><span class="fu">append</span>(<span class="st">&#39;label&#39;</span>)</span>
<span id="cb4-913"><a href></a> <span class="op">.</span><span class="fu">text</span>(<span class="st">&#39;Naive:&#39;</span>)</span>
<span id="cb4-914"><a href></a> <span class="op">.</span><span class="fu">style</span>(<span class="st">&#39;font-size&#39;</span><span class="op">,</span><span class="st">&#39;20px&#39;</span>)<span class="op">;</span></span>
<span id="cb4-915"><a href></a> </span>
<span id="cb4-916"><a href></a> <span class="kw">const</span> muSlider <span class="op">=</span> sliderContainer<span class="op">.</span><span class="fu">append</span>(<span class="st">&#39;input&#39;</span>)</span>
<span id="cb4-917"><a href></a> <span class="op">.</span><span class="fu">attr</span>(<span class="st">&#39;type&#39;</span><span class="op">,</span><span class="st">&#39;range&#39;</span>)</span>
<span id="cb4-918"><a href></a> <span class="op">.</span><span class="fu">attr</span>(<span class="st">&#39;min&#39;</span><span class="op">,</span> <span class="dv">0</span>)</span>
<span id="cb4-919"><a href></a> <span class="op">.</span><span class="fu">attr</span>(<span class="st">&#39;max&#39;</span><span class="op">,</span> <span class="dv">1</span>)</span>
<span id="cb4-920"><a href></a> <span class="op">.</span><span class="fu">attr</span>(<span class="st">&#39;step&#39;</span><span class="op">,</span> <span class="fl">0.1</span>)</span>
<span id="cb4-921"><a href></a> <span class="op">.</span><span class="fu">property</span>(<span class="st">&#39;value&#39;</span><span class="op">,</span> selectedMu)</span>
<span id="cb4-922"><a href></a> <span class="op">.</span><span class="fu">on</span>(<span class="st">&#39;input&#39;</span><span class="op">,</span> <span class="kw">function</span>(<span class="bu">event</span>) {</span>
<span id="cb4-923"><a href></a> selectedMu <span class="op">=</span> <span class="op">+</span><span class="kw">this</span><span class="op">.</span><span class="at">value</span><span class="op">;</span></span>
<span id="cb4-924"><a href></a> muDisplay<span class="op">.</span><span class="fu">text</span>(selectedMu<span class="op">.</span><span class="fu">toFixed</span>(<span class="dv">1</span>))<span class="op">;</span></span>
<span id="cb4-925"><a href></a> <span class="fu">updateChart</span>(<span class="fu">filteredData</span>())<span class="op">;</span></span>
<span id="cb4-926"><a href></a> })</span>
<span id="cb4-927"><a href></a> <span class="op">.</span><span class="fu">style</span>(<span class="st">&#39;width&#39;</span><span class="op">,</span> <span class="st">&#39;100%&#39;</span>)</span>
<span id="cb4-928"><a href></a> <span class="co">//.style(&#39;-webkit-appearance&#39;, &#39;none&#39;)</span></span>
<span id="cb4-929"><a href></a> <span class="op">.</span><span class="fu">style</span>(<span class="st">&#39;appearance&#39;</span><span class="op">,</span> <span class="st">&#39;none&#39;</span>)</span>
<span id="cb4-930"><a href></a> <span class="op">.</span><span class="fu">style</span>(<span class="st">&#39;height&#39;</span><span class="op">,</span> <span class="st">&#39;8px&#39;</span>)</span>
<span id="cb4-931"><a href></a> <span class="op">.</span><span class="fu">style</span>(<span class="st">&#39;background&#39;</span><span class="op">,</span> <span class="st">&#39;#BDBDBDFF&#39;</span>)<span class="op">;</span></span>
<span id="cb4-932"><a href></a> </span>
<span id="cb4-933"><a href></a> <span class="kw">const</span> muDisplay <span class="op">=</span> sliderContainer<span class="op">.</span><span class="fu">append</span>(<span class="st">&#39;span&#39;</span>)</span>
<span id="cb4-934"><a href></a> <span class="op">.</span><span class="fu">text</span>(selectedMu<span class="op">.</span><span class="fu">toFixed</span>(<span class="dv">1</span>))</span>
<span id="cb4-935"><a href></a> <span class="op">.</span><span class="fu">style</span>(<span class="st">&#39;font-size&#39;</span><span class="op">,</span><span class="st">&#39;20px&#39;</span>)<span class="op">;</span></span>
<span id="cb4-936"><a href></a> </span>
<span id="cb4-937"><a href></a> <span class="co">// Add Reset button</span></span>
<span id="cb4-938"><a href></a> controlsContainer<span class="op">.</span><span class="fu">append</span>(<span class="st">&#39;button&#39;</span>)</span>
<span id="cb4-939"><a href></a> <span class="op">.</span><span class="fu">text</span>(<span class="st">&#39;Reset&#39;</span>)</span>
<span id="cb4-940"><a href></a> <span class="op">.</span><span class="fu">style</span>(<span class="st">&#39;font-size&#39;</span><span class="op">,</span> <span class="st">&#39;20px&#39;</span>)</span>
<span id="cb4-941"><a href></a> <span class="op">.</span><span class="fu">style</span>(<span class="st">&#39;align-self&#39;</span><span class="op">,</span> <span class="st">&#39;center&#39;</span>)</span>
<span id="cb4-942"><a href></a> <span class="op">.</span><span class="fu">style</span>(<span class="st">&#39;margin-left&#39;</span><span class="op">,</span> <span class="st">&#39;auto&#39;</span>)</span>
<span id="cb4-943"><a href></a> <span class="op">.</span><span class="fu">on</span>(<span class="st">&#39;click&#39;</span><span class="op">,</span> () <span class="kw">=&gt;</span> {</span>
<span id="cb4-944"><a href></a> selectedMu <span class="op">=</span> <span class="fl">0.5</span><span class="op">;</span></span>
<span id="cb4-945"><a href></a> muSlider<span class="op">.</span><span class="fu">property</span>(<span class="st">&#39;value&#39;</span><span class="op">,</span> selectedMu)<span class="op">;</span></span>
<span id="cb4-946"><a href></a> muDisplay<span class="op">.</span><span class="fu">text</span>(selectedMu<span class="op">.</span><span class="fu">toFixed</span>(<span class="dv">1</span>))<span class="op">;</span></span>
<span id="cb4-947"><a href></a> <span class="fu">updateChart</span>(<span class="fu">filteredData</span>())<span class="op">;</span></span>
<span id="cb4-948"><a href></a> })<span class="op">;</span></span>
<span id="cb4-949"><a href></a></span>
<span id="cb4-950"><a href></a> <span class="co">// Build SVG</span></span>
<span id="cb4-951"><a href></a> <span class="kw">const</span> width <span class="op">=</span> <span class="dv">600</span><span class="op">;</span></span>
<span id="cb4-952"><a href></a> <span class="kw">const</span> height <span class="op">=</span> <span class="dv">450</span><span class="op">;</span></span>
<span id="cb4-953"><a href></a> <span class="kw">const</span> margin <span class="op">=</span> {<span class="dt">top</span><span class="op">:</span> <span class="dv">40</span><span class="op">,</span> <span class="dt">right</span><span class="op">:</span> <span class="dv">20</span><span class="op">,</span> <span class="dt">bottom</span><span class="op">:</span> <span class="dv">40</span><span class="op">,</span> <span class="dt">left</span><span class="op">:</span> <span class="dv">40</span>}<span class="op">;</span></span>
<span id="cb4-954"><a href></a> <span class="kw">const</span> innerWidth <span class="op">=</span> width <span class="op">-</span> margin<span class="op">.</span><span class="at">left</span> <span class="op">-</span> margin<span class="op">.</span><span class="at">right</span><span class="op">;</span></span>
<span id="cb4-955"><a href></a> <span class="kw">const</span> innerHeight <span class="op">=</span> height <span class="op">-</span> margin<span class="op">.</span><span class="at">top</span> <span class="op">-</span> margin<span class="op">.</span><span class="at">bottom</span><span class="op">;</span></span>
<span id="cb4-956"><a href></a></span>
<span id="cb4-957"><a href></a> <span class="co">// Set controls container width to match SVG plot width</span></span>
<span id="cb4-958"><a href></a> controlsContainer<span class="op">.</span><span class="fu">style</span>(<span class="st">&quot;max-width&quot;</span><span class="op">,</span> <span class="st">&quot;none&quot;</span>)<span class="op">.</span><span class="fu">style</span>(<span class="st">&quot;width&quot;</span><span class="op">,</span> <span class="st">&quot;100%&quot;</span>)<span class="op">;</span></span>
<span id="cb4-959"><a href></a> <span class="co">// Distribute each control evenly and make sliders full-width</span></span>
<span id="cb4-960"><a href></a> controlsContainer<span class="op">.</span><span class="fu">selectAll</span>(<span class="st">&quot;div&quot;</span>)<span class="op">.</span><span class="fu">style</span>(<span class="st">&quot;flex&quot;</span><span class="op">,</span> <span class="st">&quot;1&quot;</span>)<span class="op">.</span><span class="fu">style</span>(<span class="st">&quot;min-width&quot;</span><span class="op">,</span> <span class="st">&quot;0px&quot;</span>)<span class="op">;</span></span>
<span id="cb4-961"><a href></a> controlsContainer<span class="op">.</span><span class="fu">selectAll</span>(<span class="st">&quot;input&quot;</span>)<span class="op">.</span><span class="fu">style</span>(<span class="st">&quot;width&quot;</span><span class="op">,</span> <span class="st">&quot;100%&quot;</span>)<span class="op">.</span><span class="fu">style</span>(<span class="st">&quot;box-sizing&quot;</span><span class="op">,</span> <span class="st">&quot;border-box&quot;</span>)<span class="op">;</span></span>
<span id="cb4-962"><a href></a> </span>
<span id="cb4-963"><a href></a> <span class="co">// Create scales</span></span>
<span id="cb4-964"><a href></a> <span class="kw">const</span> x <span class="op">=</span> d3<span class="op">.</span><span class="fu">scaleLinear</span>()</span>
<span id="cb4-965"><a href></a> <span class="op">.</span><span class="fu">range</span>([<span class="dv">0</span><span class="op">,</span> innerWidth])<span class="op">;</span></span>
<span id="cb4-966"><a href></a> </span>
<span id="cb4-967"><a href></a> <span class="kw">const</span> y <span class="op">=</span> d3<span class="op">.</span><span class="fu">scaleLinear</span>()</span>
<span id="cb4-968"><a href></a> <span class="op">.</span><span class="fu">range</span>([innerHeight<span class="op">,</span> <span class="dv">0</span>])<span class="op">;</span></span>
<span id="cb4-969"><a href></a> </span>
<span id="cb4-970"><a href></a> <span class="co">// Create a color scale for the basis functions</span></span>
<span id="cb4-971"><a href></a> <span class="kw">const</span> color <span class="op">=</span> d3<span class="op">.</span><span class="fu">scaleOrdinal</span>([<span class="st">&quot;#80C684FF&quot;</span><span class="op">,</span> <span class="st">&quot;#FFD44EFF&quot;</span><span class="op">,</span> <span class="st">&quot;#D81A5FFF&quot;</span>])<span class="op">;</span></span>
<span id="cb4-972"><a href></a> </span>
<span id="cb4-973"><a href></a> <span class="co">// Create SVG</span></span>
<span id="cb4-974"><a href></a> <span class="kw">const</span> svg <span class="op">=</span> d3<span class="op">.</span><span class="fu">create</span>(<span class="st">&quot;svg&quot;</span>)</span>
<span id="cb4-975"><a href></a> <span class="op">.</span><span class="fu">attr</span>(<span class="st">&quot;width&quot;</span><span class="op">,</span> <span class="st">&quot;100%&quot;</span>)</span>
<span id="cb4-976"><a href></a> <span class="op">.</span><span class="fu">attr</span>(<span class="st">&quot;height&quot;</span><span class="op">,</span> <span class="st">&quot;auto&quot;</span>)</span>
<span id="cb4-977"><a href></a> <span class="op">.</span><span class="fu">attr</span>(<span class="st">&quot;viewBox&quot;</span><span class="op">,</span> [<span class="dv">0</span><span class="op">,</span> <span class="dv">0</span><span class="op">,</span> width<span class="op">,</span> height])</span>
<span id="cb4-978"><a href></a> <span class="op">.</span><span class="fu">attr</span>(<span class="st">&quot;preserveAspectRatio&quot;</span><span class="op">,</span> <span class="st">&quot;xMidYMid meet&quot;</span>)</span>
<span id="cb4-979"><a href></a> <span class="op">.</span><span class="fu">attr</span>(<span class="st">&quot;style&quot;</span><span class="op">,</span> <span class="st">&quot;max-width: 100%; height: auto;&quot;</span>)<span class="op">;</span></span>
<span id="cb4-980"><a href></a> </span>
<span id="cb4-981"><a href></a> <span class="co">// Create the chart group</span></span>
<span id="cb4-982"><a href></a> <span class="kw">const</span> g <span class="op">=</span> svg<span class="op">.</span><span class="fu">append</span>(<span class="st">&quot;g&quot;</span>)</span>
<span id="cb4-983"><a href></a> <span class="op">.</span><span class="fu">attr</span>(<span class="st">&quot;transform&quot;</span><span class="op">,</span> <span class="vs">`translate(</span><span class="sc">${</span>margin<span class="op">.</span><span class="at">left</span><span class="sc">}</span><span class="vs">,</span><span class="sc">${</span>margin<span class="op">.</span><span class="at">top</span><span class="sc">}</span><span class="vs">)`</span>)<span class="op">;</span></span>
<span id="cb4-984"><a href></a> </span>
<span id="cb4-985"><a href></a> <span class="co">// Add axes</span></span>
<span id="cb4-986"><a href></a> <span class="kw">const</span> xAxis <span class="op">=</span> g<span class="op">.</span><span class="fu">append</span>(<span class="st">&quot;g&quot;</span>)</span>
<span id="cb4-987"><a href></a> <span class="op">.</span><span class="fu">attr</span>(<span class="st">&quot;transform&quot;</span><span class="op">,</span> <span class="vs">`translate(0,</span><span class="sc">${</span>innerHeight<span class="sc">}</span><span class="vs">)`</span>)</span>
<span id="cb4-988"><a href></a> <span class="op">.</span><span class="fu">attr</span>(<span class="st">&quot;class&quot;</span><span class="op">,</span> <span class="st">&quot;x-axis&quot;</span>)</span>
<span id="cb4-989"><a href></a> <span class="op">.</span><span class="fu">call</span>(d3<span class="op">.</span><span class="fu">axisBottom</span>(x)<span class="op">.</span><span class="fu">ticks</span>(<span class="dv">10</span>))</span>
<span id="cb4-990"><a href></a> <span class="op">.</span><span class="fu">style</span>(<span class="st">&quot;font-size&quot;</span><span class="op">,</span> <span class="st">&quot;20px&quot;</span>)<span class="op">;</span></span>
<span id="cb4-991"><a href></a> </span>
<span id="cb4-992"><a href></a> <span class="kw">const</span> yAxis <span class="op">=</span> g<span class="op">.</span><span class="fu">append</span>(<span class="st">&quot;g&quot;</span>)</span>
<span id="cb4-993"><a href></a> <span class="op">.</span><span class="fu">attr</span>(<span class="st">&quot;class&quot;</span><span class="op">,</span> <span class="st">&quot;y-axis&quot;</span>)</span>
<span id="cb4-994"><a href></a> <span class="op">.</span><span class="fu">call</span>(d3<span class="op">.</span><span class="fu">axisLeft</span>(y)<span class="op">.</span><span class="fu">ticks</span>(<span class="dv">5</span>))</span>
<span id="cb4-995"><a href></a> <span class="op">.</span><span class="fu">style</span>(<span class="st">&quot;font-size&quot;</span><span class="op">,</span> <span class="st">&quot;20px&quot;</span>)<span class="op">;</span></span>
<span id="cb4-996"><a href></a> </span>
<span id="cb4-997"><a href></a> <span class="co">// Add a horizontal line at y = 0</span></span>
<span id="cb4-998"><a href></a> g<span class="op">.</span><span class="fu">append</span>(<span class="st">&quot;line&quot;</span>)</span>
<span id="cb4-999"><a href></a> <span class="op">.</span><span class="fu">attr</span>(<span class="st">&quot;x1&quot;</span><span class="op">,</span> <span class="dv">0</span>)</span>
<span id="cb4-1000"><a href></a> <span class="op">.</span><span class="fu">attr</span>(<span class="st">&quot;x2&quot;</span><span class="op">,</span> innerWidth)</span>
<span id="cb4-1001"><a href></a> <span class="op">.</span><span class="fu">attr</span>(<span class="st">&quot;y1&quot;</span><span class="op">,</span> <span class="fu">y</span>(<span class="dv">0</span>))</span>
<span id="cb4-1002"><a href></a> <span class="op">.</span><span class="fu">attr</span>(<span class="st">&quot;y2&quot;</span><span class="op">,</span> <span class="fu">y</span>(<span class="dv">0</span>))</span>
<span id="cb4-1003"><a href></a> <span class="op">.</span><span class="fu">attr</span>(<span class="st">&quot;stroke&quot;</span><span class="op">,</span> <span class="st">&quot;#000&quot;</span>)</span>
<span id="cb4-1004"><a href></a> <span class="op">.</span><span class="fu">attr</span>(<span class="st">&quot;stroke-opacity&quot;</span><span class="op">,</span> <span class="fl">0.2</span>)<span class="op">;</span></span>
<span id="cb4-1005"><a href></a> </span>
<span id="cb4-1006"><a href></a> <span class="co">// Add gridlines</span></span>
<span id="cb4-1007"><a href></a> g<span class="op">.</span><span class="fu">append</span>(<span class="st">&quot;g&quot;</span>)</span>
<span id="cb4-1008"><a href></a> <span class="op">.</span><span class="fu">attr</span>(<span class="st">&quot;class&quot;</span><span class="op">,</span> <span class="st">&quot;grid-lines&quot;</span>)</span>
<span id="cb4-1009"><a href></a> <span class="op">.</span><span class="fu">selectAll</span>(<span class="st">&quot;line&quot;</span>)</span>
<span id="cb4-1010"><a href></a> <span class="op">.</span><span class="fu">data</span>(y<span class="op">.</span><span class="fu">ticks</span>(<span class="dv">5</span>))</span>
<span id="cb4-1011"><a href></a> <span class="op">.</span><span class="fu">join</span>(<span class="st">&quot;line&quot;</span>)</span>
<span id="cb4-1012"><a href></a> <span class="op">.</span><span class="fu">attr</span>(<span class="st">&quot;x1&quot;</span><span class="op">,</span> <span class="dv">0</span>)</span>
<span id="cb4-1013"><a href></a> <span class="op">.</span><span class="fu">attr</span>(<span class="st">&quot;x2&quot;</span><span class="op">,</span> innerWidth)</span>
<span id="cb4-1014"><a href></a> <span class="op">.</span><span class="fu">attr</span>(<span class="st">&quot;y1&quot;</span><span class="op">,</span> d <span class="kw">=&gt;</span> <span class="fu">y</span>(d))</span>
<span id="cb4-1015"><a href></a> <span class="op">.</span><span class="fu">attr</span>(<span class="st">&quot;y2&quot;</span><span class="op">,</span> d <span class="kw">=&gt;</span> <span class="fu">y</span>(d))</span>
<span id="cb4-1016"><a href></a> <span class="op">.</span><span class="fu">attr</span>(<span class="st">&quot;stroke&quot;</span><span class="op">,</span> <span class="st">&quot;#ccc&quot;</span>)</span>
<span id="cb4-1017"><a href></a> <span class="op">.</span><span class="fu">attr</span>(<span class="st">&quot;stroke-opacity&quot;</span><span class="op">,</span> <span class="fl">0.5</span>)<span class="op">;</span></span>
<span id="cb4-1018"><a href></a> </span>
<span id="cb4-1019"><a href></a> <span class="co">// Create a line generator</span></span>
<span id="cb4-1020"><a href></a> <span class="kw">const</span> line <span class="op">=</span> d3<span class="op">.</span><span class="fu">line</span>()</span>
<span id="cb4-1021"><a href></a> <span class="op">.</span><span class="fu">x</span>(d <span class="kw">=&gt;</span> <span class="fu">x</span>(d<span class="op">.</span><span class="at">x</span>))</span>
<span id="cb4-1022"><a href></a> <span class="op">.</span><span class="fu">y</span>(d <span class="kw">=&gt;</span> <span class="fu">y</span>(d<span class="op">.</span><span class="at">y</span>))</span>
<span id="cb4-1023"><a href></a> <span class="op">.</span><span class="fu">curve</span>(d3<span class="op">.</span><span class="at">curveBasis</span>)<span class="op">;</span></span>
<span id="cb4-1024"><a href></a> </span>
<span id="cb4-1025"><a href></a> <span class="co">// Group to contain the basis function lines</span></span>
<span id="cb4-1026"><a href></a> <span class="kw">const</span> linesGroup <span class="op">=</span> g<span class="op">.</span><span class="fu">append</span>(<span class="st">&quot;g&quot;</span>)</span>
<span id="cb4-1027"><a href></a> <span class="op">.</span><span class="fu">attr</span>(<span class="st">&quot;class&quot;</span><span class="op">,</span> <span class="st">&quot;basis-functions&quot;</span>)<span class="op">;</span></span>
<span id="cb4-1028"><a href></a> </span>
<span id="cb4-1029"><a href></a> <span class="co">// Store the current basis functions for transition</span></span>
<span id="cb4-1030"><a href></a> <span class="kw">let</span> currentBasisFunctions <span class="op">=</span> <span class="kw">new</span> <span class="bu">Map</span>()<span class="op">;</span></span>
<span id="cb4-1031"><a href></a> </span>
<span id="cb4-1032"><a href></a> <span class="co">// Function to update the chart with new data</span></span>
<span id="cb4-1033"><a href></a> <span class="kw">function</span> <span class="fu">updateChart</span>(data) {</span>
<span id="cb4-1034"><a href></a> <span class="fu">updateChartInner</span>(g<span class="op">,</span> x<span class="op">,</span> y<span class="op">,</span> linesGroup<span class="op">,</span> color<span class="op">,</span> line<span class="op">,</span> data)<span class="op">;</span></span>
<span id="cb4-1035"><a href></a> }</span>
<span id="cb4-1036"><a href></a> </span>
<span id="cb4-1037"><a href></a> <span class="co">// Store the update function</span></span>
<span id="cb4-1038"><a href></a> svg<span class="op">.</span><span class="fu">node</span>()<span class="op">.</span><span class="at">update</span> <span class="op">=</span> updateChart<span class="op">;</span></span>
<span id="cb4-1039"><a href></a> </span>
<span id="cb4-1040"><a href></a> <span class="co">// Initial render</span></span>
<span id="cb4-1041"><a href></a> <span class="fu">updateChart</span>(<span class="fu">filteredData</span>())<span class="op">;</span></span>
<span id="cb4-1042"><a href></a> </span>
<span id="cb4-1043"><a href></a> container<span class="op">.</span><span class="fu">node</span>()<span class="op">.</span><span class="fu">appendChild</span>(svg<span class="op">.</span><span class="fu">node</span>())<span class="op">;</span></span>
<span id="cb4-1044"><a href></a> <span class="cf">return</span> container<span class="op">.</span><span class="fu">node</span>()<span class="op">;</span></span>
<span id="cb4-1045"><a href></a>}</span></code><button title="Copy to Clipboard" class="code-copy-button"><i class="bi"></i></button></pre></div>
<div class="cell-output cell-output-display">
<div> <div>
<figure> <div id="ojs-cell-3-1" data-nodetype="declaration">
<p><img role="img" data-src="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0nMS4wJyBlbmNvZGluZz0nVVRGLTgnID8+CjxzdmcgeG1sbnM9J2h0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnJyB4bWxuczp4bGluaz0naHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluaycgY2xhc3M9J3N2Z2xpdGUnIHdpZHRoPSc3MjAuMDBwdCcgaGVpZ2h0PSc0MzIuMDBwdCcgdmlld0JveD0nMCAwIDcyMC4wMCA0MzIuMDAnPgo8ZGVmcz4KICA8c3R5bGUgdHlwZT0ndGV4dC9jc3MnPjwhW0NEQVRBWwogICAgLnN2Z2xpdGUgbGluZSwgLnN2Z2xpdGUgcG9seWxpbmUsIC5zdmdsaXRlIHBvbHlnb24sIC5zdmdsaXRlIHBhdGgsIC5zdmdsaXRlIHJlY3QsIC5zdmdsaXRlIGNpcmNsZSB7CiAgICAgIGZpbGw6IG5vbmU7CiAgICAgIHN0cm9rZTogIzAwMDAwMDsKICAgICAgc3Ryb2tlLWxpbmVjYXA6IHJvdW5kOwogICAgICBzdHJva2UtbGluZWpvaW46IHJvdW5kOwogICAgICBzdHJva2UtbWl0ZXJsaW1pdDogMTAuMDA7CiAgICB9CiAgICAuc3ZnbGl0ZSB0ZXh0IHsKICAgICAgd2hpdGUtc3BhY2U6IHByZTsKICAgIH0KICBdXT48L3N0eWxlPgo8L2RlZnM+CjxyZWN0IHdpZHRoPScxMDAlJyBoZWlnaHQ9JzEwMCUnIHN0eWxlPSdzdHJva2U6IG5vbmU7IGZpbGw6ICNGRkZGRkY7Jy8+CjxkZWZzPgogIDxjbGlwUGF0aCBpZD0nY3BNQzR3TUh3M01qQXVNREI4TUM0d01IdzBNekl1TURBPSc+CiAgICA8cmVjdCB4PScwLjAwJyB5PScwLjAwJyB3aWR0aD0nNzIwLjAwJyBoZWlnaHQ9JzQzMi4wMCcgLz4KICA8L2NsaXBQYXRoPgo8L2RlZnM+CjxnIGNsaXAtcGF0aD0ndXJsKCNjcE1DNHdNSHczTWpBdU1EQjhNQzR3TUh3ME16SXVNREE9KSc+CjwvZz4KPGRlZnM+CiAgPGNsaXBQYXRoIGlkPSdjcE1Ua3VNREY4TWpJd0xqazVmREU1TGpBeGZERXlOQzQ1T1E9PSc+CiAgICA8cmVjdCB4PScxOS4wMScgeT0nMTkuMDEnIHdpZHRoPScyMDEuOTgnIGhlaWdodD0nMTA1Ljk4JyAvPgogIDwvY2xpcFBhdGg+CjwvZGVmcz4KPGcgY2xpcC1wYXRoPSd1cmwoI2NwTVRrdU1ERjhNakl3TGprNWZERTVMakF4ZkRFeU5DNDVPUT09KSc+Cjxwb2x5bGluZSBwb2ludHM9JzI2LjQ5LDEyMS4wNyAzMi43MiwxMjAuMjcgMzguOTYsMTEzLjM3IDQ1LjE5LDk3LjQzIDUxLjQzLDc1Ljc1IDU3LjY2LDUzLjk2IDYzLjg5LDM2LjY2IDcwLjEzLDI2LjIzIDc2LjM2LDIyLjkzIDgyLjYwLDI1LjczIDg4LjgzLDMyLjkzIDk1LjA2LDQyLjgwIDEwMS4zMCw1My44MyAxMDcuNTMsNjQuOTAgMTEzLjc3LDc1LjI0IDEyMC4wMCw4NC40NCAxMjYuMjMsOTIuMzEgMTMyLjQ3LDk4Ljg0IDEzOC43MCwxMDQuMTIgMTQ0Ljk0LDEwOC4zMSAxNTEuMTcsMTExLjU2IDE1Ny40MCwxMTQuMDYgMTYzLjY0LDExNS45NSAxNjkuODcsMTE3LjM2IDE3Ni4xMSwxMTguNDAgMTgyLjM0LDExOS4xNiAxODguNTcsMTE5LjcyIDE5NC44MSwxMjAuMTEgMjAxLjA0LDEyMC40MCAyMDcuMjgsMTIwLjYwIDIxMy41MSwxMjAuNzQgJyBzdHlsZT0nc3Ryb2tlLXdpZHRoOiAzLjAwOyBzdHJva2U6ICMyMDUwRjA7JyAvPgo8L2c+CjxkZWZzPgogIDxjbGlwUGF0aCBpZD0nY3BNQzR3TUh3eU5EQXVNREI4TUM0d01Id3hORFF1TURBPSc+CiAgICA8cmVjdCB4PScwLjAwJyB5PScwLjAwJyB3aWR0aD0nMjQwLjAwJyBoZWlnaHQ9JzE0NC4wMCcgLz4KICA8L2NsaXBQYXRoPgo8L2RlZnM+CjxnIGNsaXAtcGF0aD0ndXJsKCNjcE1DNHdNSHd5TkRBdU1EQjhNQzR3TUh3eE5EUXVNREE9KSc+CjwvZz4KPGRlZnM+CiAgPGNsaXBQYXRoIGlkPSdjcE1qVTVMakF4ZkRRMk1DNDVPWHd4T1M0d01Yd3hNalF1T1RrPSc+CiAgICA8cmVjdCB4PScyNTkuMDEnIHk9JzE5LjAxJyB3aWR0aD0nMjAxLjk4JyBoZWlnaHQ9JzEwNS45OCcgLz4KICA8L2NsaXBQYXRoPgo8L2RlZnM+CjxnIGNsaXAtcGF0aD0ndXJsKCNjcE1qVTVMakF4ZkRRMk1DNDVPWHd4T1M0d01Yd3hNalF1T1RrPSknPgo8cG9seWxpbmUgcG9pbnRzPScyNjYuNDksMTIxLjA3IDI3Mi43MiwxMjAuMjAgMjc4Ljk2LDExOC43OSAyODUuMTksMTE2LjYwIDI5MS40MywxMTMuMzQgMjk3LjY2LDEwOC43NCAzMDMuODksMTAyLjUzIDMxMC4xMyw5NC41OCAzMTYuMzYsODQuOTIgMzIyLjYwLDczLjg3IDMyOC44Myw2MS45OCAzMzUuMDYsNTAuMTEgMzQxLjMwLDM5LjI4IDM0Ny41MywzMC41NiAzNTMuNzcsMjQuOTAgMzYwLjAwLDIyLjkzIDM2Ni4yMywyNC45MCAzNzIuNDcsMzAuNTYgMzc4LjcwLDM5LjI4IDM4NC45NCw1MC4xMSAzOTEuMTcsNjEuOTggMzk3LjQwLDczLjg3IDQwMy42NCw4NC45MiA0MDkuODcsOTQuNTggNDE2LjExLDEwMi41MyA0MjIuMzQsMTA4Ljc0IDQyOC41NywxMTMuMzQgNDM0LjgxLDExNi42MCA0NDEuMDQsMTE4Ljc5IDQ0Ny4yOCwxMjAuMjAgNDUzLjUxLDEyMS4wNyAnIHN0eWxlPSdzdHJva2Utd2lkdGg6IDMuMDA7IHN0cm9rZTogI0EwMjBGMDsnIC8+CjwvZz4KPGRlZnM+CiAgPGNsaXBQYXRoIGlkPSdjcE1qUXdMakF3ZkRRNE1DNHdNSHd3TGpBd2ZERTBOQzR3TUE9PSc+CiAgICA8cmVjdCB4PScyNDAuMDAnIHk9JzAuMDAnIHdpZHRoPScyNDAuMDAnIGhlaWdodD0nMTQ0LjAwJyAvPgogIDwvY2xpcFBhdGg+CjwvZGVmcz4KPGcgY2xpcC1wYXRoPSd1cmwoI2NwTWpRd0xqQXdmRFE0TUM0d01Id3dMakF3ZkRFME5DNHdNQT09KSc+CjwvZz4KPGRlZnM+CiAgPGNsaXBQYXRoIGlkPSdjcE5EazVMakF4ZkRjd01DNDVPWHd4T1M0d01Yd3hNalF1T1RrPSc+CiAgICA8cmVjdCB4PSc0OTkuMDEnIHk9JzE5LjAxJyB3aWR0aD0nMjAxLjk4JyBoZWlnaHQ9JzEwNS45OCcgLz4KICA8L2NsaXBQYXRoPgo8L2RlZnM+CjxnIGNsaXAtcGF0aD0ndXJsKCNjcE5EazVMakF4ZkRjd01DNDVPWHd4T1M0d01Yd3hNalF1T1RrPSknPgo8cG9seWxpbmUgcG9pbnRzPSc1MDYuNDksMjIuOTMgNTEyLjcyLDQwLjc3IDUxOC45Niw1NS4zNyA1MjUuMTksNjcuMzIgNTMxLjQzLDc3LjExIDUzNy42Niw4NS4xMiA1NDMuODksOTEuNjggNTUwLjEzLDk3LjA1IDU1Ni4zNiwxMDEuNDUgNTYyLjYwLDEwNS4wNSA1NjguODMsMTA4LjAwIDU3NS4wNiwxMTAuNDEgNTgxLjMwLDExMi4zOSA1ODcuNTMsMTE0LjAwIDU5My43NywxMTUuMzMgNjAwLjAwLDExNi40MSA2MDYuMjMsMTE3LjMwIDYxMi40NywxMTguMDMgNjE4LjcwLDExOC42MiA2MjQuOTQsMTE5LjExIDYzMS4xNywxMTkuNTEgNjM3LjQwLDExOS44NCA2NDMuNjQsMTIwLjEwIDY0OS44NywxMjAuMzIgNjU2LjExLDEyMC41MCA2NjIuMzQsMTIwLjY1IDY2OC41NywxMjAuNzcgNjc0LjgxLDEyMC44NyA2ODEuMDQsMTIwLjk1IDY4Ny4yOCwxMjEuMDEgNjkzLjUxLDEyMS4wNyAnIHN0eWxlPSdzdHJva2Utd2lkdGg6IDMuMDA7IHN0cm9rZTogI0U0MjNCNDsnIC8+CjwvZz4KPGRlZnM+CiAgPGNsaXBQYXRoIGlkPSdjcE5EZ3dMakF3ZkRjeU1DNHdNSHd3TGpBd2ZERTBOQzR3TUE9PSc+CiAgICA8cmVjdCB4PSc0ODAuMDAnIHk9JzAuMDAnIHdpZHRoPScyNDAuMDAnIGhlaWdodD0nMTQ0LjAwJyAvPgogIDwvY2xpcFBhdGg+CjwvZGVmcz4KPGcgY2xpcC1wYXRoPSd1cmwoI2NwTkRnd0xqQXdmRGN5TUM0d01Id3dMakF3ZkRFME5DNHdNQT09KSc+CjwvZz4KPGRlZnM+CiAgPGNsaXBQYXRoIGlkPSdjcE1Ua3VNREY4TWpJd0xqazVmREUyTXk0d01Yd3lOamd1T1RrPSc+CiAgICA8cmVjdCB4PScxOS4wMScgeT0nMTYzLjAxJyB3aWR0aD0nMjAxLjk4JyBoZWlnaHQ9JzEwNS45OCcgLz4KLine truncated
</figure> </div>
</div>
</div>
<div class="cell-output cell-output-display">
<div>
<div id="ojs-cell-3-2" data-nodetype="declaration">
</div>
</div> </div>
</div> </div>
</div> </div>
@@ -27024,221 +27234,205 @@ Y_{t} = \mu + Y_{t-1} + \varepsilon_t \quad \text{with} \quad \varepsilon_t = \
<div class="tab-content"> <div class="tab-content">
<div id="tabset-12-1"> <div id="tabset-12-1">
<div class="cell"> <div class="cell">
<div class="sourceCode cell-code hidden" id="cb2" data-startfrom="2590" data-source-offset="0"><pre class="sourceCode numberSource js number-lines code-with-copy"><code class="sourceCode javascript" style="counter-reset: source-line 2589;"><span id="cb2-2590"><a href></a>d3 <span class="op">=</span> <span class="pp">require</span>(<span class="st">&quot;d3@7&quot;</span>)</span></code><button title="Copy to Clipboard" class="code-copy-button"><i class="bi"></i></button></pre></div> <div class="sourceCode cell-code hidden" id="cb5" data-startfrom="2712" data-source-offset="0"><pre class="sourceCode numberSource js number-lines code-with-copy"><code class="sourceCode javascript" style="counter-reset: source-line 2711;"><span id="cb5-2712"><a href></a>bsplineData <span class="op">=</span> <span class="fu">FileAttachment</span>(<span class="st">&quot;assets/mcrps_learning/basis_functions.csv&quot;</span>)<span class="op">.</span><span class="fu">csv</span>({ <span class="dt">typed</span><span class="op">:</span> <span class="kw">true</span> })</span></code><button title="Copy to Clipboard" class="code-copy-button"><i class="bi"></i></button></pre></div>
<div class="cell-output cell-output-display"> <div class="cell-output cell-output-display">
<div id="ojs-cell-1" data-nodetype="declaration"> <div id="ojs-cell-4" data-nodetype="declaration">
</div> </div>
</div> </div>
</div> </div>
<div class="cell"> <div class="cell">
<div class="sourceCode cell-code hidden" id="cb3" data-startfrom="2594" data-source-offset="0"><pre class="sourceCode numberSource js number-lines code-with-copy"><code class="sourceCode javascript" style="counter-reset: source-line 2593;"><span id="cb3-2594"><a href></a>bsplineData <span class="op">=</span> <span class="fu">FileAttachment</span>(<span class="st">&quot;assets/mcrps_learning/basis_functions.csv&quot;</span>)<span class="op">.</span><span class="fu">csv</span>({ <span class="dt">typed</span><span class="op">:</span> <span class="kw">true</span> })</span></code><button title="Copy to Clipboard" class="code-copy-button"><i class="bi"></i></button></pre></div> <div class="sourceCode cell-code hidden" id="cb6" data-startfrom="2716" data-source-offset="0"><pre class="sourceCode numberSource js number-lines code-with-copy"><code class="sourceCode javascript" style="counter-reset: source-line 2715;"><span id="cb6-2716"><a href></a><span class="co">// Defined above</span></span>
<span id="cb6-2717"><a href></a><span class="co">// function updateChartInner(g, x, y, linesGroup, color, line, data) {</span></span>
<span id="cb6-2718"><a href></a><span class="co">// // Update axes with transitions</span></span>
<span id="cb6-2719"><a href></a><span class="co">// x.domain([0, d3.max(data, d =&gt; d.x)]);</span></span>
<span id="cb6-2720"><a href></a><span class="co">// g.select(&quot;.x-axis&quot;).transition().duration(1500).call(d3.axisBottom(x).ticks(10));</span></span>
<span id="cb6-2721"><a href></a><span class="co">// y.domain([0, d3.max(data, d =&gt; d.y)]);</span></span>
<span id="cb6-2722"><a href></a><span class="co">// g.select(&quot;.y-axis&quot;).transition().duration(1500).call(d3.axisLeft(y).ticks(5));</span></span>
<span id="cb6-2723"><a href></a></span>
<span id="cb6-2724"><a href></a><span class="co">// // Group data by basis function</span></span>
<span id="cb6-2725"><a href></a><span class="co">// const dataByFunction = Array.from(d3.group(data, d =&gt; d.b));</span></span>
<span id="cb6-2726"><a href></a><span class="co">// const keyFn = d =&gt; d[0];</span></span>
<span id="cb6-2727"><a href></a></span>
<span id="cb6-2728"><a href></a><span class="co">// // Update basis function lines</span></span>
<span id="cb6-2729"><a href></a><span class="co">// const u = linesGroup.selectAll(&quot;path&quot;).data(dataByFunction, keyFn);</span></span>
<span id="cb6-2730"><a href></a><span class="co">// u.join(</span></span>
<span id="cb6-2731"><a href></a><span class="co">// enter =&gt; enter.append(&quot;path&quot;).attr(&quot;fill&quot;,&quot;none&quot;).attr(&quot;stroke-width&quot;,3)</span></span>
<span id="cb6-2732"><a href></a><span class="co">// .attr(&quot;stroke&quot;, (_, i) =&gt; color(i)).attr(&quot;d&quot;, d =&gt; line(d[1].map(pt =&gt; ({x: pt.x, y: 0}))))</span></span>
<span id="cb6-2733"><a href></a><span class="co">// .style(&quot;opacity&quot;,0),</span></span>
<span id="cb6-2734"><a href></a><span class="co">// update =&gt; update,</span></span>
<span id="cb6-2735"><a href></a><span class="co">// exit =&gt; exit.transition().duration(1000).style(&quot;opacity&quot;,0).remove()</span></span>
<span id="cb6-2736"><a href></a><span class="co">// )</span></span>
<span id="cb6-2737"><a href></a><span class="co">// .transition().duration(1000)</span></span>
<span id="cb6-2738"><a href></a><span class="co">// .attr(&quot;d&quot;, d =&gt; line(d[1]))</span></span>
<span id="cb6-2739"><a href></a><span class="co">// .attr(&quot;stroke&quot;, (_, i) =&gt; color(i))</span></span>
<span id="cb6-2740"><a href></a><span class="co">// .style(&quot;opacity&quot;,1);</span></span>
<span id="cb6-2741"><a href></a><span class="co">// }</span></span>
<span id="cb6-2742"><a href></a></span>
<span id="cb6-2743"><a href></a>chart0 <span class="op">=</span> {</span>
<span id="cb6-2744"><a href></a> <span class="co">// State variables for selected parameters</span></span>
<span id="cb6-2745"><a href></a> <span class="kw">let</span> selectedMu <span class="op">=</span> <span class="fl">0.5</span><span class="op">;</span></span>
<span id="cb6-2746"><a href></a> <span class="kw">let</span> selectedSig <span class="op">=</span> <span class="dv">1</span><span class="op">;</span></span>
<span id="cb6-2747"><a href></a> <span class="kw">let</span> selectedNonc <span class="op">=</span> <span class="dv">0</span><span class="op">;</span></span>
<span id="cb6-2748"><a href></a> <span class="kw">let</span> selectedTailw <span class="op">=</span> <span class="dv">1</span><span class="op">;</span></span>
<span id="cb6-2749"><a href></a> <span class="kw">const</span> filteredData <span class="op">=</span> () <span class="kw">=&gt;</span> bsplineData<span class="op">.</span><span class="fu">filter</span>(d <span class="kw">=&gt;</span></span>
<span id="cb6-2750"><a href></a> <span class="bu">Math</span><span class="op">.</span><span class="fu">abs</span>(selectedMu <span class="op">-</span> d<span class="op">.</span><span class="at">mu</span>) <span class="op">&lt;</span> <span class="fl">0.001</span> <span class="op">&amp;&amp;</span></span>
<span id="cb6-2751"><a href></a> d<span class="op">.</span><span class="at">sig</span> <span class="op">===</span> selectedSig <span class="op">&amp;&amp;</span></span>
<span id="cb6-2752"><a href></a> d<span class="op">.</span><span class="at">nonc</span> <span class="op">===</span> selectedNonc <span class="op">&amp;&amp;</span></span>
<span id="cb6-2753"><a href></a> d<span class="op">.</span><span class="at">tailw</span> <span class="op">===</span> selectedTailw</span>
<span id="cb6-2754"><a href></a> )<span class="op">;</span></span>
<span id="cb6-2755"><a href></a> <span class="kw">const</span> container <span class="op">=</span> d3<span class="op">.</span><span class="fu">create</span>(<span class="st">&quot;div&quot;</span>)</span>
<span id="cb6-2756"><a href></a> <span class="op">.</span><span class="fu">style</span>(<span class="st">&quot;max-width&quot;</span><span class="op">,</span> <span class="st">&quot;none&quot;</span>)</span>
<span id="cb6-2757"><a href></a> <span class="op">.</span><span class="fu">style</span>(<span class="st">&quot;width&quot;</span><span class="op">,</span> <span class="st">&quot;100%&quot;</span>)<span class="op">;;</span></span>
<span id="cb6-2758"><a href></a> <span class="kw">const</span> controlsContainer <span class="op">=</span> container<span class="op">.</span><span class="fu">append</span>(<span class="st">&quot;div&quot;</span>)</span>
<span id="cb6-2759"><a href></a> <span class="op">.</span><span class="fu">style</span>(<span class="st">&quot;display&quot;</span><span class="op">,</span> <span class="st">&quot;flex&quot;</span>)</span>
<span id="cb6-2760"><a href></a> <span class="op">.</span><span class="fu">style</span>(<span class="st">&quot;gap&quot;</span><span class="op">,</span> <span class="st">&quot;20px&quot;</span>)<span class="op">;</span></span>
<span id="cb6-2761"><a href></a> <span class="co">// slider controls</span></span>
<span id="cb6-2762"><a href></a> <span class="kw">const</span> sliders <span class="op">=</span> [</span>
<span id="cb6-2763"><a href></a> { <span class="dt">label</span><span class="op">:</span> <span class="st">&#39;Mu&#39;</span><span class="op">,</span> <span class="kw">get</span><span class="op">:</span> () <span class="kw">=&gt;</span> selectedMu<span class="op">,</span> <span class="kw">set</span><span class="op">:</span> v <span class="kw">=&gt;</span> selectedMu <span class="op">=</span> v<span class="op">,</span> <span class="dt">min</span><span class="op">:</span> <span class="fl">0.1</span><span class="op">,</span> <span class="dt">max</span><span class="op">:</span> <span class="fl">0.9</span><span class="op">,</span> <span class="dt">step</span><span class="op">:</span> <span class="fl">0.2</span> }<span class="op">,</span></span>
<span id="cb6-2764"><a href></a> { <span class="dt">label</span><span class="op">:</span> <span class="st">&#39;Sigma&#39;</span><span class="op">,</span> <span class="kw">get</span><span class="op">:</span> () <span class="kw">=&gt;</span> <span class="bu">Math</span><span class="op">.</span><span class="fu">log2</span>(selectedSig)<span class="op">,</span> <span class="kw">set</span><span class="op">:</span> v <span class="kw">=&gt;</span> selectedSig <span class="op">=</span> <span class="dv">2</span> <span class="op">**</span> v<span class="op">,</span> <span class="dt">min</span><span class="op">:</span> <span class="op">-</span><span class="dv">2</span><span class="op">,</span> <span class="dt">max</span><span class="op">:</span> <span class="dv">2</span><span class="op">,</span> <span class="dt">step</span><span class="op">:</span> <span class="dv">1</span> }<span class="op">,</span></span>
<span id="cb6-2765"><a href></a> { <span class="dt">label</span><span class="op">:</span> <span class="st">&#39;Noncentrality&#39;</span><span class="op">,</span> <span class="kw">get</span><span class="op">:</span> () <span class="kw">=&gt;</span> selectedNonc<span class="op">,</span> <span class="kw">set</span><span class="op">:</span> v <span class="kw">=&gt;</span> selectedNonc <span class="op">=</span> v<span class="op">,</span> <span class="dt">min</span><span class="op">:</span> <span class="op">-</span><span class="dv">4</span><span class="op">,</span> <span class="dt">max</span><span class="op">:</span> <span class="dv">4</span><span class="op">,</span> <span class="dt">step</span><span class="op">:</span> <span class="dv">2</span> }<span class="op">,</span></span>
<span id="cb6-2766"><a href></a> { <span class="dt">label</span><span class="op">:</span> <span class="st">&#39;Tailweight&#39;</span><span class="op">,</span> <span class="kw">get</span><span class="op">:</span> () <span class="kw">=&gt;</span> <span class="bu">Math</span><span class="op">.</span><span class="fu">log2</span>(selectedTailw)<span class="op">,</span> <span class="kw">set</span><span class="op">:</span> v <span class="kw">=&gt;</span> selectedTailw <span class="op">=</span> <span class="dv">2</span> <span class="op">**</span> v<span class="op">,</span> <span class="dt">min</span><span class="op">:</span> <span class="op">-</span><span class="dv">2</span><span class="op">,</span> <span class="dt">max</span><span class="op">:</span> <span class="dv">2</span><span class="op">,</span> <span class="dt">step</span><span class="op">:</span> <span class="dv">1</span> }</span>
<span id="cb6-2767"><a href></a> ]<span class="op">;</span></span>
<span id="cb6-2768"><a href></a> <span class="co">// Build slider controls with D3 data join</span></span>
<span id="cb6-2769"><a href></a> <span class="kw">const</span> sliderCont <span class="op">=</span> controlsContainer<span class="op">.</span><span class="fu">selectAll</span>(<span class="st">&#39;div&#39;</span>)<span class="op">.</span><span class="fu">data</span>(sliders)<span class="op">.</span><span class="fu">join</span>(<span class="st">&#39;div&#39;</span>)</span>
<span id="cb6-2770"><a href></a> <span class="op">.</span><span class="fu">style</span>(<span class="st">&#39;display&#39;</span><span class="op">,</span><span class="st">&#39;flex&#39;</span>)<span class="op">.</span><span class="fu">style</span>(<span class="st">&#39;align-items&#39;</span><span class="op">,</span><span class="st">&#39;center&#39;</span>)<span class="op">.</span><span class="fu">style</span>(<span class="st">&#39;gap&#39;</span><span class="op">,</span><span class="st">&#39;10px&#39;</span>)</span>
<span id="cb6-2771"><a href></a> <span class="op">.</span><span class="fu">style</span>(<span class="st">&#39;flex&#39;</span><span class="op">,</span><span class="st">&#39;1&#39;</span>)<span class="op">.</span><span class="fu">style</span>(<span class="st">&#39;min-width&#39;</span><span class="op">,</span><span class="st">&#39;0px&#39;</span>)<span class="op">;</span></span>
<span id="cb6-2772"><a href></a> sliderCont<span class="op">.</span><span class="fu">append</span>(<span class="st">&#39;label&#39;</span>)<span class="op">.</span><span class="fu">text</span>(d <span class="kw">=&gt;</span> d<span class="op">.</span><span class="at">label</span> <span class="op">+</span> <span class="st">&#39;:&#39;</span>)<span class="op">.</span><span class="fu">style</span>(<span class="st">&#39;font-size&#39;</span><span class="op">,</span><span class="st">&#39;20px&#39;</span>)<span class="op">;</span></span>
<span id="cb6-2773"><a href></a> sliderCont<span class="op">.</span><span class="fu">append</span>(<span class="st">&#39;input&#39;</span>)</span>
<span id="cb6-2774"><a href></a> <span class="op">.</span><span class="fu">attr</span>(<span class="st">&#39;type&#39;</span><span class="op">,</span><span class="st">&#39;range&#39;</span>)<span class="op">.</span><span class="fu">attr</span>(<span class="st">&#39;min&#39;</span><span class="op">,</span> d <span class="kw">=&gt;</span> d<span class="op">.</span><span class="at">min</span>)<span class="op">.</span><span class="fu">attr</span>(<span class="st">&#39;max&#39;</span><span class="op">,</span> d <span class="kw">=&gt;</span> d<span class="op">.</span><span class="at">max</span>)<span class="op">.</span><span class="fu">attr</span>(<span class="st">&#39;step&#39;</span><span class="op">,</span> d <span class="kw">=&gt;</span> d<span class="op">.</span><span class="at">step</span>)</span>
<span id="cb6-2775"><a href></a> <span class="op">.</span><span class="fu">property</span>(<span class="st">&#39;value&#39;</span><span class="op">,</span> d <span class="kw">=&gt;</span> d<span class="op">.</span><span class="fu">get</span>())</span>
<span id="cb6-2776"><a href></a> <span class="op">.</span><span class="fu">on</span>(<span class="st">&#39;input&#39;</span><span class="op">,</span> <span class="kw">function</span>(<span class="bu">event</span><span class="op">,</span> d) {</span>
<span id="cb6-2777"><a href></a> <span class="kw">const</span> val <span class="op">=</span> <span class="op">+</span><span class="kw">this</span><span class="op">.</span><span class="at">value</span><span class="op">;</span> d<span class="op">.</span><span class="fu">set</span>(val)<span class="op">;</span></span>
<span id="cb6-2778"><a href></a> d3<span class="op">.</span><span class="fu">select</span>(<span class="kw">this</span><span class="op">.</span><span class="at">parentNode</span>)<span class="op">.</span><span class="fu">select</span>(<span class="st">&#39;span&#39;</span>)<span class="op">.</span><span class="fu">text</span>(d<span class="op">.</span><span class="at">label</span><span class="op">.</span><span class="fu">match</span>(<span class="ss">/Sigma</span><span class="sc">|</span><span class="ss">Tailweight/</span>) <span class="op">?</span> <span class="dv">2</span><span class="op">**</span>val <span class="op">:</span> val)<span class="op">;</span></span>
<span id="cb6-2779"><a href></a> <span class="fu">updateChart</span>(<span class="fu">filteredData</span>())<span class="op">;</span></span>
<span id="cb6-2780"><a href></a> })</span>
<span id="cb6-2781"><a href></a> <span class="op">.</span><span class="fu">style</span>(<span class="st">&#39;width&#39;</span><span class="op">,</span> <span class="st">&#39;100%&#39;</span>)<span class="op">;</span></span>
<span id="cb6-2782"><a href></a> sliderCont<span class="op">.</span><span class="fu">append</span>(<span class="st">&#39;span&#39;</span>)<span class="op">.</span><span class="fu">text</span>(d <span class="kw">=&gt;</span> (d<span class="op">.</span><span class="at">label</span><span class="op">.</span><span class="fu">match</span>(<span class="ss">/Sigma</span><span class="sc">|</span><span class="ss">Tailweight/</span>) <span class="op">?</span> d<span class="op">.</span><span class="fu">get</span>() <span class="op">:</span> d<span class="op">.</span><span class="fu">get</span>()))</span>
<span id="cb6-2783"><a href></a> <span class="op">.</span><span class="fu">style</span>(<span class="st">&#39;font-size&#39;</span><span class="op">,</span><span class="st">&#39;20px&#39;</span>)<span class="op">;</span></span>
<span id="cb6-2784"><a href></a> </span>
<span id="cb6-2785"><a href></a> <span class="co">// Add Reset button to clear all sliders to their defaults</span></span>
<span id="cb6-2786"><a href></a> controlsContainer<span class="op">.</span><span class="fu">append</span>(<span class="st">&#39;button&#39;</span>)</span>
<span id="cb6-2787"><a href></a> <span class="op">.</span><span class="fu">text</span>(<span class="st">&#39;Reset&#39;</span>)</span>
<span id="cb6-2788"><a href></a> <span class="op">.</span><span class="fu">style</span>(<span class="st">&#39;font-size&#39;</span><span class="op">,</span> <span class="st">&#39;20px&#39;</span>)</span>
<span id="cb6-2789"><a href></a> <span class="op">.</span><span class="fu">style</span>(<span class="st">&#39;align-self&#39;</span><span class="op">,</span> <span class="st">&#39;center&#39;</span>)</span>
<span id="cb6-2790"><a href></a> <span class="op">.</span><span class="fu">style</span>(<span class="st">&#39;margin-left&#39;</span><span class="op">,</span> <span class="st">&#39;auto&#39;</span>)</span>
<span id="cb6-2791"><a href></a> <span class="op">.</span><span class="fu">on</span>(<span class="st">&#39;click&#39;</span><span class="op">,</span> () <span class="kw">=&gt;</span> {</span>
<span id="cb6-2792"><a href></a> <span class="co">// reset state vars</span></span>
<span id="cb6-2793"><a href></a> selectedMu <span class="op">=</span> <span class="fl">0.5</span><span class="op">;</span></span>
<span id="cb6-2794"><a href></a> selectedSig <span class="op">=</span> <span class="dv">1</span><span class="op">;</span></span>
<span id="cb6-2795"><a href></a> selectedNonc <span class="op">=</span> <span class="dv">0</span><span class="op">;</span></span>
<span id="cb6-2796"><a href></a> selectedTailw <span class="op">=</span> <span class="dv">1</span><span class="op">;</span></span>
<span id="cb6-2797"><a href></a> <span class="co">// update input positions</span></span>
<span id="cb6-2798"><a href></a> sliderCont<span class="op">.</span><span class="fu">selectAll</span>(<span class="st">&#39;input&#39;</span>)<span class="op">.</span><span class="fu">property</span>(<span class="st">&#39;value&#39;</span><span class="op">,</span> d <span class="kw">=&gt;</span> d<span class="op">.</span><span class="fu">get</span>())<span class="op">;</span></span>
<span id="cb6-2799"><a href></a> <span class="co">// update displayed labels</span></span>
<span id="cb6-2800"><a href></a> sliderCont<span class="op">.</span><span class="fu">selectAll</span>(<span class="st">&#39;span&#39;</span>)</span>
<span id="cb6-2801"><a href></a> <span class="op">.</span><span class="fu">text</span>(d <span class="kw">=&gt;</span> d<span class="op">.</span><span class="at">label</span><span class="op">.</span><span class="fu">match</span>(<span class="ss">/Sigma</span><span class="sc">|</span><span class="ss">Tailweight/</span>) <span class="op">?</span> (<span class="dv">2</span><span class="op">**</span>d<span class="op">.</span><span class="fu">get</span>()) <span class="op">:</span> d<span class="op">.</span><span class="fu">get</span>())<span class="op">;</span></span>
<span id="cb6-2802"><a href></a> <span class="co">// redraw chart</span></span>
<span id="cb6-2803"><a href></a> <span class="fu">updateChart</span>(<span class="fu">filteredData</span>())<span class="op">;</span></span>
<span id="cb6-2804"><a href></a> })<span class="op">;</span></span>
<span id="cb6-2805"><a href></a></span>
<span id="cb6-2806"><a href></a> <span class="co">// Build SVG</span></span>
<span id="cb6-2807"><a href></a> <span class="kw">const</span> width <span class="op">=</span> <span class="dv">1200</span><span class="op">;</span></span>
<span id="cb6-2808"><a href></a> <span class="kw">const</span> height <span class="op">=</span> <span class="dv">450</span><span class="op">;</span></span>
<span id="cb6-2809"><a href></a> <span class="kw">const</span> margin <span class="op">=</span> {<span class="dt">top</span><span class="op">:</span> <span class="dv">40</span><span class="op">,</span> <span class="dt">right</span><span class="op">:</span> <span class="dv">20</span><span class="op">,</span> <span class="dt">bottom</span><span class="op">:</span> <span class="dv">40</span><span class="op">,</span> <span class="dt">left</span><span class="op">:</span> <span class="dv">40</span>}<span class="op">;</span></span>
<span id="cb6-2810"><a href></a> <span class="kw">const</span> innerWidth <span class="op">=</span> width <span class="op">-</span> margin<span class="op">.</span><span class="at">left</span> <span class="op">-</span> margin<span class="op">.</span><span class="at">right</span><span class="op">;</span></span>
<span id="cb6-2811"><a href></a> <span class="kw">const</span> innerHeight <span class="op">=</span> height <span class="op">-</span> margin<span class="op">.</span><span class="at">top</span> <span class="op">-</span> margin<span class="op">.</span><span class="at">bottom</span><span class="op">;</span></span>
<span id="cb6-2812"><a href></a></span>
<span id="cb6-2813"><a href></a> <span class="co">// Set controls container width to match SVG plot width</span></span>
<span id="cb6-2814"><a href></a> controlsContainer<span class="op">.</span><span class="fu">style</span>(<span class="st">&quot;max-width&quot;</span><span class="op">,</span> <span class="st">&quot;none&quot;</span>)<span class="op">.</span><span class="fu">style</span>(<span class="st">&quot;width&quot;</span><span class="op">,</span> <span class="st">&quot;100%&quot;</span>)<span class="op">;</span></span>
<span id="cb6-2815"><a href></a> <span class="co">// Distribute each control evenly and make sliders full-width</span></span>
<span id="cb6-2816"><a href></a> controlsContainer<span class="op">.</span><span class="fu">selectAll</span>(<span class="st">&quot;div&quot;</span>)<span class="op">.</span><span class="fu">style</span>(<span class="st">&quot;flex&quot;</span><span class="op">,</span> <span class="st">&quot;1&quot;</span>)<span class="op">.</span><span class="fu">style</span>(<span class="st">&quot;min-width&quot;</span><span class="op">,</span> <span class="st">&quot;0px&quot;</span>)<span class="op">;</span></span>
<span id="cb6-2817"><a href></a> controlsContainer<span class="op">.</span><span class="fu">selectAll</span>(<span class="st">&quot;input&quot;</span>)<span class="op">.</span><span class="fu">style</span>(<span class="st">&quot;width&quot;</span><span class="op">,</span> <span class="st">&quot;100%&quot;</span>)<span class="op">.</span><span class="fu">style</span>(<span class="st">&quot;box-sizing&quot;</span><span class="op">,</span> <span class="st">&quot;border-box&quot;</span>)<span class="op">;</span></span>
<span id="cb6-2818"><a href></a> </span>
<span id="cb6-2819"><a href></a> <span class="co">// Create scales</span></span>
<span id="cb6-2820"><a href></a> <span class="kw">const</span> x <span class="op">=</span> d3<span class="op">.</span><span class="fu">scaleLinear</span>()</span>
<span id="cb6-2821"><a href></a> <span class="op">.</span><span class="fu">domain</span>([<span class="dv">0</span><span class="op">,</span> <span class="dv">1</span>])</span>
<span id="cb6-2822"><a href></a> <span class="op">.</span><span class="fu">range</span>([<span class="dv">0</span><span class="op">,</span> innerWidth])<span class="op">;</span></span>
<span id="cb6-2823"><a href></a> </span>
<span id="cb6-2824"><a href></a> <span class="kw">const</span> y <span class="op">=</span> d3<span class="op">.</span><span class="fu">scaleLinear</span>()</span>
<span id="cb6-2825"><a href></a> <span class="op">.</span><span class="fu">domain</span>([<span class="dv">0</span><span class="op">,</span> <span class="dv">1</span>])</span>
<span id="cb6-2826"><a href></a> <span class="op">.</span><span class="fu">range</span>([innerHeight<span class="op">,</span> <span class="dv">0</span>])<span class="op">;</span></span>
<span id="cb6-2827"><a href></a> </span>
<span id="cb6-2828"><a href></a> <span class="co">// Create a color scale for the basis functions</span></span>
<span id="cb6-2829"><a href></a> <span class="kw">const</span> color <span class="op">=</span> d3<span class="op">.</span><span class="fu">scaleOrdinal</span>(d3<span class="op">.</span><span class="at">schemeCategory10</span>)<span class="op">;</span></span>
<span id="cb6-2830"><a href></a> </span>
<span id="cb6-2831"><a href></a> <span class="co">// Create SVG</span></span>
<span id="cb6-2832"><a href></a> <span class="kw">const</span> svg <span class="op">=</span> d3<span class="op">.</span><span class="fu">create</span>(<span class="st">&quot;svg&quot;</span>)</span>
<span id="cb6-2833"><a href></a> <span class="op">.</span><span class="fu">attr</span>(<span class="st">&quot;width&quot;</span><span class="op">,</span> <span class="st">&quot;100%&quot;</span>)</span>
<span id="cb6-2834"><a href></a> <span class="op">.</span><span class="fu">attr</span>(<span class="st">&quot;height&quot;</span><span class="op">,</span> <span class="st">&quot;auto&quot;</span>)</span>
<span id="cb6-2835"><a href></a> <span class="op">.</span><span class="fu">attr</span>(<span class="st">&quot;viewBox&quot;</span><span class="op">,</span> [<span class="dv">0</span><span class="op">,</span> <span class="dv">0</span><span class="op">,</span> width<span class="op">,</span> height])</span>
<span id="cb6-2836"><a href></a> <span class="op">.</span><span class="fu">attr</span>(<span class="st">&quot;preserveAspectRatio&quot;</span><span class="op">,</span> <span class="st">&quot;xMidYMid meet&quot;</span>)</span>
<span id="cb6-2837"><a href></a> <span class="op">.</span><span class="fu">attr</span>(<span class="st">&quot;style&quot;</span><span class="op">,</span> <span class="st">&quot;max-width: 100%; height: auto;&quot;</span>)<span class="op">;</span></span>
<span id="cb6-2838"><a href></a> </span>
<span id="cb6-2839"><a href></a> <span class="co">// Create the chart group</span></span>
<span id="cb6-2840"><a href></a> <span class="kw">const</span> g <span class="op">=</span> svg<span class="op">.</span><span class="fu">append</span>(<span class="st">&quot;g&quot;</span>)</span>
<span id="cb6-2841"><a href></a> <span class="op">.</span><span class="fu">attr</span>(<span class="st">&quot;transform&quot;</span><span class="op">,</span> <span class="vs">`translate(</span><span class="sc">${</span>margin<span class="op">.</span><span class="at">left</span><span class="sc">}</span><span class="vs">,</span><span class="sc">${</span>margin<span class="op">.</span><span class="at">top</span><span class="sc">}</span><span class="vs">)`</span>)<span class="op">;</span></span>
<span id="cb6-2842"><a href></a> </span>
<span id="cb6-2843"><a href></a> <span class="co">// Add axes</span></span>
<span id="cb6-2844"><a href></a> <span class="kw">const</span> xAxis <span class="op">=</span> g<span class="op">.</span><span class="fu">append</span>(<span class="st">&quot;g&quot;</span>)</span>
<span id="cb6-2845"><a href></a> <span class="op">.</span><span class="fu">attr</span>(<span class="st">&quot;transform&quot;</span><span class="op">,</span> <span class="vs">`translate(0,</span><span class="sc">${</span>innerHeight<span class="sc">}</span><span class="vs">)`</span>)</span>
<span id="cb6-2846"><a href></a> <span class="op">.</span><span class="fu">attr</span>(<span class="st">&quot;class&quot;</span><span class="op">,</span> <span class="st">&quot;x-axis&quot;</span>)</span>
<span id="cb6-2847"><a href></a> <span class="op">.</span><span class="fu">call</span>(d3<span class="op">.</span><span class="fu">axisBottom</span>(x)<span class="op">.</span><span class="fu">ticks</span>(<span class="dv">10</span>))</span>
<span id="cb6-2848"><a href></a> <span class="op">.</span><span class="fu">style</span>(<span class="st">&quot;font-size&quot;</span><span class="op">,</span> <span class="st">&quot;20px&quot;</span>)<span class="op">;</span></span>
<span id="cb6-2849"><a href></a> </span>
<span id="cb6-2850"><a href></a> <span class="kw">const</span> yAxis <span class="op">=</span> g<span class="op">.</span><span class="fu">append</span>(<span class="st">&quot;g&quot;</span>)</span>
<span id="cb6-2851"><a href></a> <span class="op">.</span><span class="fu">attr</span>(<span class="st">&quot;class&quot;</span><span class="op">,</span> <span class="st">&quot;y-axis&quot;</span>)</span>
<span id="cb6-2852"><a href></a> <span class="op">.</span><span class="fu">call</span>(d3<span class="op">.</span><span class="fu">axisLeft</span>(y)<span class="op">.</span><span class="fu">ticks</span>(<span class="dv">5</span>))</span>
<span id="cb6-2853"><a href></a> <span class="op">.</span><span class="fu">style</span>(<span class="st">&quot;font-size&quot;</span><span class="op">,</span> <span class="st">&quot;20px&quot;</span>)<span class="op">;</span></span>
<span id="cb6-2854"><a href></a> </span>
<span id="cb6-2855"><a href></a> <span class="co">// Add a horizontal line at y = 0</span></span>
<span id="cb6-2856"><a href></a> g<span class="op">.</span><span class="fu">append</span>(<span class="st">&quot;line&quot;</span>)</span>
<span id="cb6-2857"><a href></a> <span class="op">.</span><span class="fu">attr</span>(<span class="st">&quot;x1&quot;</span><span class="op">,</span> <span class="dv">0</span>)</span>
<span id="cb6-2858"><a href></a> <span class="op">.</span><span class="fu">attr</span>(<span class="st">&quot;x2&quot;</span><span class="op">,</span> innerWidth)</span>
<span id="cb6-2859"><a href></a> <span class="op">.</span><span class="fu">attr</span>(<span class="st">&quot;y1&quot;</span><span class="op">,</span> <span class="fu">y</span>(<span class="dv">0</span>))</span>
<span id="cb6-2860"><a href></a> <span class="op">.</span><span class="fu">attr</span>(<span class="st">&quot;y2&quot;</span><span class="op">,</span> <span class="fu">y</span>(<span class="dv">0</span>))</span>
<span id="cb6-2861"><a href></a> <span class="op">.</span><span class="fu">attr</span>(<span class="st">&quot;stroke&quot;</span><span class="op">,</span> <span class="st">&quot;#000&quot;</span>)</span>
<span id="cb6-2862"><a href></a> <span class="op">.</span><span class="fu">attr</span>(<span class="st">&quot;stroke-opacity&quot;</span><span class="op">,</span> <span class="fl">0.2</span>)<span class="op">;</span></span>
<span id="cb6-2863"><a href></a> </span>
<span id="cb6-2864"><a href></a> <span class="co">// Add gridlines</span></span>
<span id="cb6-2865"><a href></a> g<span class="op">.</span><span class="fu">append</span>(<span class="st">&quot;g&quot;</span>)</span>
<span id="cb6-2866"><a href></a> <span class="op">.</span><span class="fu">attr</span>(<span class="st">&quot;class&quot;</span><span class="op">,</span> <span class="st">&quot;grid-lines&quot;</span>)</span>
<span id="cb6-2867"><a href></a> <span class="op">.</span><span class="fu">selectAll</span>(<span class="st">&quot;line&quot;</span>)</span>
<span id="cb6-2868"><a href></a> <span class="op">.</span><span class="fu">data</span>(y<span class="op">.</span><span class="fu">ticks</span>(<span class="dv">5</span>))</span>
<span id="cb6-2869"><a href></a> <span class="op">.</span><span class="fu">join</span>(<span class="st">&quot;line&quot;</span>)</span>
<span id="cb6-2870"><a href></a> <span class="op">.</span><span class="fu">attr</span>(<span class="st">&quot;x1&quot;</span><span class="op">,</span> <span class="dv">0</span>)</span>
<span id="cb6-2871"><a href></a> <span class="op">.</span><span class="fu">attr</span>(<span class="st">&quot;x2&quot;</span><span class="op">,</span> innerWidth)</span>
<span id="cb6-2872"><a href></a> <span class="op">.</span><span class="fu">attr</span>(<span class="st">&quot;y1&quot;</span><span class="op">,</span> d <span class="kw">=&gt;</span> <span class="fu">y</span>(d))</span>
<span id="cb6-2873"><a href></a> <span class="op">.</span><span class="fu">attr</span>(<span class="st">&quot;y2&quot;</span><span class="op">,</span> d <span class="kw">=&gt;</span> <span class="fu">y</span>(d))</span>
<span id="cb6-2874"><a href></a> <span class="op">.</span><span class="fu">attr</span>(<span class="st">&quot;stroke&quot;</span><span class="op">,</span> <span class="st">&quot;#ccc&quot;</span>)</span>
<span id="cb6-2875"><a href></a> <span class="op">.</span><span class="fu">attr</span>(<span class="st">&quot;stroke-opacity&quot;</span><span class="op">,</span> <span class="fl">0.5</span>)<span class="op">;</span></span>
<span id="cb6-2876"><a href></a> </span>
<span id="cb6-2877"><a href></a> <span class="co">// Create a line generator</span></span>
<span id="cb6-2878"><a href></a> <span class="kw">const</span> line <span class="op">=</span> d3<span class="op">.</span><span class="fu">line</span>()</span>
<span id="cb6-2879"><a href></a> <span class="op">.</span><span class="fu">x</span>(d <span class="kw">=&gt;</span> <span class="fu">x</span>(d<span class="op">.</span><span class="at">x</span>))</span>
<span id="cb6-2880"><a href></a> <span class="op">.</span><span class="fu">y</span>(d <span class="kw">=&gt;</span> <span class="fu">y</span>(d<span class="op">.</span><span class="at">y</span>))</span>
<span id="cb6-2881"><a href></a> <span class="op">.</span><span class="fu">curve</span>(d3<span class="op">.</span><span class="at">curveBasis</span>)<span class="op">;</span></span>
<span id="cb6-2882"><a href></a> </span>
<span id="cb6-2883"><a href></a> <span class="co">// Group to contain the basis function lines</span></span>
<span id="cb6-2884"><a href></a> <span class="kw">const</span> linesGroup <span class="op">=</span> g<span class="op">.</span><span class="fu">append</span>(<span class="st">&quot;g&quot;</span>)</span>
<span id="cb6-2885"><a href></a> <span class="op">.</span><span class="fu">attr</span>(<span class="st">&quot;class&quot;</span><span class="op">,</span> <span class="st">&quot;basis-functions&quot;</span>)<span class="op">;</span></span>
<span id="cb6-2886"><a href></a> </span>
<span id="cb6-2887"><a href></a> <span class="co">// Store the current basis functions for transition</span></span>
<span id="cb6-2888"><a href></a> <span class="kw">let</span> currentBasisFunctions <span class="op">=</span> <span class="kw">new</span> <span class="bu">Map</span>()<span class="op">;</span></span>
<span id="cb6-2889"><a href></a> </span>
<span id="cb6-2890"><a href></a> <span class="co">// Function to update the chart with new data</span></span>
<span id="cb6-2891"><a href></a> <span class="kw">function</span> <span class="fu">updateChart</span>(data) {</span>
<span id="cb6-2892"><a href></a> <span class="fu">updateChartInner</span>(g<span class="op">,</span> x<span class="op">,</span> y<span class="op">,</span> linesGroup<span class="op">,</span> color<span class="op">,</span> line<span class="op">,</span> data)<span class="op">;</span></span>
<span id="cb6-2893"><a href></a> }</span>
<span id="cb6-2894"><a href></a> </span>
<span id="cb6-2895"><a href></a> <span class="co">// Store the update function</span></span>
<span id="cb6-2896"><a href></a> svg<span class="op">.</span><span class="fu">node</span>()<span class="op">.</span><span class="at">update</span> <span class="op">=</span> updateChart<span class="op">;</span></span>
<span id="cb6-2897"><a href></a> </span>
<span id="cb6-2898"><a href></a> <span class="co">// Initial render</span></span>
<span id="cb6-2899"><a href></a> <span class="fu">updateChart</span>(<span class="fu">filteredData</span>())<span class="op">;</span></span>
<span id="cb6-2900"><a href></a> </span>
<span id="cb6-2901"><a href></a> container<span class="op">.</span><span class="fu">node</span>()<span class="op">.</span><span class="fu">appendChild</span>(svg<span class="op">.</span><span class="fu">node</span>())<span class="op">;</span></span>
<span id="cb6-2902"><a href></a> <span class="cf">return</span> container<span class="op">.</span><span class="fu">node</span>()<span class="op">;</span></span>
<span id="cb6-2903"><a href></a>}</span></code><button title="Copy to Clipboard" class="code-copy-button"><i class="bi"></i></button></pre></div>
<div class="cell-output cell-output-display"> <div class="cell-output cell-output-display">
<div id="ojs-cell-2" data-nodetype="declaration"> <div id="ojs-cell-5" data-nodetype="declaration">
</div>
</div>
</div>
<div class="cell">
<div class="sourceCode cell-code hidden" id="cb4" data-startfrom="2599" data-source-offset="-0"><pre class="sourceCode numberSource js number-lines code-with-copy"><code class="sourceCode javascript" style="counter-reset: source-line 2598;"><span id="cb4-2599"><a href></a><span class="kw">function</span> <span class="fu">updateChartInner</span>(g<span class="op">,</span> x<span class="op">,</span> y<span class="op">,</span> linesGroup<span class="op">,</span> color<span class="op">,</span> line<span class="op">,</span> data) {</span>
<span id="cb4-2600"><a href></a> <span class="co">// Update axes with transitions</span></span>
<span id="cb4-2601"><a href></a> x<span class="op">.</span><span class="fu">domain</span>([<span class="dv">0</span><span class="op">,</span> d3<span class="op">.</span><span class="fu">max</span>(data<span class="op">,</span> d <span class="kw">=&gt;</span> d<span class="op">.</span><span class="at">x</span>)])<span class="op">;</span></span>
<span id="cb4-2602"><a href></a> g<span class="op">.</span><span class="fu">select</span>(<span class="st">&quot;.x-axis&quot;</span>)<span class="op">.</span><span class="fu">transition</span>()<span class="op">.</span><span class="fu">duration</span>(<span class="dv">1500</span>)<span class="op">.</span><span class="fu">call</span>(d3<span class="op">.</span><span class="fu">axisBottom</span>(x)<span class="op">.</span><span class="fu">ticks</span>(<span class="dv">10</span>))<span class="op">;</span></span>
<span id="cb4-2603"><a href></a> y<span class="op">.</span><span class="fu">domain</span>([<span class="dv">0</span><span class="op">,</span> d3<span class="op">.</span><span class="fu">max</span>(data<span class="op">,</span> d <span class="kw">=&gt;</span> d<span class="op">.</span><span class="at">y</span>)])<span class="op">;</span></span>
<span id="cb4-2604"><a href></a> g<span class="op">.</span><span class="fu">select</span>(<span class="st">&quot;.y-axis&quot;</span>)<span class="op">.</span><span class="fu">transition</span>()<span class="op">.</span><span class="fu">duration</span>(<span class="dv">1500</span>)<span class="op">.</span><span class="fu">call</span>(d3<span class="op">.</span><span class="fu">axisLeft</span>(y)<span class="op">.</span><span class="fu">ticks</span>(<span class="dv">5</span>))<span class="op">;</span></span>
<span id="cb4-2605"><a href></a></span>
<span id="cb4-2606"><a href></a> <span class="co">// Group data by basis function</span></span>
<span id="cb4-2607"><a href></a> <span class="kw">const</span> dataByFunction <span class="op">=</span> <span class="bu">Array</span><span class="op">.</span><span class="fu">from</span>(d3<span class="op">.</span><span class="fu">group</span>(data<span class="op">,</span> d <span class="kw">=&gt;</span> d<span class="op">.</span><span class="at">b</span>))<span class="op">;</span></span>
<span id="cb4-2608"><a href></a> <span class="kw">const</span> keyFn <span class="op">=</span> d <span class="kw">=&gt;</span> d[<span class="dv">0</span>]<span class="op">;</span></span>
<span id="cb4-2609"><a href></a></span>
<span id="cb4-2610"><a href></a> <span class="co">// Update basis function lines</span></span>
<span id="cb4-2611"><a href></a> <span class="kw">const</span> u <span class="op">=</span> linesGroup<span class="op">.</span><span class="fu">selectAll</span>(<span class="st">&quot;path&quot;</span>)<span class="op">.</span><span class="fu">data</span>(dataByFunction<span class="op">,</span> keyFn)<span class="op">;</span></span>
<span id="cb4-2612"><a href></a> u<span class="op">.</span><span class="fu">join</span>(</span>
<span id="cb4-2613"><a href></a> enter <span class="kw">=&gt;</span> enter<span class="op">.</span><span class="fu">append</span>(<span class="st">&quot;path&quot;</span>)<span class="op">.</span><span class="fu">attr</span>(<span class="st">&quot;fill&quot;</span><span class="op">,</span><span class="st">&quot;none&quot;</span>)<span class="op">.</span><span class="fu">attr</span>(<span class="st">&quot;stroke-width&quot;</span><span class="op">,</span><span class="dv">3</span>)</span>
<span id="cb4-2614"><a href></a> <span class="op">.</span><span class="fu">attr</span>(<span class="st">&quot;stroke&quot;</span><span class="op">,</span> (_<span class="op">,</span> i) <span class="kw">=&gt;</span> <span class="fu">color</span>(i))<span class="op">.</span><span class="fu">attr</span>(<span class="st">&quot;d&quot;</span><span class="op">,</span> d <span class="kw">=&gt;</span> <span class="fu">line</span>(d[<span class="dv">1</span>]<span class="op">.</span><span class="fu">map</span>(pt <span class="kw">=&gt;</span> ({<span class="dt">x</span><span class="op">:</span> pt<span class="op">.</span><span class="at">x</span><span class="op">,</span> <span class="dt">y</span><span class="op">:</span> <span class="dv">0</span>}))))</span>
<span id="cb4-2615"><a href></a> <span class="op">.</span><span class="fu">style</span>(<span class="st">&quot;opacity&quot;</span><span class="op">,</span><span class="dv">0</span>)<span class="op">,</span></span>
<span id="cb4-2616"><a href></a> update <span class="kw">=&gt;</span> update<span class="op">,</span></span>
<span id="cb4-2617"><a href></a> exit <span class="kw">=&gt;</span> exit<span class="op">.</span><span class="fu">transition</span>()<span class="op">.</span><span class="fu">duration</span>(<span class="dv">1000</span>)<span class="op">.</span><span class="fu">style</span>(<span class="st">&quot;opacity&quot;</span><span class="op">,</span><span class="dv">0</span>)<span class="op">.</span><span class="fu">remove</span>()</span>
<span id="cb4-2618"><a href></a> )</span>
<span id="cb4-2619"><a href></a> <span class="op">.</span><span class="fu">transition</span>()<span class="op">.</span><span class="fu">duration</span>(<span class="dv">1000</span>)</span>
<span id="cb4-2620"><a href></a> <span class="op">.</span><span class="fu">attr</span>(<span class="st">&quot;d&quot;</span><span class="op">,</span> d <span class="kw">=&gt;</span> <span class="fu">line</span>(d[<span class="dv">1</span>]))</span>
<span id="cb4-2621"><a href></a> <span class="op">.</span><span class="fu">attr</span>(<span class="st">&quot;stroke&quot;</span><span class="op">,</span> (_<span class="op">,</span> i) <span class="kw">=&gt;</span> <span class="fu">color</span>(i))</span>
<span id="cb4-2622"><a href></a> <span class="op">.</span><span class="fu">style</span>(<span class="st">&quot;opacity&quot;</span><span class="op">,</span><span class="dv">1</span>)<span class="op">;</span></span>
<span id="cb4-2623"><a href></a>}</span>
<span id="cb4-2624"><a href></a></span>
<span id="cb4-2625"><a href></a>chart <span class="op">=</span> {</span>
<span id="cb4-2626"><a href></a> <span class="co">// State variables for selected parameters</span></span>
<span id="cb4-2627"><a href></a> <span class="kw">let</span> selectedMu <span class="op">=</span> <span class="fl">0.5</span><span class="op">;</span></span>
<span id="cb4-2628"><a href></a> <span class="kw">let</span> selectedSig <span class="op">=</span> <span class="dv">1</span><span class="op">;</span></span>
<span id="cb4-2629"><a href></a> <span class="kw">let</span> selectedNonc <span class="op">=</span> <span class="dv">0</span><span class="op">;</span></span>
<span id="cb4-2630"><a href></a> <span class="kw">let</span> selectedTailw <span class="op">=</span> <span class="dv">1</span><span class="op">;</span></span>
<span id="cb4-2631"><a href></a> <span class="kw">const</span> filteredData <span class="op">=</span> () <span class="kw">=&gt;</span> bsplineData<span class="op">.</span><span class="fu">filter</span>(d <span class="kw">=&gt;</span></span>
<span id="cb4-2632"><a href></a> <span class="bu">Math</span><span class="op">.</span><span class="fu">abs</span>(selectedMu <span class="op">-</span> d<span class="op">.</span><span class="at">mu</span>) <span class="op">&lt;</span> <span class="fl">0.001</span> <span class="op">&amp;&amp;</span></span>
<span id="cb4-2633"><a href></a> d<span class="op">.</span><span class="at">sig</span> <span class="op">===</span> selectedSig <span class="op">&amp;&amp;</span></span>
<span id="cb4-2634"><a href></a> d<span class="op">.</span><span class="at">nonc</span> <span class="op">===</span> selectedNonc <span class="op">&amp;&amp;</span></span>
<span id="cb4-2635"><a href></a> d<span class="op">.</span><span class="at">tailw</span> <span class="op">===</span> selectedTailw</span>
<span id="cb4-2636"><a href></a> )<span class="op">;</span></span>
<span id="cb4-2637"><a href></a> <span class="kw">const</span> container <span class="op">=</span> d3<span class="op">.</span><span class="fu">create</span>(<span class="st">&quot;div&quot;</span>)</span>
<span id="cb4-2638"><a href></a> <span class="op">.</span><span class="fu">style</span>(<span class="st">&quot;max-width&quot;</span><span class="op">,</span> <span class="st">&quot;none&quot;</span>)</span>
<span id="cb4-2639"><a href></a> <span class="op">.</span><span class="fu">style</span>(<span class="st">&quot;width&quot;</span><span class="op">,</span> <span class="st">&quot;100%&quot;</span>)<span class="op">;;</span></span>
<span id="cb4-2640"><a href></a> <span class="kw">const</span> controlsContainer <span class="op">=</span> container<span class="op">.</span><span class="fu">append</span>(<span class="st">&quot;div&quot;</span>)</span>
<span id="cb4-2641"><a href></a> <span class="op">.</span><span class="fu">style</span>(<span class="st">&quot;display&quot;</span><span class="op">,</span> <span class="st">&quot;flex&quot;</span>)</span>
<span id="cb4-2642"><a href></a> <span class="op">.</span><span class="fu">style</span>(<span class="st">&quot;gap&quot;</span><span class="op">,</span> <span class="st">&quot;20px&quot;</span>)<span class="op">;</span></span>
<span id="cb4-2643"><a href></a> <span class="co">// slider controls</span></span>
<span id="cb4-2644"><a href></a> <span class="kw">const</span> sliders <span class="op">=</span> [</span>
<span id="cb4-2645"><a href></a> { <span class="dt">label</span><span class="op">:</span> <span class="st">&#39;Mu&#39;</span><span class="op">,</span> <span class="kw">get</span><span class="op">:</span> () <span class="kw">=&gt;</span> selectedMu<span class="op">,</span> <span class="kw">set</span><span class="op">:</span> v <span class="kw">=&gt;</span> selectedMu <span class="op">=</span> v<span class="op">,</span> <span class="dt">min</span><span class="op">:</span> <span class="fl">0.1</span><span class="op">,</span> <span class="dt">max</span><span class="op">:</span> <span class="fl">0.9</span><span class="op">,</span> <span class="dt">step</span><span class="op">:</span> <span class="fl">0.2</span> }<span class="op">,</span></span>
<span id="cb4-2646"><a href></a> { <span class="dt">label</span><span class="op">:</span> <span class="st">&#39;Sigma&#39;</span><span class="op">,</span> <span class="kw">get</span><span class="op">:</span> () <span class="kw">=&gt;</span> <span class="bu">Math</span><span class="op">.</span><span class="fu">log2</span>(selectedSig)<span class="op">,</span> <span class="kw">set</span><span class="op">:</span> v <span class="kw">=&gt;</span> selectedSig <span class="op">=</span> <span class="dv">2</span> <span class="op">**</span> v<span class="op">,</span> <span class="dt">min</span><span class="op">:</span> <span class="op">-</span><span class="dv">2</span><span class="op">,</span> <span class="dt">max</span><span class="op">:</span> <span class="dv">2</span><span class="op">,</span> <span class="dt">step</span><span class="op">:</span> <span class="dv">1</span> }<span class="op">,</span></span>
<span id="cb4-2647"><a href></a> { <span class="dt">label</span><span class="op">:</span> <span class="st">&#39;Noncentrality&#39;</span><span class="op">,</span> <span class="kw">get</span><span class="op">:</span> () <span class="kw">=&gt;</span> selectedNonc<span class="op">,</span> <span class="kw">set</span><span class="op">:</span> v <span class="kw">=&gt;</span> selectedNonc <span class="op">=</span> v<span class="op">,</span> <span class="dt">min</span><span class="op">:</span> <span class="op">-</span><span class="dv">4</span><span class="op">,</span> <span class="dt">max</span><span class="op">:</span> <span class="dv">4</span><span class="op">,</span> <span class="dt">step</span><span class="op">:</span> <span class="dv">2</span> }<span class="op">,</span></span>
<span id="cb4-2648"><a href></a> { <span class="dt">label</span><span class="op">:</span> <span class="st">&#39;Tailweight&#39;</span><span class="op">,</span> <span class="kw">get</span><span class="op">:</span> () <span class="kw">=&gt;</span> <span class="bu">Math</span><span class="op">.</span><span class="fu">log2</span>(selectedTailw)<span class="op">,</span> <span class="kw">set</span><span class="op">:</span> v <span class="kw">=&gt;</span> selectedTailw <span class="op">=</span> <span class="dv">2</span> <span class="op">**</span> v<span class="op">,</span> <span class="dt">min</span><span class="op">:</span> <span class="op">-</span><span class="dv">2</span><span class="op">,</span> <span class="dt">max</span><span class="op">:</span> <span class="dv">2</span><span class="op">,</span> <span class="dt">step</span><span class="op">:</span> <span class="dv">1</span> }</span>
<span id="cb4-2649"><a href></a> ]<span class="op">;</span></span>
<span id="cb4-2650"><a href></a> <span class="co">// Build slider controls with D3 data join</span></span>
<span id="cb4-2651"><a href></a> <span class="kw">const</span> sliderCont <span class="op">=</span> controlsContainer<span class="op">.</span><span class="fu">selectAll</span>(<span class="st">&#39;div&#39;</span>)<span class="op">.</span><span class="fu">data</span>(sliders)<span class="op">.</span><span class="fu">join</span>(<span class="st">&#39;div&#39;</span>)</span>
<span id="cb4-2652"><a href></a> <span class="op">.</span><span class="fu">style</span>(<span class="st">&#39;display&#39;</span><span class="op">,</span><span class="st">&#39;flex&#39;</span>)<span class="op">.</span><span class="fu">style</span>(<span class="st">&#39;align-items&#39;</span><span class="op">,</span><span class="st">&#39;center&#39;</span>)<span class="op">.</span><span class="fu">style</span>(<span class="st">&#39;gap&#39;</span><span class="op">,</span><span class="st">&#39;10px&#39;</span>)</span>
<span id="cb4-2653"><a href></a> <span class="op">.</span><span class="fu">style</span>(<span class="st">&#39;flex&#39;</span><span class="op">,</span><span class="st">&#39;1&#39;</span>)<span class="op">.</span><span class="fu">style</span>(<span class="st">&#39;min-width&#39;</span><span class="op">,</span><span class="st">&#39;0px&#39;</span>)<span class="op">;</span></span>
<span id="cb4-2654"><a href></a> sliderCont<span class="op">.</span><span class="fu">append</span>(<span class="st">&#39;label&#39;</span>)<span class="op">.</span><span class="fu">text</span>(d <span class="kw">=&gt;</span> d<span class="op">.</span><span class="at">label</span> <span class="op">+</span> <span class="st">&#39;:&#39;</span>)<span class="op">.</span><span class="fu">style</span>(<span class="st">&#39;font-size&#39;</span><span class="op">,</span><span class="st">&#39;20px&#39;</span>)<span class="op">;</span></span>
<span id="cb4-2655"><a href></a> sliderCont<span class="op">.</span><span class="fu">append</span>(<span class="st">&#39;input&#39;</span>)</span>
<span id="cb4-2656"><a href></a> <span class="op">.</span><span class="fu">attr</span>(<span class="st">&#39;type&#39;</span><span class="op">,</span><span class="st">&#39;range&#39;</span>)<span class="op">.</span><span class="fu">attr</span>(<span class="st">&#39;min&#39;</span><span class="op">,</span> d <span class="kw">=&gt;</span> d<span class="op">.</span><span class="at">min</span>)<span class="op">.</span><span class="fu">attr</span>(<span class="st">&#39;max&#39;</span><span class="op">,</span> d <span class="kw">=&gt;</span> d<span class="op">.</span><span class="at">max</span>)<span class="op">.</span><span class="fu">attr</span>(<span class="st">&#39;step&#39;</span><span class="op">,</span> d <span class="kw">=&gt;</span> d<span class="op">.</span><span class="at">step</span>)</span>
<span id="cb4-2657"><a href></a> <span class="op">.</span><span class="fu">property</span>(<span class="st">&#39;value&#39;</span><span class="op">,</span> d <span class="kw">=&gt;</span> d<span class="op">.</span><span class="fu">get</span>())</span>
<span id="cb4-2658"><a href></a> <span class="op">.</span><span class="fu">on</span>(<span class="st">&#39;input&#39;</span><span class="op">,</span> <span class="kw">function</span>(<span class="bu">event</span><span class="op">,</span> d) {</span>
<span id="cb4-2659"><a href></a> <span class="kw">const</span> val <span class="op">=</span> <span class="op">+</span><span class="kw">this</span><span class="op">.</span><span class="at">value</span><span class="op">;</span> d<span class="op">.</span><span class="fu">set</span>(val)<span class="op">;</span></span>
<span id="cb4-2660"><a href></a> d3<span class="op">.</span><span class="fu">select</span>(<span class="kw">this</span><span class="op">.</span><span class="at">parentNode</span>)<span class="op">.</span><span class="fu">select</span>(<span class="st">&#39;span&#39;</span>)<span class="op">.</span><span class="fu">text</span>(d<span class="op">.</span><span class="at">label</span><span class="op">.</span><span class="fu">match</span>(<span class="ss">/Sigma</span><span class="sc">|</span><span class="ss">Tailweight/</span>) <span class="op">?</span> <span class="dv">2</span><span class="op">**</span>val <span class="op">:</span> val)<span class="op">;</span></span>
<span id="cb4-2661"><a href></a> <span class="fu">updateChart</span>(<span class="fu">filteredData</span>())<span class="op">;</span></span>
<span id="cb4-2662"><a href></a> })</span>
<span id="cb4-2663"><a href></a> <span class="op">.</span><span class="fu">style</span>(<span class="st">&#39;width&#39;</span><span class="op">,</span> <span class="st">&#39;100%&#39;</span>)<span class="op">;</span></span>
<span id="cb4-2664"><a href></a> sliderCont<span class="op">.</span><span class="fu">append</span>(<span class="st">&#39;span&#39;</span>)<span class="op">.</span><span class="fu">text</span>(d <span class="kw">=&gt;</span> (d<span class="op">.</span><span class="at">label</span><span class="op">.</span><span class="fu">match</span>(<span class="ss">/Sigma</span><span class="sc">|</span><span class="ss">Tailweight/</span>) <span class="op">?</span> d<span class="op">.</span><span class="fu">get</span>() <span class="op">:</span> d<span class="op">.</span><span class="fu">get</span>()))</span>
<span id="cb4-2665"><a href></a> <span class="op">.</span><span class="fu">style</span>(<span class="st">&#39;font-size&#39;</span><span class="op">,</span><span class="st">&#39;20px&#39;</span>)<span class="op">;</span></span>
<span id="cb4-2666"><a href></a> </span>
<span id="cb4-2667"><a href></a> <span class="co">// Add Reset button to clear all sliders to their defaults</span></span>
<span id="cb4-2668"><a href></a> controlsContainer<span class="op">.</span><span class="fu">append</span>(<span class="st">&#39;button&#39;</span>)</span>
<span id="cb4-2669"><a href></a> <span class="op">.</span><span class="fu">text</span>(<span class="st">&#39;Reset&#39;</span>)</span>
<span id="cb4-2670"><a href></a> <span class="op">.</span><span class="fu">style</span>(<span class="st">&#39;font-size&#39;</span><span class="op">,</span> <span class="st">&#39;20px&#39;</span>)</span>
<span id="cb4-2671"><a href></a> <span class="op">.</span><span class="fu">style</span>(<span class="st">&#39;align-self&#39;</span><span class="op">,</span> <span class="st">&#39;center&#39;</span>)</span>
<span id="cb4-2672"><a href></a> <span class="op">.</span><span class="fu">style</span>(<span class="st">&#39;margin-left&#39;</span><span class="op">,</span> <span class="st">&#39;auto&#39;</span>)</span>
<span id="cb4-2673"><a href></a> <span class="op">.</span><span class="fu">on</span>(<span class="st">&#39;click&#39;</span><span class="op">,</span> () <span class="kw">=&gt;</span> {</span>
<span id="cb4-2674"><a href></a> <span class="co">// reset state vars</span></span>
<span id="cb4-2675"><a href></a> selectedMu <span class="op">=</span> <span class="fl">0.5</span><span class="op">;</span></span>
<span id="cb4-2676"><a href></a> selectedSig <span class="op">=</span> <span class="dv">1</span><span class="op">;</span></span>
<span id="cb4-2677"><a href></a> selectedNonc <span class="op">=</span> <span class="dv">0</span><span class="op">;</span></span>
<span id="cb4-2678"><a href></a> selectedTailw <span class="op">=</span> <span class="dv">1</span><span class="op">;</span></span>
<span id="cb4-2679"><a href></a> <span class="co">// update input positions</span></span>
<span id="cb4-2680"><a href></a> sliderCont<span class="op">.</span><span class="fu">selectAll</span>(<span class="st">&#39;input&#39;</span>)<span class="op">.</span><span class="fu">property</span>(<span class="st">&#39;value&#39;</span><span class="op">,</span> d <span class="kw">=&gt;</span> d<span class="op">.</span><span class="fu">get</span>())<span class="op">;</span></span>
<span id="cb4-2681"><a href></a> <span class="co">// update displayed labels</span></span>
<span id="cb4-2682"><a href></a> sliderCont<span class="op">.</span><span class="fu">selectAll</span>(<span class="st">&#39;span&#39;</span>)</span>
<span id="cb4-2683"><a href></a> <span class="op">.</span><span class="fu">text</span>(d <span class="kw">=&gt;</span> d<span class="op">.</span><span class="at">label</span><span class="op">.</span><span class="fu">match</span>(<span class="ss">/Sigma</span><span class="sc">|</span><span class="ss">Tailweight/</span>) <span class="op">?</span> (<span class="dv">2</span><span class="op">**</span>d<span class="op">.</span><span class="fu">get</span>()) <span class="op">:</span> d<span class="op">.</span><span class="fu">get</span>())<span class="op">;</span></span>
<span id="cb4-2684"><a href></a> <span class="co">// redraw chart</span></span>
<span id="cb4-2685"><a href></a> <span class="fu">updateChart</span>(<span class="fu">filteredData</span>())<span class="op">;</span></span>
<span id="cb4-2686"><a href></a> })<span class="op">;</span></span>
<span id="cb4-2687"><a href></a></span>
<span id="cb4-2688"><a href></a> <span class="co">// Build SVG</span></span>
<span id="cb4-2689"><a href></a> <span class="kw">const</span> width <span class="op">=</span> <span class="dv">1200</span><span class="op">;</span></span>
<span id="cb4-2690"><a href></a> <span class="kw">const</span> height <span class="op">=</span> <span class="dv">450</span><span class="op">;</span></span>
<span id="cb4-2691"><a href></a> <span class="kw">const</span> margin <span class="op">=</span> {<span class="dt">top</span><span class="op">:</span> <span class="dv">40</span><span class="op">,</span> <span class="dt">right</span><span class="op">:</span> <span class="dv">20</span><span class="op">,</span> <span class="dt">bottom</span><span class="op">:</span> <span class="dv">40</span><span class="op">,</span> <span class="dt">left</span><span class="op">:</span> <span class="dv">40</span>}<span class="op">;</span></span>
<span id="cb4-2692"><a href></a> <span class="kw">const</span> innerWidth <span class="op">=</span> width <span class="op">-</span> margin<span class="op">.</span><span class="at">left</span> <span class="op">-</span> margin<span class="op">.</span><span class="at">right</span><span class="op">;</span></span>
<span id="cb4-2693"><a href></a> <span class="kw">const</span> innerHeight <span class="op">=</span> height <span class="op">-</span> margin<span class="op">.</span><span class="at">top</span> <span class="op">-</span> margin<span class="op">.</span><span class="at">bottom</span><span class="op">;</span></span>
<span id="cb4-2694"><a href></a></span>
<span id="cb4-2695"><a href></a> <span class="co">// Set controls container width to match SVG plot width</span></span>
<span id="cb4-2696"><a href></a> controlsContainer<span class="op">.</span><span class="fu">style</span>(<span class="st">&quot;max-width&quot;</span><span class="op">,</span> <span class="st">&quot;none&quot;</span>)<span class="op">.</span><span class="fu">style</span>(<span class="st">&quot;width&quot;</span><span class="op">,</span> <span class="st">&quot;100%&quot;</span>)<span class="op">;</span></span>
<span id="cb4-2697"><a href></a> <span class="co">// Distribute each control evenly and make sliders full-width</span></span>
<span id="cb4-2698"><a href></a> controlsContainer<span class="op">.</span><span class="fu">selectAll</span>(<span class="st">&quot;div&quot;</span>)<span class="op">.</span><span class="fu">style</span>(<span class="st">&quot;flex&quot;</span><span class="op">,</span> <span class="st">&quot;1&quot;</span>)<span class="op">.</span><span class="fu">style</span>(<span class="st">&quot;min-width&quot;</span><span class="op">,</span> <span class="st">&quot;0px&quot;</span>)<span class="op">;</span></span>
<span id="cb4-2699"><a href></a> controlsContainer<span class="op">.</span><span class="fu">selectAll</span>(<span class="st">&quot;input&quot;</span>)<span class="op">.</span><span class="fu">style</span>(<span class="st">&quot;width&quot;</span><span class="op">,</span> <span class="st">&quot;100%&quot;</span>)<span class="op">.</span><span class="fu">style</span>(<span class="st">&quot;box-sizing&quot;</span><span class="op">,</span> <span class="st">&quot;border-box&quot;</span>)<span class="op">;</span></span>
<span id="cb4-2700"><a href></a> </span>
<span id="cb4-2701"><a href></a> <span class="co">// Create scales</span></span>
<span id="cb4-2702"><a href></a> <span class="kw">const</span> x <span class="op">=</span> d3<span class="op">.</span><span class="fu">scaleLinear</span>()</span>
<span id="cb4-2703"><a href></a> <span class="op">.</span><span class="fu">domain</span>([<span class="dv">0</span><span class="op">,</span> <span class="dv">1</span>])</span>
<span id="cb4-2704"><a href></a> <span class="op">.</span><span class="fu">range</span>([<span class="dv">0</span><span class="op">,</span> innerWidth])<span class="op">;</span></span>
<span id="cb4-2705"><a href></a> </span>
<span id="cb4-2706"><a href></a> <span class="kw">const</span> y <span class="op">=</span> d3<span class="op">.</span><span class="fu">scaleLinear</span>()</span>
<span id="cb4-2707"><a href></a> <span class="op">.</span><span class="fu">domain</span>([<span class="dv">0</span><span class="op">,</span> <span class="dv">1</span>])</span>
<span id="cb4-2708"><a href></a> <span class="op">.</span><span class="fu">range</span>([innerHeight<span class="op">,</span> <span class="dv">0</span>])<span class="op">;</span></span>
<span id="cb4-2709"><a href></a> </span>
<span id="cb4-2710"><a href></a> <span class="co">// Create a color scale for the basis functions</span></span>
<span id="cb4-2711"><a href></a> <span class="kw">const</span> color <span class="op">=</span> d3<span class="op">.</span><span class="fu">scaleOrdinal</span>(d3<span class="op">.</span><span class="at">schemeCategory10</span>)<span class="op">;</span></span>
<span id="cb4-2712"><a href></a> </span>
<span id="cb4-2713"><a href></a> <span class="co">// Create SVG</span></span>
<span id="cb4-2714"><a href></a> <span class="kw">const</span> svg <span class="op">=</span> d3<span class="op">.</span><span class="fu">create</span>(<span class="st">&quot;svg&quot;</span>)</span>
<span id="cb4-2715"><a href></a> <span class="op">.</span><span class="fu">attr</span>(<span class="st">&quot;width&quot;</span><span class="op">,</span> <span class="st">&quot;100%&quot;</span>)</span>
<span id="cb4-2716"><a href></a> <span class="op">.</span><span class="fu">attr</span>(<span class="st">&quot;height&quot;</span><span class="op">,</span> <span class="st">&quot;auto&quot;</span>)</span>
<span id="cb4-2717"><a href></a> <span class="op">.</span><span class="fu">attr</span>(<span class="st">&quot;viewBox&quot;</span><span class="op">,</span> [<span class="dv">0</span><span class="op">,</span> <span class="dv">0</span><span class="op">,</span> width<span class="op">,</span> height])</span>
<span id="cb4-2718"><a href></a> <span class="op">.</span><span class="fu">attr</span>(<span class="st">&quot;preserveAspectRatio&quot;</span><span class="op">,</span> <span class="st">&quot;xMidYMid meet&quot;</span>)</span>
<span id="cb4-2719"><a href></a> <span class="op">.</span><span class="fu">attr</span>(<span class="st">&quot;style&quot;</span><span class="op">,</span> <span class="st">&quot;max-width: 100%; height: auto;&quot;</span>)<span class="op">;</span></span>
<span id="cb4-2720"><a href></a> </span>
<span id="cb4-2721"><a href></a> <span class="co">// Create the chart group</span></span>
<span id="cb4-2722"><a href></a> <span class="kw">const</span> g <span class="op">=</span> svg<span class="op">.</span><span class="fu">append</span>(<span class="st">&quot;g&quot;</span>)</span>
<span id="cb4-2723"><a href></a> <span class="op">.</span><span class="fu">attr</span>(<span class="st">&quot;transform&quot;</span><span class="op">,</span> <span class="vs">`translate(</span><span class="sc">${</span>margin<span class="op">.</span><span class="at">left</span><span class="sc">}</span><span class="vs">,</span><span class="sc">${</span>margin<span class="op">.</span><span class="at">top</span><span class="sc">}</span><span class="vs">)`</span>)<span class="op">;</span></span>
<span id="cb4-2724"><a href></a> </span>
<span id="cb4-2725"><a href></a> <span class="co">// Add axes</span></span>
<span id="cb4-2726"><a href></a> <span class="kw">const</span> xAxis <span class="op">=</span> g<span class="op">.</span><span class="fu">append</span>(<span class="st">&quot;g&quot;</span>)</span>
<span id="cb4-2727"><a href></a> <span class="op">.</span><span class="fu">attr</span>(<span class="st">&quot;transform&quot;</span><span class="op">,</span> <span class="vs">`translate(0,</span><span class="sc">${</span>innerHeight<span class="sc">}</span><span class="vs">)`</span>)</span>
<span id="cb4-2728"><a href></a> <span class="op">.</span><span class="fu">attr</span>(<span class="st">&quot;class&quot;</span><span class="op">,</span> <span class="st">&quot;x-axis&quot;</span>)</span>
<span id="cb4-2729"><a href></a> <span class="op">.</span><span class="fu">call</span>(d3<span class="op">.</span><span class="fu">axisBottom</span>(x)<span class="op">.</span><span class="fu">ticks</span>(<span class="dv">10</span>))</span>
<span id="cb4-2730"><a href></a> <span class="op">.</span><span class="fu">style</span>(<span class="st">&quot;font-size&quot;</span><span class="op">,</span> <span class="st">&quot;20px&quot;</span>)<span class="op">;</span></span>
<span id="cb4-2731"><a href></a> </span>
<span id="cb4-2732"><a href></a> <span class="kw">const</span> yAxis <span class="op">=</span> g<span class="op">.</span><span class="fu">append</span>(<span class="st">&quot;g&quot;</span>)</span>
<span id="cb4-2733"><a href></a> <span class="op">.</span><span class="fu">attr</span>(<span class="st">&quot;class&quot;</span><span class="op">,</span> <span class="st">&quot;y-axis&quot;</span>)</span>
<span id="cb4-2734"><a href></a> <span class="op">.</span><span class="fu">call</span>(d3<span class="op">.</span><span class="fu">axisLeft</span>(y)<span class="op">.</span><span class="fu">ticks</span>(<span class="dv">5</span>))</span>
<span id="cb4-2735"><a href></a> <span class="op">.</span><span class="fu">style</span>(<span class="st">&quot;font-size&quot;</span><span class="op">,</span> <span class="st">&quot;20px&quot;</span>)<span class="op">;</span></span>
<span id="cb4-2736"><a href></a> </span>
<span id="cb4-2737"><a href></a> <span class="co">// Add a horizontal line at y = 0</span></span>
<span id="cb4-2738"><a href></a> g<span class="op">.</span><span class="fu">append</span>(<span class="st">&quot;line&quot;</span>)</span>
<span id="cb4-2739"><a href></a> <span class="op">.</span><span class="fu">attr</span>(<span class="st">&quot;x1&quot;</span><span class="op">,</span> <span class="dv">0</span>)</span>
<span id="cb4-2740"><a href></a> <span class="op">.</span><span class="fu">attr</span>(<span class="st">&quot;x2&quot;</span><span class="op">,</span> innerWidth)</span>
<span id="cb4-2741"><a href></a> <span class="op">.</span><span class="fu">attr</span>(<span class="st">&quot;y1&quot;</span><span class="op">,</span> <span class="fu">y</span>(<span class="dv">0</span>))</span>
<span id="cb4-2742"><a href></a> <span class="op">.</span><span class="fu">attr</span>(<span class="st">&quot;y2&quot;</span><span class="op">,</span> <span class="fu">y</span>(<span class="dv">0</span>))</span>
<span id="cb4-2743"><a href></a> <span class="op">.</span><span class="fu">attr</span>(<span class="st">&quot;stroke&quot;</span><span class="op">,</span> <span class="st">&quot;#000&quot;</span>)</span>
<span id="cb4-2744"><a href></a> <span class="op">.</span><span class="fu">attr</span>(<span class="st">&quot;stroke-opacity&quot;</span><span class="op">,</span> <span class="fl">0.2</span>)<span class="op">;</span></span>
<span id="cb4-2745"><a href></a> </span>
<span id="cb4-2746"><a href></a> <span class="co">// Add gridlines</span></span>
<span id="cb4-2747"><a href></a> g<span class="op">.</span><span class="fu">append</span>(<span class="st">&quot;g&quot;</span>)</span>
<span id="cb4-2748"><a href></a> <span class="op">.</span><span class="fu">attr</span>(<span class="st">&quot;class&quot;</span><span class="op">,</span> <span class="st">&quot;grid-lines&quot;</span>)</span>
<span id="cb4-2749"><a href></a> <span class="op">.</span><span class="fu">selectAll</span>(<span class="st">&quot;line&quot;</span>)</span>
<span id="cb4-2750"><a href></a> <span class="op">.</span><span class="fu">data</span>(y<span class="op">.</span><span class="fu">ticks</span>(<span class="dv">5</span>))</span>
<span id="cb4-2751"><a href></a> <span class="op">.</span><span class="fu">join</span>(<span class="st">&quot;line&quot;</span>)</span>
<span id="cb4-2752"><a href></a> <span class="op">.</span><span class="fu">attr</span>(<span class="st">&quot;x1&quot;</span><span class="op">,</span> <span class="dv">0</span>)</span>
<span id="cb4-2753"><a href></a> <span class="op">.</span><span class="fu">attr</span>(<span class="st">&quot;x2&quot;</span><span class="op">,</span> innerWidth)</span>
<span id="cb4-2754"><a href></a> <span class="op">.</span><span class="fu">attr</span>(<span class="st">&quot;y1&quot;</span><span class="op">,</span> d <span class="kw">=&gt;</span> <span class="fu">y</span>(d))</span>
<span id="cb4-2755"><a href></a> <span class="op">.</span><span class="fu">attr</span>(<span class="st">&quot;y2&quot;</span><span class="op">,</span> d <span class="kw">=&gt;</span> <span class="fu">y</span>(d))</span>
<span id="cb4-2756"><a href></a> <span class="op">.</span><span class="fu">attr</span>(<span class="st">&quot;stroke&quot;</span><span class="op">,</span> <span class="st">&quot;#ccc&quot;</span>)</span>
<span id="cb4-2757"><a href></a> <span class="op">.</span><span class="fu">attr</span>(<span class="st">&quot;stroke-opacity&quot;</span><span class="op">,</span> <span class="fl">0.5</span>)<span class="op">;</span></span>
<span id="cb4-2758"><a href></a> </span>
<span id="cb4-2759"><a href></a> <span class="co">// Create a line generator</span></span>
<span id="cb4-2760"><a href></a> <span class="kw">const</span> line <span class="op">=</span> d3<span class="op">.</span><span class="fu">line</span>()</span>
<span id="cb4-2761"><a href></a> <span class="op">.</span><span class="fu">x</span>(d <span class="kw">=&gt;</span> <span class="fu">x</span>(d<span class="op">.</span><span class="at">x</span>))</span>
<span id="cb4-2762"><a href></a> <span class="op">.</span><span class="fu">y</span>(d <span class="kw">=&gt;</span> <span class="fu">y</span>(d<span class="op">.</span><span class="at">y</span>))</span>
<span id="cb4-2763"><a href></a> <span class="op">.</span><span class="fu">curve</span>(d3<span class="op">.</span><span class="at">curveBasis</span>)<span class="op">;</span></span>
<span id="cb4-2764"><a href></a> </span>
<span id="cb4-2765"><a href></a> <span class="co">// Group to contain the basis function lines</span></span>
<span id="cb4-2766"><a href></a> <span class="kw">const</span> linesGroup <span class="op">=</span> g<span class="op">.</span><span class="fu">append</span>(<span class="st">&quot;g&quot;</span>)</span>
<span id="cb4-2767"><a href></a> <span class="op">.</span><span class="fu">attr</span>(<span class="st">&quot;class&quot;</span><span class="op">,</span> <span class="st">&quot;basis-functions&quot;</span>)<span class="op">;</span></span>
<span id="cb4-2768"><a href></a> </span>
<span id="cb4-2769"><a href></a> <span class="co">// Store the current basis functions for transition</span></span>
<span id="cb4-2770"><a href></a> <span class="kw">let</span> currentBasisFunctions <span class="op">=</span> <span class="kw">new</span> <span class="bu">Map</span>()<span class="op">;</span></span>
<span id="cb4-2771"><a href></a> </span>
<span id="cb4-2772"><a href></a> <span class="co">// Function to update the chart with new data</span></span>
<span id="cb4-2773"><a href></a> <span class="kw">function</span> <span class="fu">updateChart</span>(data) {</span>
<span id="cb4-2774"><a href></a> <span class="fu">updateChartInner</span>(g<span class="op">,</span> x<span class="op">,</span> y<span class="op">,</span> linesGroup<span class="op">,</span> color<span class="op">,</span> line<span class="op">,</span> data)<span class="op">;</span></span>
<span id="cb4-2775"><a href></a> }</span>
<span id="cb4-2776"><a href></a> </span>
<span id="cb4-2777"><a href></a> <span class="co">// Store the update function</span></span>
<span id="cb4-2778"><a href></a> svg<span class="op">.</span><span class="fu">node</span>()<span class="op">.</span><span class="at">update</span> <span class="op">=</span> updateChart<span class="op">;</span></span>
<span id="cb4-2779"><a href></a> </span>
<span id="cb4-2780"><a href></a> <span class="co">// Initial render</span></span>
<span id="cb4-2781"><a href></a> <span class="fu">updateChart</span>(<span class="fu">filteredData</span>())<span class="op">;</span></span>
<span id="cb4-2782"><a href></a> </span>
<span id="cb4-2783"><a href></a> container<span class="op">.</span><span class="fu">node</span>()<span class="op">.</span><span class="fu">appendChild</span>(svg<span class="op">.</span><span class="fu">node</span>())<span class="op">;</span></span>
<span id="cb4-2784"><a href></a> <span class="cf">return</span> container<span class="op">.</span><span class="fu">node</span>()<span class="op">;</span></span>
<span id="cb4-2785"><a href></a>}</span></code><button title="Copy to Clipboard" class="code-copy-button"><i class="bi"></i></button></pre></div>
<div class="cell-output cell-output-display">
<div>
<div id="ojs-cell-3-1" data-nodetype="declaration">
</div>
</div>
</div>
<div class="cell-output cell-output-display">
<div>
<div id="ojs-cell-3-2" data-nodetype="declaration">
</div>
</div> </div>
</div> </div>
</div> </div>
@@ -27267,19 +27461,19 @@ Y_{t} = \mu + Y_{t-1} + \varepsilon_t \quad \text{with} \quad \varepsilon_t = \
</div><div class="column" style="width:48%;"> </div><div class="column" style="width:48%;">
<p>Using non equidistant knots in <code>profoc</code> is straightforward:</p> <p>Using non equidistant knots in <code>profoc</code> is straightforward:</p>
<div class="cell"> <div class="cell">
<div class="sourceCode cell-code" id="cb5"><pre class="sourceCode numberSource r number-lines code-with-copy"><code class="sourceCode r"><span id="cb5-1"><a href></a>mod <span class="ot">&lt;-</span> <span class="fu">online</span>(</span> <div class="sourceCode cell-code" id="cb7"><pre class="sourceCode numberSource r number-lines code-with-copy"><code class="sourceCode r"><span id="cb7-1"><a href></a>mod <span class="ot">&lt;-</span> <span class="fu">online</span>(</span>
<span id="cb5-2"><a href></a> <span class="at">y =</span> Y,</span> <span id="cb7-2"><a href></a> <span class="at">y =</span> Y,</span>
<span id="cb5-3"><a href></a> <span class="at">experts =</span> experts,</span> <span id="cb7-3"><a href></a> <span class="at">experts =</span> experts,</span>
<span id="cb5-4"><a href></a> <span class="at">tau =</span> <span class="dv">1</span><span class="sc">:</span><span class="dv">99</span> <span class="sc">/</span> <span class="dv">100</span>,</span> <span id="cb7-4"><a href></a> <span class="at">tau =</span> <span class="dv">1</span><span class="sc">:</span><span class="dv">99</span> <span class="sc">/</span> <span class="dv">100</span>,</span>
<span id="cb5-5"><a href></a> <span class="at">b_smooth_pr =</span> <span class="fu">list</span>(</span> <span id="cb7-5"><a href></a> <span class="at">b_smooth_pr =</span> <span class="fu">list</span>(</span>
<span id="cb5-6"><a href></a> <span class="at">knots =</span> <span class="dv">9</span>,</span> <span id="cb7-6"><a href></a> <span class="at">knots =</span> <span class="dv">9</span>,</span>
<span id="cb5-7"><a href></a> <span class="at">mu =</span> <span class="fl">0.3</span>,</span> <span id="cb7-7"><a href></a> <span class="at">mu =</span> <span class="fl">0.3</span>,</span>
<span id="cb5-8"><a href></a> <span class="at">sigma =</span> <span class="dv">1</span>,</span> <span id="cb7-8"><a href></a> <span class="at">sigma =</span> <span class="dv">1</span>,</span>
<span id="cb5-9"><a href></a> <span class="at">nonc =</span> <span class="dv">0</span>,</span> <span id="cb7-9"><a href></a> <span class="at">nonc =</span> <span class="dv">0</span>,</span>
<span id="cb5-10"><a href></a> <span class="at">tailweight =</span> <span class="dv">1</span>,</span> <span id="cb7-10"><a href></a> <span class="at">tailweight =</span> <span class="dv">1</span>,</span>
<span id="cb5-11"><a href></a> <span class="at">deg =</span> <span class="dv">3</span></span> <span id="cb7-11"><a href></a> <span class="at">deg =</span> <span class="dv">3</span></span>
<span id="cb5-12"><a href></a> )</span> <span id="cb7-12"><a href></a> )</span>
<span id="cb5-13"><a href></a>)</span></code><button title="Copy to Clipboard" class="code-copy-button"><i class="bi"></i></button></pre></div> <span id="cb7-13"><a href></a>)</span></code><button title="Copy to Clipboard" class="code-copy-button"><i class="bi"></i></button></pre></div>
</div> </div>
<p>Basis specification <code>b_smooth_pr</code> is internally passed to <code>make_basis_mats()</code>.</p> <p>Basis specification <code>b_smooth_pr</code> is internally passed to <code>make_basis_mats()</code>.</p>
<p><i class="fa fa-fw fa-check" style="color:var(--col_green_9);"></i> Profoc adjusts penatly and <span class="math inline">\(\lambda\)</span></p> <p><i class="fa fa-fw fa-check" style="color:var(--col_green_9);"></i> Profoc adjusts penatly and <span class="math inline">\(\lambda\)</span></p>
@@ -28236,6 +28430,9 @@ Li, Z., &amp; Cao, J. (2022). General p-splines for non-uniform b-splines. <em>a
<div id="ref-marcjasz2022distributional" class="csl-entry" role="listitem"> <div id="ref-marcjasz2022distributional" class="csl-entry" role="listitem">
Marcjasz, G., Narajewski, M., Weron, R., &amp; Ziel, F. (2023). Distributional neural networks for electricity price forecasting. <em>Energy Economics</em>, 125, 106843. DOI: <a href="https://doi.org/10.1016/j.eneco.2023.106843">10.1016/j.eneco.2023.106843</a> Marcjasz, G., Narajewski, M., Weron, R., &amp; Ziel, F. (2023). Distributional neural networks for electricity price forecasting. <em>Energy Economics</em>, 125, 106843. DOI: <a href="https://doi.org/10.1016/j.eneco.2023.106843">10.1016/j.eneco.2023.106843</a>
</div> </div>
<div id="ref-taylor2023angular" class="csl-entry" role="listitem">
Taylor, J.W., &amp; Meng, X. (2023). Angular combining of forecasts of probability distributions. <em>arXiv Preprint arXiv:2305.16735</em>. DOI: <a href="https://doi.org/10.48550/arXiv.2305.16735">10.48550/arXiv.2305.16735</a>
</div>
<div id="ref-wintenberger2017optimal" class="csl-entry" role="listitem"> <div id="ref-wintenberger2017optimal" class="csl-entry" role="listitem">
Wintenberger, O. (2017). Optimal learning with bernstein online aggregation. <em>Machine Learning</em>, 106(1), 119–141. DOI: <a href="https://doi.org/10.1007/s10994-016-5592-6">10.1007/s10994-016-5592-6</a> Wintenberger, O. (2017). Optimal learning with bernstein online aggregation. <em>Machine Learning</em>, 106(1), 119–141. DOI: <a href="https://doi.org/10.1007/s10994-016-5592-6">10.1007/s10994-016-5592-6</a>
</div> </div>
@@ -29421,10 +29618,10 @@ window.QuartoSupport = function () {
}); });
</script> </script>
<script type="ojs-module-contents"> <script type="ojs-module-contents">
eyJjb250ZW50cyI6W3sibWV0aG9kTmFtZSI6ImludGVycHJldCIsImNlbGxOYW1lIjoib2pzLWNlbGwtMSIsImlubGluZSI6ZmFsc2UsInNvdXJjZSI6ImQzID0gcmVxdWlyZShcImQzQDdcIilcbiJ9LHsibWV0aG9kTmFtZSI6ImludGVycHJldCIsImNlbGxOYW1lIjoib2pzLWNlbGwtMiIsImlubGluZSI6ZmFsc2UsInNvdXJjZSI6ImJzcGxpbmVEYXRhID0gRmlsZUF0dGFjaG1lbnQoXCJhc3NldHMvbWNycHNfbGVhcm5pbmcvYmFzaXNfZnVuY3Rpb25zLmNzdlwiKS5jc3YoeyB0eXBlZDogdHJ1ZSB9KVxuIn0seyJtZXRob2ROYW1lIjoiaW50ZXJwcmV0IiwiY2VsbE5hbWUiOiJvanMtY2VsbC0zIiwiaW5saW5lIjpmYWxzZSwic291cmNlIjoiZnVuY3Rpb24gdXBkYXRlQ2hhcnRJbm5lcihnLCB4LCB5LCBsaW5lc0dyb3VwLCBjb2xvciwgbGluZSwgZGF0YSkge1xuICAvLyBVcGRhdGUgYXhlcyB3aXRoIHRyYW5zaXRpb25zXG4gIHguZG9tYWluKFswLCBkMy5tYXgoZGF0YSwgZCA9PiBkLngpXSk7XG4gIGcuc2VsZWN0KFwiLngtYXhpc1wiKS50cmFuc2l0aW9uKCkuZHVyYXRpb24oMTUwMCkuY2FsbChkMy5heGlzQm90dG9tKHgpLnRpY2tzKDEwKSk7XG4gIHkuZG9tYWluKFswLCBkMy5tYXgoZGF0YSwgZCA9PiBkLnkpXSk7XG4gIGcuc2VsZWN0KFwiLnktYXhpc1wiKS50cmFuc2l0aW9uKCkuZHVyYXRpb24oMTUwMCkuY2FsbChkMy5heGlzTGVmdCh5KS50aWNrcyg1KSk7XG5cbiAgLy8gR3JvdXAgZGF0YSBieSBiYXNpcyBmdW5jdGlvblxuICBjb25zdCBkYXRhQnlGdW5jdGlvbiA9IEFycmF5LmZyb20oZDMuZ3JvdXAoZGF0YSwgZCA9PiBkLmIpKTtcbiAgY29uc3Qga2V5Rm4gPSBkID0+IGRbMF07XG5cbiAgLy8gVXBkYXRlIGJhc2lzIGZ1bmN0aW9uIGxpbmVzXG4gIGNvbnN0IHUgPSBsaW5lc0dyb3VwLnNlbGVjdEFsbChcInBhdGhcIikuZGF0YShkYXRhQnlGdW5jdGlvbiwga2V5Rm4pO1xuICB1LmpvaW4oXG4gICAgZW50ZXIgPT4gZW50ZXIuYXBwZW5kKFwicGF0aFwiKS5hdHRyKFwiZmlsbFwiLFwibm9uZVwiKS5hdHRyKFwic3Ryb2tlLXdpZHRoXCIsMylcbiAgICAgIC5hdHRyKFwic3Ryb2tlXCIsIChfLCBpKSA9PiBjb2xvcihpKSkuYXR0cihcImRcIiwgZCA9PiBsaW5lKGRbMV0ubWFwKHB0ID0+ICh7eDogcHQueCwgeTogMH0pKSkpXG4gICAgICAuc3R5bGUoXCJvcGFjaXR5XCIsMCksXG4gICAgdXBkYXRlID0+IHVwZGF0ZSxcbiAgICBleGl0ID0+IGV4aXQudHJhbnNpdGlvbigpLmR1cmF0aW9uKDEwMDApLnN0eWxlKFwib3BhY2l0eVwiLDApLnJlbW92ZSgpXG4gIClcbiAgLnRyYW5zaXRpb24oKS5kdXJhdGlvbigxMDAwKVxuICAgIC5hdHRyKFwiZFwiLCBkID0+IGxpbmUoZFsxXSkpXG4gICAgLmF0dHIoXCJzdHJva2VcIiwgKF8sIGkpID0+IGNvbG9yKGkpKVxuICAgIC5zdHlsZShcIm9wYWNpdHlcIiwxKTtcbn1cblxuY2hhcnQgPSB7XG4gIC8vIFN0YXRlIHZhcmlhYmxlcyBmb3Igc2VsZWN0ZWQgcGFyYW1ldGVyc1xuICBsZXQgc2VsZWN0ZWRNdSA9IDAuNTtcbiAgbGV0IHNlbGVjdGVkU2lnID0gMTtcbiAgbGV0IHNlbGVjdGVkTm9uYyA9IDA7XG4gIGxldCBzZWxlY3RlZFRhaWx3ID0gMTtcbiAgY29uc3QgZmlsdGVyZWREYXRhID0gKCkgPT4gYnNwbGluZURhdGEuZmlsdGVyKGQgPT5cbiAgICBNYXRoLmFicyhzZWxlY3RlZE11IC0gZC5tdSkgPCAwLjAwMSAmJlxuICAgIGQuc2lnID09PSBzZWxlY3RlZFNpZyAmJlxuICAgIGQubm9uYyA9PT0gc2VsZWN0ZWROb25jICYmXG4gICAgZC50YWlsdyA9PT0gc2VsZWN0ZWRUYWlsd1xuICApO1xuICBjb25zdCBjb250YWluZXIgPSBkMy5jcmVhdGUoXCJkaXZcIilcbiAgICAuc3R5bGUoXCJtYXgtd2lkdGhcIiwgXCJub25lXCIpXG4gICAgLnN0eWxlKFwid2lkdGhcIiwgXCIxMDAlXCIpOztcbiAgY29uc3QgY29udHJvbHNDb250YWluZXIgPSBjb250YWluZXIuYXBwZW5kKFwiZGl2XCIpXG4gICAgLnN0eWxlKFwiZGlzcGxheVwiLCBcImZsZXhcIilcbiAgICAuc3R5bGUoXCJnYXBcIiwgXCIyMHB4XCIpO1xuICAvLyBzbGlkZXIgY29udHJvbHNcbiAgY29uc3Qgc2xpZGVycyA9IFtcbiAgICB7IGxhYmVsOiAnTXUnLCBnZXQ6ICgpID0+IHNlbGVjdGVkTXUsIHNldDogdiA9PiBzZWxlY3RlZE11ID0gdiwgbWluOiAwLjEsIG1heDogMC45LCBzdGVwOiAwLjIgfSxcbiAgICB7IGxhYmVsOiAnU2lnbWEnLCBnZXQ6ICgpID0+IE1hdGgubG9nMihzZWxlY3RlZFNpZyksIHNldDogdiA9PiBzZWxlY3RlZFNpZyA9IDIgKiogdiwgbWluOiAtMiwgbWF4OiAyLCBzdGVwOiAxIH0sXG4gICAgeyBsYWJlbDogJ05vbmNlbnRyYWxpdHknLCBnZXQ6ICgpID0+IHNlbGVjdGVkTm9uYywgc2V0OiB2ID0+IHNlbGVjdGVkTm9uYyA9IHYsIG1pbjogLTQsIG1heDogNCwgc3RlcDogMiB9LFxuICAgIHsgbGFiZWw6ICdUYWlsd2VpZ2h0JywgZ2V0OiAoKSA9PiBNYXRoLmxvZzIoc2VsZWN0ZWRUYWlsdyksIHNldDogdiA9PiBzZWxlY3RlZFRhaWx3ID0gMiAqKiB2LCBtaW46IC0yLCBtYXg6IDIsIHN0ZXA6IDEgfVxuICBdO1xuICAvLyBCdWlsZCBzbGlkZXIgY29udHJvbHMgd2l0aCBEMyBkYXRhIGpvaW5cbiAgY29uc3Qgc2xpZGVyQ29udCA9IGNvbnRyb2xzQ29udGFpbmVyLnNlbGVjdEFsbCgnZGl2JykuZGF0YShzbGlkZXJzKS5qb2luKCdkaXYnKVxuICAgIC5zdHlsZSgnZGlzcGxheScsJ2ZsZXgnKS5zdHlsZSgnYWxpZ24taXRlbXMnLCdjZW50ZXInKS5zdHlsZSgnZ2FwJywnMTBweCcpXG4gICAgLnN0eWxlKCdmbGV4JywnMScpLnN0eWxlKCdtaW4td2lkdGgnLCcwcHgnKTtcbiAgc2xpZGVyQ29udC5hcHBlbmQoJ2xhYmVsJykudGV4dChkID0+IGQubGFiZWwgKyAnOicpLnN0eWxlKCdmb250LXNpemUnLCcyMHB4Jyk7XG4gIHNsaWRlckNvbnQuYXBwZW5kKCdpbnB1dCcpXG4gICAgLmF0dHIoJ3R5cGUnLCdyYW5nZScpLmF0dHIoJ21pbicsIGQgPT4gZC5taW4pLmF0dHIoJ21heCcsIGQgPT4gZC5tYXgpLmF0dHIoJ3N0ZXAnLCBkID0+IGQuc3RlcClcbiAgICAucHJvcGVydHkoJ3ZhbHVlJywgZCA9PiBkLmdldCgpKVxuICAgIC5vbignaW5wdXQnLCBmdW5jdGlvbihldmVudCwgZCkge1xuICAgICAgY29uc3QgdmFsID0gK3RoaXMudmFsdWU7IGQuc2V0KHZhbCk7XG4gICAgICBkMy5zZWxlY3QodGhpcy5wYXJlbnROb2RlKS5zZWxlY3QoJ3NwYW4nKS50ZXh0KGQubGFiZWwubWF0Y2goL1NpZ21hfFRhaWx3ZWlnaHQvKSA/IDIqKnZhbCA6IHZhbCk7XG4gICAgICB1cGRhdGVDaGFydChmaWx0ZXJlZERhdGEoKSk7XG4gICAgfSlcbiAgICAuc3R5bGUoJ3dpZHRoJywgJzEwMCUnKTtcbiAgc2xpZGVyQ29udC5hcHBlbmQoJ3NwYW4nKS50ZXh0KGQgPT4gKGQubGFiZWwubWF0Y2goL1NpZ21hfFRhaWx3ZWlnaHQvKSA/IGQuZ2V0KCkgOiBkLmdldCgpKSlcbiAgICAuc3R5bGUoJ2ZvbnQtc2l6ZScsJzIwcHgnKTtcbiAgXG4gIC8vIEFkZCBSZXNldCBidXR0b24gdG8gY2xlYXIgYWxsIHNsaWRlcnMgdG8gdGhlaXIgZGVmYXVsdHNcbiAgY29udHJvbHNDb250YWluZXIuYXBwZW5kKCdidXR0b24nKVxuICAgIC50ZXh0KCdSZXNldCcpXG4gICAgLnN0eWxlKCdmb250LXNpemUnLCAnMjBweCcpXG4gICAgLnN0eWxlKCdhbGlnbi1zZWxmJywgJ2NlbnRlcicpXG4gICAgLnN0eWxlKCdtYXJnaW4tbGVmdCcsICdhdXRvJylcbiAgICAub24oJ2NsaWNrJywgKCkgPT4ge1xuICAgICAgLy8gcmVzZXQgc3RhdGUgdmFyc1xuICAgICAgc2VsZWN0ZWRNdSA9IDAuNTtcbiAgICALine truncated eyJjb250ZW50cyI6W3sibWV0aG9kTmFtZSI6ImludGVycHJldCIsImNlbGxOYW1lIjoib2pzLWNlbGwtMSIsImlubGluZSI6ZmFsc2UsInNvdXJjZSI6ImQzID0gcmVxdWlyZShcImQzQDdcIilcbiJ9LHsibWV0aG9kTmFtZSI6ImludGVycHJldCIsImNlbGxOYW1lIjoib2pzLWNlbGwtMiIsImlubGluZSI6ZmFsc2UsInNvdXJjZSI6ImNkZl9kYXRhID0gRmlsZUF0dGFjaG1lbnQoXCJhc3NldHMvY3Jwc19sZWFybmluZy93ZWlnaHRzX3Bsb3QvY2RmX2RhdGEuY3N2XCIpLmNzdih7IHR5cGVkOiB0cnVlIH0pXG4ifSx7Im1ldGhvZE5hbWUiOiJpbnRlcnByZXQiLCJjZWxsTmFtZSI6Im9qcy1jZWxsLTMiLCJpbmxpbmUiOmZhbHNlLCJzb3VyY2UiOiJmdW5jdGlvbiB1cGRhdGVDaGFydElubmVyKGcsIHgsIHksIGxpbmVzR3JvdXAsIGNvbG9yLCBsaW5lLCBkYXRhKSB7XG4gIC8vIFVwZGF0ZSBheGVzIHdpdGggdHJhbnNpdGlvbnNcbiAgeC5kb21haW4oZDMuZXh0ZW50KGRhdGEsIGQgPT4gZC54KSk7XG4gIGcuc2VsZWN0KFwiLngtYXhpc1wiKS50cmFuc2l0aW9uKCkuZHVyYXRpb24oMTUwMCkuY2FsbChkMy5heGlzQm90dG9tKHgpLnRpY2tzKDEwKSk7XG4gIHkuZG9tYWluKFswLCBkMy5tYXgoZGF0YSwgZCA9PiBkLnkpXSk7XG4gIGcuc2VsZWN0KFwiLnktYXhpc1wiKS50cmFuc2l0aW9uKCkuZHVyYXRpb24oMTUwMCkuY2FsbChkMy5heGlzTGVmdCh5KS50aWNrcyg1KSk7XG5cbiAgLy8gR3JvdXAgZGF0YSBieSBiYXNpcyBmdW5jdGlvblxuICBjb25zdCBkYXRhQnlGdW5jdGlvbiA9IEFycmF5LmZyb20oZDMuZ3JvdXAoZGF0YSwgZCA9PiBkLmIpKTtcbiAgY29uc3Qga2V5Rm4gPSBkID0+IGRbMF07XG5cbiAgLy8gVXBkYXRlIGJhc2lzIGZ1bmN0aW9uIGxpbmVzXG4gIGNvbnN0IHUgPSBsaW5lc0dyb3VwLnNlbGVjdEFsbChcInBhdGhcIikuZGF0YShkYXRhQnlGdW5jdGlvbiwga2V5Rm4pO1xuICB1LmpvaW4oXG4gICAgZW50ZXIgPT4gZW50ZXIuYXBwZW5kKFwicGF0aFwiKS5hdHRyKFwiZmlsbFwiLFwibm9uZVwiKS5hdHRyKFwic3Ryb2tlLXdpZHRoXCIsMylcbiAgICAgIC5hdHRyKFwic3Ryb2tlXCIsIChfLCBpKSA9PiBjb2xvcihpKSkuYXR0cihcImRcIiwgZCA9PiBsaW5lKGRbMV0ubWFwKHB0ID0+ICh7eDogcHQueCwgeTogMH0pKSkpXG4gICAgICAuc3R5bGUoXCJvcGFjaXR5XCIsMCksXG4gICAgdXBkYXRlID0+IHVwZGF0ZSxcbiAgICBleGl0ID0+IGV4aXQudHJhbnNpdGlvbigpLmR1cmF0aW9uKDEwMDApLnN0eWxlKFwib3BhY2l0eVwiLDApLnJlbW92ZSgpXG4gIClcbiAgLnRyYW5zaXRpb24oKS5kdXJhdGlvbigxMDAwKVxuICAgIC5hdHRyKFwiZFwiLCBkID0+IGxpbmUoZFsxXSkpXG4gICAgLmF0dHIoXCJzdHJva2VcIiwgKF8sIGkpID0+IGNvbG9yKGkpKVxuICAgIC5zdHlsZShcIm9wYWNpdHlcIiwxKTtcbn1cblxuY2hhcnQgPSB7XG4gIC8vIFN0YXRlIHZhcmlhYmxlIGZvciBzZWxlY3RlZCBtdSBwYXJhbWV0ZXJcbiAgbGV0IHNlbGVjdGVkTXUgPSAxO1xuICBcbiAgY29uc3QgZmlsdGVyZWREYXRhID0gKCkgPT4gY2RmX2RhdGEuZmlsdGVyKGQgPT5cbiAgICBNYXRoLmFicyhzZWxlY3RlZE11IC0gZC5tdSkgPCAwLjAwMVxuICApO1xuICBcbiAgY29uc3QgY29udGFpbmVyID0gZDMuY3JlYXRlKFwiZGl2XCIpXG4gICAgLnN0eWxlKFwibWF4LXdpZHRoXCIsIFwibm9uZVwiKVxuICAgIC5zdHlsZShcIndpZHRoXCIsIFwiMTAwJVwiKTtcbiAgICBcbiAgY29uc3QgY29udHJvbHNDb250YWluZXIgPSBjb250YWluZXIuYXBwZW5kKFwiZGl2XCIpXG4gICAgLnN0eWxlKFwiZGlzcGxheVwiLCBcImZsZXhcIilcbiAgICAuc3R5bGUoXCJnYXBcIiwgXCIyMHB4XCIpXG4gICAgLnN0eWxlKFwiYWxpZ24taXRlbXNcIiwgXCJjZW50ZXJcIik7XG4gIFxuICAvLyBTaW5nbGUgc2xpZGVyIGNvbnRyb2wgZm9yIG11XG4gIGNvbnN0IHNsaWRlckNvbnRhaW5lciA9IGNvbnRyb2xzQ29udGFpbmVyLmFwcGVuZCgnZGl2JylcbiAgICAuc3R5bGUoJ2Rpc3BsYXknLCdmbGV4JylcbiAgICAuc3R5bGUoJ2FsaWduLWl0ZW1zJywnY2VudGVyJylcbiAgICAuc3R5bGUoJ2dhcCcsJzEwcHgnKVxuICAgIC5zdHlsZSgnZmxleCcsJzEnKTtcbiAgICBcbiAgc2xpZGVyQ29udGFpbmVyLmFwcGVuZCgnbGFiZWwnKVxuICAgIC50ZXh0KCdOYWl2ZTonKVxuICAgIC5zdHlsZSgnZm9udC1zaXplJywnMjBweCcpO1xuICAgIFxuICBjb25zdCBtdVNsaWRlciA9IHNsaWRlckNvbnRhaW5lci5hcHBlbmQoJ2lucHV0JylcbiAgICAuYXR0cigndHlwZScsJ3JhbmdlJylcbiAgICAuYXR0cignbWluJywgMClcbiAgICAuYXR0cignbWF4JywgMSlcbiAgICAuYXR0cignc3RlcCcsIDAuMSlcbiAgICAucHJvcGVydHkoJ3ZhbHVlJywgc2VsZWN0ZWRNdSlcbiAgICAub24oJ2lucHV0JywgZnVuY3Rpb24oZXZlbnQpIHtcbiAgICAgIHNlbGVjdGVkTXUgPSArdGhpcy52YWx1ZTtcbiAgICAgIG11RGlzcGxheS50ZXh0KHNlbGVjdGVkTXUudG9GaXhlZCgxKSk7XG4gICAgICB1cGRhdGVDaGFydChmaWx0ZXJlZERhdGEoKSk7XG4gICAgfSlcbiAgICAuc3R5bGUoJ3dpZHRoJywgJzEwMCUnKVxuICAgIC8vLnN0eWxlKCctd2Via2l0LWFwcGVhcmFuY2UnLCAnbm9uZScpXG4gICAgLnN0eWxlKCdhcHBlYXJhbmNlJywgJ25vbmUnKVxuICAgIC5zdHlsZSgnaGVpZ2h0JywgJzhweCcpXG4gICAgLnN0eWxlKCdiYWNrZ3JvdW5kJywgJyNCREJEQkRGRicpO1xuICAgIFxuICBjb25zdCBtdURpc3BsYXkgPSBzbGlkZXJDb250YWluZXIuYXBwZW5kKCdzcGFuJylcbiAgICAudGV4dChzZWxlY3RlZE11LnRvRml4ZWQoMSkpXG4gICAgLnN0eWxlKCdmb250LXNpemUnLCcyMHB4Jyk7XG4gIFxuICAvLyBBZGQgUmVzZXQgYnV0dG9uXG4gIGNvbnRyb2xzQ29udGFpbmVyLmFwcGVuZCgnYnV0dG9uJylcbiAgICAudGV4dCgnUmVzZXQnKVxuICAgIC5zdHlsZSgnZm9udC1zaXplJywgJzIwcHgnKVxuICAgIC5zdHlsZSgnYWxpZ24tc2VsZicsICdjZW50ZXInKVxuICAgIC5zdHlsZSgnbWFyZ2luLWxlZnQnLCAnYXV0bycpXG4gICAgLm9uKCdjbGljaycsICgpID0+IHtcbiAgICAgIHNlbGVjdGVkTXUgPSAwLjU7XG4gICAgICBtdVNsaWRlci5wcm9wZXJ0eSgndmFsdWUnLCBzZWxlY3RlZE11KTtcbiAgICAgIG11RGlzcGxheS50ZXh0KHNlbGVjdGVkTXUudG9GaXhlZCgxKSk7XG4gICAgICB1cGRhdGVDaGFydChmaWx0ZXJlZERhdGEoKSk7XG4gICAgfSk7XG5cbiAgIC8vIEJ1aWxkIFNWR1xuICAgY29uc3Qgd2lkdGggPSA2MDA7XG4gICBjb25zdCBoZWlnaHQgPSA0NTA7XG4gICBjb25zdCBtYXJnaW4gPSB7dG9wOiA0MCwgcmlnaHQ6IDIwLCBib3R0b206IDQwLCBsZWZ0OiA0MH07XG4gICBjb25zdCBpbm5lcldpZHRoID0gd2lkdGggLSBtYXJnaW4ubGVmdCAtIG1hcmdpbi5yaWdodDtcbiAgIGNvbnN0IGlubmVySGVpZ2h0ID0gaGVpZ2h0IC0gbWFyZ2luLnRvcCAtIG1hcmdpbi5ib3R0b207XG5cbiAgIC8vIFNldCBjb250cm9scyBjb250YWluZXIgd2lkdGggdG8gbWF0Y2ggU1ZHIHBsb3Qgd2lkdGhcbiAgIGNvbnRyb2xzQ29udGFpbmVyLnN0eWxlKFwibWF4LXdpZHRoXCIsIFwibm9uZVwiKS5zdHlsZShcIndpZHRoXCIsIFwiMTAwJVwiKTtcbiAgIC8vIERpc3RyaWJ1dGUgZWFjaCBjb250cm9sIGV2ZW5seSBhbmQgbWFrZSBzbGlkZXJzIGZ1bGwtd2lkdGhcbiAgIGNvbnRyb2xzQ29udGFpbmVyLnNlbGVjdEFsbChcImRpdlwiKS5zdHlsZShLine truncated
</script> </script>
<script type="module"> <script type="module">
window._ojs.runtime.setLocalResolver({"assets/mcrps_learning/basis_functions.csv":"data:text/csv;base64,eCxiLHksa25vdHMsbXUsc2lnLG5vbmMsdGFpbHcsZGVnCjAsVjEsMC44LDUsMC4xLDAuMjUsLTQsMC4yNSwyCjAsVjIsMC4yLDUsMC4xLDAuMjUsLTQsMC4yNSwyCjAsVjMsMCw1LDAuMSwwLjI1LC00LDAuMjUsMgowLFY0LDAsNSwwLjEsMC4yNSwtNCwwLjI1LDIKMCxWNSwwLDUsMC4xLDAuMjUsLTQsMC4yNSwyCjAsVjYsMCw1LDAuMSwwLjI1LC00LDAuMjUsMgowLjA0LFYxLDAuNzMzNyw1LDAuMSwwLjI1LC00LDAuMjUsMgowLjA0LFYyLDAuMjY0NTUsNSwwLjEsMC4yNSwtNCwwLjI1LDIKMC4wNCxWMywwLjAwMTc1LDUsMC4xLDAuMjUsLTQsMC4yNSwyCjAuMDQsVjQsMCw1LDAuMSwwLjI1LC00LDAuMjUsMgowLjA0LFY1LDAsNSwwLjEsMC4yNSwtNCwwLjI1LDIKMC4wNCxWNiwwLDUsMC4xLDAuMjUsLTQsMC4yNSwyCjAuMDgsVjEsMC42NzAyOCw1LDAuMSwwLjI1LC00LDAuMjUsMgowLjA4LFYyLDAuMzIyNzMsNSwwLjEsMC4yNSwtNCwwLjI1LDIKMC4wOCxWMywwLjAwNjk5LDUsMC4xLDAuMjUsLTQsMC4yNSwyCjAuMDgsVjQsMCw1LDAuMSwwLjI1LC00LDAuMjUsMgowLjA4LFY1LDAsNSwwLjEsMC4yNSwtNCwwLjI1LDIKMC4wOCxWNiwwLDUsMC4xLDAuMjUsLTQsMC4yNSwyCjAuMTIsVjEsMC42MDk3Miw1LDAuMSwwLjI1LC00LDAuMjUsMgowLjEyLFYyLDAuMzc0NTYsNSwwLjEsMC4yNSwtNCwwLjI1LDIKMC4xMixWMywwLjAxNTczLDUsMC4xLDAuMjUsLTQsMC4yNSwyCjAuMTIsVjQsMCw1LDAuMSwwLjI1LC00LDAuMjUsMgowLjEyLFY1LDAsNSwwLjEsMC4yNSwtNCwwLjI1LDIKMC4xMixWNiwwLDUsMC4xLDAuMjUsLTQsMC4yNSwyCjAuMTYsVjEsMC41NTIwMiw1LDAuMSwwLjI1LC00LDAuMjUsMgowLjE2LFYyLDAuNDIwMDIsNSwwLjEsMC4yNSwtNCwwLjI1LDIKMC4xNixWMywwLjAyNzk2LDUsMC4xLDAuMjUsLTQsMC4yNSwyCjAuMTYsVjQsMCw1LDAuMSwwLjI1LC00LDAuMjUsMgowLjE2LFY1LDAsNSwwLjEsMC4yNSwtNCwwLjI1LDIKMC4xNixWNiwwLDUsMC4xLDAuMjUsLTQsMC4yNSwyCjAuMixWMSwwLjQ5NzE5LDUsMC4xLDAuMjUsLTQsMC4yNSwyCjAuMixWMiwwLjQ1OTExLDUsMC4xLDAuMjUsLTQsMC4yNSwyCjAuMixWMywwLjA0MzY5LDUsMC4xLDAuMjUsLTQsMC4yNSwyCjAuMixWNCwwLDUsMC4xLDAuMjUsLTQsMC4yNSwyCjAuMixWNSwwLDUsMC4xLDAuMjUsLTQsMC4yNSwyCjAuMixWNiwwLDUsMC4xLDAuMjUsLTQsMC4yNSwyCjAuMjQsVjEsMC40NDUyMyw1LDAuMSwwLjI1LC00LDAuMjUsMgowLjI0LFYyLDAuNDkxODUsNSwwLjEsMC4yNSwtNCwwLjI1LDIKMC4yNCxWMywwLjA2MjkyLDUsMC4xLDAuMjUsLTQsMC4yNSwyCjAuMjQsVjQsMCw1LDAuMSwwLjI1LC00LDAuMjUsMgowLjI0LFY1LDAsNSwwLjEsMC4yNSwtNCwwLjI1LDIKMC4yNCxWNiwwLDUsMC4xLDAuMjUsLTQsMC4yNSwyCjAuMjgsVjEsMC4zOTYxNCw1LDAuMSwwLjI1LC00LDAuMjUsMgowLjI4LFYyLDAuNTE4MjIsNSwwLjEsMC4yNSwtNCwwLjI1LDIKMC4yOCxWMywwLjA4NTY0LDUsMC4xLDAuMjUsLTQsMC4yNSwyCjAuMjgsVjQsMCw1LDAuMSwwLjI1LC00LDAuMjUsMgowLjI4LFY1LDAsNSwwLjEsMC4yNSwtNCwwLjI1LDIKMC4yOCxWNiwwLDUsMC4xLDAuMjUsLTQsMC4yNSwyCjAuMzIsVjEsMC4zNDk5MSw1LDAuMSwwLjI1LC00LDAuMjUsMgowLjMyLFYyLDAuNTM4MjMsNSwwLjEsMC4yNSwtNCwwLjI1LDIKMC4zMixWMywwLjExMTg1LDUsMC4xLDAuMjUsLTQsMC4yNSwyCjAuMzIsVjQsMCw1LDAuMSwwLjI1LC00LDAuMjUsMgowLjMyLFY1LDAsNSwwLjEsMC4yNSwtNCwwLjI1LDIKMC4zMixWNiwwLDUsMC4xLDAuMjUsLTQsMC4yNSwyCjAuMzYsVjEsMC4zMDY1NSw1LDAuMSwwLjI1LC00LDAuMjUsMgowLjM2LFYyLDAuNTUxODgsNSwwLjEsMC4yNSwtNCwwLjI1LDIKMC4zNixWMywwLjE0MTU2LDUsMC4xLDAuMjUsLTQsMC4yNSwyCjAuMzYsVjQsMCw1LDAuMSwwLjI1LC00LDAuMjUsMgowLjM2LFY1LDAsNSwwLjEsMC4yNSwtNCwwLjI1LDIKMC4zNixWNiwwLDUsMC4xLDAuMjUsLTQsMC4yNSwyCjAuNCxWMSwwLjI2NjA2LDUsMC4xLDAuMjUsLTQsMC4yNSwyCjAuNCxWMiwwLjU1OTE3LDUsMC4xLDAuMjUsLTQsMC4yNSwyCjAuNCxWMywwLjE3NDc3LDUsMC4xLDAuMjUsLTQsMC4yNSwyCjAuNCxWNCwwLDUsMC4xLDAuMjUsLTQsMC4yNSwyCjAuNCxWNSwwLDUsMC4xLDAuMjUsLTQsMC4yNSwyCjAuNCxWNiwwLDUsMC4xLDAuMjUsLTQsMC4yNSwyCjAuNDQsVjEsMC4yMjg0NCw1LDAuMSwwLjI1LC00LDAuMjUsMgowLjQ0LFYyLDAuNTYwMDksNSwwLjEsMC4yNSwtNCwwLjI1LDIKMC40NCxWMywwLjIxMTQ3LDUsMC4xLDAuMjUsLTQsMC4yNSwyCjAuNDQsVjQsMCw1LDAuMSwwLjI1LC00LDAuMjUsMgowLjQ0LFY1LDAsNSwwLjEsMC4yNSwtNCwwLjI1LDIKMC40NCxWNiwwLDUsMC4xLDAuMjUsLTQsMC4yNSwyCjAuNDgsVjEsMC4xOTM2OCw1LDAuMSwwLjI1LC00LDAuMjUsMgowLjQ4LFYyLDAuNTU0NjUsNSwwLjEsMC4yNSwtNCwwLjI1LDIKMC40OCxWMywwLjI1MTY3LDUsMC4xLDAuMjUsLTQsMC4yNSwyCjAuNDgsVjQsMCw1LDAuMSwwLjI1LC00LDAuMjUsMgowLjQ4LFY1LDAsNSwwLjEsMC4yNSwtNCwwLjI1LDIKMC40OCxWNiwwLDUsMC4xLDAuMjUsLTQsMC4yNSwyCjAuNTIsVjEsMC4xNjE3OSw1LDAuMSwwLjI1LC00LDAuMjUsMgowLjUyLFYyLDAuNTQyODUsNSwwLjEsMC4yNSwtNCwwLjI1LDIKMC41MixWMywwLjI5NTM2LDUsMC4xLDAuMjUsLTQsMC4yNSwyCjAuNTIsVjQsMCw1LDAuMSwwLjI1LC00LDAuMjUsMgowLjUyLFY1LDAsNSwwLjEsMC4yNSwtNCwwLjI1LDIKMC41MixWNiwwLDUsMC4xLDAuMjUsLTQsMC4yNSwyCjAuNTYsVjEsMC4xMzI3Niw1LDAuMSwwLjI1LC00LDAuMjUsMgowLjU2LFYyLDAuNTI0NjksNSwwLjEsMC4yNSwtNCwwLjI1LDIKMC41NixWMywwLjM0MjU1LDUsMC4xLDAuMjUsLTQsMC4yNSwyCjAuNTYsVjQsMCw1LDAuMSwwLjI1LC00LDAuMjUsMgowLjU2LFY1LDAsNSwwLjEsMC4yNSwtNCwwLjI1LDIKMC41NixWNiwwLDUsMC4xLDAuMjUsLTQsMC4yNSwyCjAuNixWMSwwLjEwNjYxLDUsMC4xLDAuMjUsLTQsMC4yNSwyCjAuNixWMiwwLjUwMDE2LDUsMC4xLDAuMjUsLTQsMC4yNSwyCjAuNixWMywwLjM5MzI0LDUsMC4xLDAuMjUsLTQsMC4yNSwyCjAuNixWNCwwLDUsMC4xLDAuMjUsLTQsMC4yNSwyCjAuNixWNSwwLDUsMC4xLDAuMjUsLTQsMC4yNSwyCjAuNixWNiwwLDUsMC4xLDAuMjUsLTQsMC4yNSwyCjAuNjQsVjEsMC4wODMzMiw1LDAuMSwwLjI1LC00LDAuMjUsMgowLjY0LFYyLDAuNDY5MjcsNSwwLjEsMC4yNSwtNCwwLjI1LDIKMC42NCxWMywwLjQ0NzQxLDUsMC4xLDAuMjUsLTQsMC4yNSwyCjAuNjQsVjQsMCw1LDAuMSwwLjI1LC00LDAuMjUsMgowLjY0LFY1LDAsNSwwLjEsMC4yNSwtNCwwLjI1LDIKMC42NCxWNiwwLDUsMC4xLDAuMjUsLTQsMC4yNSwyCjAuNjgsVjEsMC4wNjI4OSw1LDAuMSwwLjI1LC00LDAuMjUsMgowLjY4LFYyLDAuNDMyMDIsNSwwLjEsMC4yNSwtNCwwLjI1LDIKMC42OCxWMywwLjUwNTA5LDUsMC4xLDAuMjUsLTQsMC4yNSwyCjAuNjgsVjQsMCw1LDAuMSwwLjI1LC00LDAuMjUsMgowLjY4LFY1LDAsNSwwLjEsMC4yNSwtNCwwLjI1LDIKMC42OCxWNiwwLDUsMC4xLDAuMjUsLTQsMC4yNSwyCjAuNzIsVjEsMC4wNDULine truncated window._ojs.runtime.setLocalResolver({"assets/crps_learning/weights_plot/cdf_data.csv":"data:text/csv;base64,eSx4LGIsbXUKMCwtNC4wOTAyMzIzMDYxNjc4MTMsMSwwCjAsLTQuMDkwMjMyMzA2MTY3ODEzLDIsMAowLjAwMSwtNC4wOTAyMzIzMDYxNjc4MTMsMSwwCjAuMDAxLC0zLjE4MDQ2NDYxMjMzNTYyNjQsMiwwCjAuMDAyLC0zLjg3ODE2MTczOTA5NTQ4MjYsMSwwCjAuMDAyLC0yLjc1NjMyMzQ3ODE5MDk2NSwyLDAKMC4wMDMsLTMuNzQ3NzgxMzg1NDQ0OTkzLDEsMAowLjAwMywtMi40OTU1NjI3NzA4ODk5ODYsMiwwCjAuMDA0LC0zLjY1MjA2OTgwNzkwMjE5NTQsMSwwCjAuMDA0LC0yLjMwNDEzOTYxNTgwNDM5MDgsMiwwCjAuMDA1LC0zLjU3NTgyOTMwMzU0ODksMSwwCjAuMDA1LC0yLjE1MTY1ODYwNzA5NzgsMiwwCjAuMDA2LC0zLjUxMjE0NDMyNzkzMDQ2MTYsMSwwCjAuMDA2LC0yLjAyNDI4ODY1NTg2MDkyMywyLDAKMC4wMDcsLTMuNDU3MjYzMzkwMjA1NDM3NSwxLDAKMC4wMDcsLTEuOTE0NTI2NzgwNDEwODc1LDIsMAowLjAwOCwtMy40MDg5MTU1NDU4MTU0NjEsMSwwCjAuMDA4LC0xLjgxNzgzMTA5MTYzMDkyMjQsMiwwCjAuMDA5LC0zLjM2NTYxODEyNjg2NDI5MiwxLDAKMC4wMDksLTEuNzMxMjM2MjUzNzI4NTg0LDIsMAowLjAxLC0zLjMyNjM0Nzg3NDA0MDg0MDgsMSwwCjAuMDEsLTEuNjUyNjk1NzQ4MDgxNjgxNSwyLDAKMC4wMTEsLTMuMjkwMzY3ODc3ODU1MjY3LDEsMAowLjAxMSwtMS41ODA3MzU3NTU3MTA1MzQsMiwwCjAuMDEyLC0zLjI1NzEyOTI0NDQ4NjIyNSwxLDAKMC4wMTIsLTEuNTE0MjU4NDg4OTcyNDUsMiwwCjAuMDEzLC0zLjIyNjIxMTc2OTMxNzE3NSwxLDAKMC4wMTMsLTEuNDUyNDIzNTM4NjM0MzUsMiwwCjAuMDE0LC0zLjE5NzI4NjM3NjY0MTA1MTgsMSwwCjAuMDE0LC0xLjM5NDU3Mjc1MzI4MjEwMzUsMiwwCjAuMDE1LC0zLjE3MDA5MDM3NzU4NDU2LDEsMAowLjAxNSwtMS4zNDAxODA3NTUxNjkxMjAzLDIsMAowLjAxNiwtMy4xNDQ0MTA2MjA5MTE4NCwxLDAKMC4wMTYsLTEuMjg4ODIxMjQxODIzNjc5NywyLDAKMC4wMTcsLTMuMTIwMDcxNjg5NzQyMTUwMywxLDAKMC4wMTcsLTEuMjQwMTQzMzc5NDg0MzAwNiwyLDAKMC4wMTgsLTMuMDk2OTI3NDI5MTY0MzQyLDEsMAowLjAxOCwtMS4xOTM4NTQ4NTgzMjg2ODM3LDIsMAowLjAxOSwtMy4wNzQ4NTQ3MzQzOTMzMDk1LDEsMAowLjAxOSwtMS4xNDk3MDk0Njg3ODY2MTksMiwwCjAuMDIsLTMuMDUzNzQ4OTEwNjMxODIyNSwxLDAKMC4wMiwtMS4xMDc0OTc4MjEyNjM2NDUsMiwwCjAuMDIxLC0zLjAzMzUyMDE0OTI1MzA1MDYsMSwwCjAuMDIxLC0xLjA2NzA0MDI5ODUwNjEwMTIsMiwwCjAuMDIyLC0zLjAxNDA5MDgxMjAxODEzOTMsMSwwCjAuMDIyLC0xLjAyODE4MTYyNDAzNjI3ODcsMiwwCjAuMDIzLC0yLjk5NTM5MzMxMDE2NzgyNDcsMSwwCjAuMDIzLC0wLjk5MDc4NjYyMDMzNTY0OTUsMiwwCjAuMDI0LC0yLjk3NzM2ODQyODE4MTk0NywxLDAKMC4wMjQsLTAuOTU0NzM2ODU2MzYzODkzNiwyLDAKMC4wMjUsLTIuOTU5OTYzOTg0NTQwMDU0LDEsMAowLjAyNSwtMC45MTk5Mjc5NjkwODAxMDc3LDIsMAowLjAyNiwtMi45NDMxMzM3NTExMDUwNjY2LDEsMAowLjAyNiwtMC44ODYyNjc1MDIyMTAxMzI3LDIsMAowLjAyNywtMi45MjY4MzY1NzMyNjM5MTEsMSwwCjAuMDI3LC0wLjg1MzY3MzE0NjUyNzgyMTEsMiwwCjAuMDI4LC0yLjkxMTAzNTY0NzU0OTExOCwxLDAKMC4wMjgsLTAuODIyMDcxMjk1MDk4MjM1OCwyLDAKMC4wMjksLTIuODk1Njk3OTIzOTkxODM4MywxLDAKMC4wMjksLTAuNzkxMzk1ODQ3OTgzNjc2NywyLDAKMC4wMywtMi44ODA3OTM2MDgxNTEyNTEsMSwwCjAuMDMsLTAuNzYxNTg3MjE2MzAyNTAxNywyLDAKMC4wMzEsLTIuODY2Mjk1NzQzNDU4MTA3NiwxLDAKMC4wMzEsLTAuNzMyNTkxNDg2OTE2MjE0NywyLDAKMC4wMzIsLTIuODUyMTc5ODU4NzY5MDQ2NiwxLDAKMC4wMzIsLTAuNzA0MzU5NzE3NTM4MDkzMSwyLDAKMC4wMzMsLTIuODM4NDIzNjY5MjQ3Nzc3LDEsMAowLjAzMywtMC42NzY4NDczMzg0OTU1NTMzLDIsMAowLjAzNCwtMi44MjUwMDY4MjExNDY0MDMsMSwwCjAuMDM0LC0wLjY1MDAxMzY0MjI5MjgwNiwyLDAKMC4wMzUsLTIuODExOTEwNjcyOTUyNTk4LDEsMAowLjAzNSwtMC42MjM4MjEzNDU5MDUxOTU2LDIsMAowLjAzNiwtMi43OTkxMTgxMDY4Mzc5NjcsMSwwCjAuMDM2LC0wLjU5ODIzNjIxMzY3NTkzMzQsMiwwCjAuMDM3LC0yLjc4NjYxMzM2NTQ5MzQ3LDEsMAowLjAzNywtMC41NzMyMjY3MzA5ODY5Mzk5LDIsMAowLjAzOCwtMi43NzQzODE5MTAzNDQ5NTcsMSwwCjAuMDM4LC0wLjU0ODc2MzgyMDY4OTkxNDQsMiwwCjAuMDM5LC0yLjc2MjQxMDI5Nzg2MjM4OTUsMSwwCjAuMDM5LC0wLjUyNDgyMDU5NTcyNDc3ODksMiwwCjAuMDQsLTIuNzUwNjg2MDcxMjUyMTY5NSwxLDAKMC4wNCwtMC41MDEzNzIxNDI1MDQzMzg5LDIsMAowLjA0MSwtMi43MzkxOTc2NjUyODUyNTE3LDEsMAowLjA0MSwtMC40NzgzOTUzMzA1NzA1MDMzLDIsMAowLjA0MiwtMi43Mjc5MzQzMjIzODg0MTg1LDEsMAowLjA0MiwtMC40NTU4Njg2NDQ3NzY4MzY1MywyLDAKMC4wNDMsLTIuNzE2ODg2MDE4NDMxMDQwNCwxLDAKMC4wNDMsLTAuNDMzNzcyMDM2ODYyMDgwNzcsMiwwCjAuMDQ0LC0yLjcwNjA0MzM5Njg4ODk2MSwxLDAKMC4wNDQsLTAuNDEyMDg2NzkzNzc3OTIyNDYsMiwwCjAuMDQ1LC0yLjY5NTM5NzcxMDI3MjEzNiwxLDAKMC4wNDUsLTAuMzkwNzk1NDIwNTQ0MjcxNjMsMiwwCjAuMDQ2LC0yLjY4NDk0MDc2Nzg3MTkxNDYsMSwwCjAuMDQ2LC0wLjM2OTg4MTUzNTc0MzgyOTIsMiwwCjAuMDQ3LC0yLjY3NDY2NDg4OTAyNDMyNSwxLDAKMC4wNDcsLTAuMzQ5MzI5Nzc4MDQ4NjUwNCwyLDAKMC4wNDgsLTIuNjY0NTYyODYxMjAyNzIxNywxLDAKMC4wNDgsLTAuMzI5MTI1NzIyNDA1NDQyOSwyLDAKMC4wNDksLTIuNjU0NjI3OTAyMzUxMDc3LDEsMAowLjA0OSwtMC4zMDkyNTU4MDQ3MDIxNTQ1LDIsMAowLjA1LC0yLjY0NDg1MzYyNjk1MTQ3MjQsMSwwCjAuMDUsLTAuMjg5NzA3MjUzOTAyOTQ1MjcsMiwwCjAuMDUxLC0yLjYzNTIzNDAxNTM4ODY1LDEsMAowLjA1MSwtMC4yNzA0NjgwMzA3NzczLDIsMAowLjA1MiwtMi42MjU3NjMzODYyMzMyMzQ0LDEsMAowLjA1MiwtMC4yNTE1MjY3NzI0NjY0Njg3LDIsMAowLjA1MywtMi42MTY0MzYzNzExMTUwMjE2LDEsMAowLjA1MywtMC4yMzI4NzI3NDIyMzAwNDI3MywyLDAKMC4wNTQsLTIuNjA3MjQ3ODkxOTAwMjE3OCwxLDAKMC4wNTQsLTAuMjE0NDk1NzgzODAwNDM2LDIsMAowLjA1NSwtMi41OTgxOTMxMzk5MjI4MTc1LDEsMAowLjA1NSwtMC4xOTYzODYyNzk4NDU2MzQ2MSwyLDAKMC4wNTYsLTIuNTg5MjY3NTU3MDUxMzkyLDEsMAowLjA1NiwtMC4xNzg1MzUxMTQxMDI3ODM3OCwyLDAKMC4wNTcsLTIuNTgwNDY2ODE4Mzk5MzYyLDEsMAowLjA1NywtMC4xNjA5MzM2MzY3OTg3MjM1MiwyLDAKMC4wNTgsLTIuNTcxNzg2ODE2NTA5ODU5LDEsMAowLjA1OCwtMC4xNDM1NzM2MzMwMTk3MTg4MiwyLDAKMC4wNTksLTIuNTYzMjIzNjQ2ODY2Mjc2LDEsMAowLjA1OSwtMC4xMjY0NDcyOTM3MzI1NTE4LDIsMAowLjA2LC0yLjU1NDc3MzU5NDU5Njg1MywxLDAKMC4wNiwtMC4xMDk1NDcxODkxOTM3MDYxLDIsMAowLjA2MSwtMi41NDY0MzMxMjIyNTY3NDczLDEsMAowLjA2MSwtMC4wOTI4NjYyNDQ1MTM0OTUxMiwyLDAKMC4wNjLine truncated
if (window.location.protocol === "file:") { alert("The OJS runtime does not work with file:// URLs. Please use a web server to view this document."); } if (window.location.protocol === "file:") { alert("The OJS runtime does not work with file:// URLs. Please use a web server to view this document."); }
window._ojs.paths.runtimeToDoc = "../../.."; window._ojs.paths.runtimeToDoc = "../../..";
window._ojs.paths.runtimeToRoot = "../../.."; window._ojs.paths.runtimeToRoot = "../../..";