j1-template 2022.5.0 → 2022.5.1.rc0

data/lib/starter_web/pages/public/_jupyter/notebooks/textbooks/Choropleth.html

@@ -1,318 +0,0 @@
-  <div class="cell text_cell">
-    <button class="js-nbinteract-widget">
-      Loading widgets...
-    </button>
-  </div>
-
-
-
-<div class="cell border-box-sizing text_cell rendered"><div class="inner_cell">
-<div class="text_cell_render border-box-sizing rendered_html">
-<h2 id="Wealth-Of-Nations-Dashboard">Wealth Of Nations Dashboard<a class="anchor-link" href="#Wealth-Of-Nations-Dashboard">&#182;</a></h2><ol>
-<li>Use the dropdown to select the data type</li>
-<li>Use the slider to show the heatmap for a specific year</li>
-<li>Use the animation button to animate the choropleth for all the years</li>
-<li>Clicking on any country toggles the display of timeseries for that country. (Clicking on oceans un-selects all the countries)</li>
-</ol>
-
-</div>
-</div>
-</div>
-
-  
-
-  <div class="
-      cell border-box-sizing code_cell rendered">
-    <div class="input">
-
-<div class="inner_cell">
-    <div class="input_area">
-<div class=" highlight hl-ipython3"><pre><span></span><span class="kn">import</span> <span class="nn">numpy</span> <span class="k">as</span> <span class="nn">np</span>
-<span class="kn">import</span> <span class="nn">pandas</span> <span class="k">as</span> <span class="nn">pd</span>
-
-<span class="kn">import</span> <span class="nn">ipywidgets</span> <span class="k">as</span> <span class="nn">widgets</span>
-<span class="kn">import</span> <span class="nn">bqplot</span> <span class="k">as</span> <span class="nn">bq</span>
-<span class="kn">import</span> <span class="nn">bqplot.pyplot</span> <span class="k">as</span> <span class="nn">plt</span>
-</pre></div>
-
-    </div>
-</div>
-</div>
-
-  </div>
-
-  
-
-  <div class="
-      cell border-box-sizing code_cell rendered">
-    <div class="input">
-
-<div class="inner_cell">
-    <div class="input_area">
-<div class=" highlight hl-ipython3"><pre><span></span><span class="n">initial_year</span> <span class="o">=</span> <span class="mi">1800</span>
-</pre></div>
-
-    </div>
-</div>
-</div>
-
-  </div>
-
-  
-
-  <div class="
-      cell border-box-sizing code_cell rendered">
-    <div class="input">
-
-<div class="inner_cell">
-    <div class="input_area">
-<div class=" highlight hl-ipython3"><pre><span></span><span class="n">data</span> <span class="o">=</span> <span class="n">pd</span><span class="o">.</span><span class="n">read_json</span><span class="p">(</span><span class="s2">&quot;nations.json&quot;</span><span class="p">)</span>
-<span class="n">country_codes</span> <span class="o">=</span> <span class="n">pd</span><span class="o">.</span><span class="n">read_csv</span><span class="p">(</span><span class="s2">&quot;world_map_codes.csv&quot;</span><span class="p">)</span>
-<span class="n">country_code_map</span> <span class="o">=</span> <span class="nb">dict</span><span class="p">(</span><span class="nb">zip</span><span class="p">(</span><span class="n">country_codes</span><span class="p">[</span><span class="s2">&quot;ISON3&quot;</span><span class="p">],</span> <span class="n">country_codes</span><span class="p">[</span><span class="s2">&quot;Name&quot;</span><span class="p">]))</span>
-</pre></div>
-
-    </div>
-</div>
-</div>
-
-  </div>
-
-  
-
-  <div class="
-      cell border-box-sizing code_cell rendered">
-    <div class="input">
-
-<div class="inner_cell">
-    <div class="input_area">
-<div class=" highlight hl-ipython3"><pre><span></span><span class="n">country_data</span> <span class="o">=</span> <span class="p">(</span>
-    <span class="n">data</span><span class="o">.</span><span class="n">merge</span><span class="p">(</span><span class="n">country_codes</span><span class="p">,</span> <span class="n">left_on</span><span class="o">=</span><span class="s2">&quot;name&quot;</span><span class="p">,</span> <span class="n">right_on</span><span class="o">=</span><span class="s2">&quot;Name&quot;</span><span class="p">)[</span>
-        <span class="p">[</span><span class="s2">&quot;name&quot;</span><span class="p">,</span> <span class="s2">&quot;ISON3&quot;</span><span class="p">,</span> <span class="s2">&quot;region&quot;</span><span class="p">,</span> <span class="s2">&quot;income&quot;</span><span class="p">,</span> <span class="s2">&quot;lifeExpectancy&quot;</span><span class="p">,</span> <span class="s2">&quot;population&quot;</span><span class="p">]</span>
-    <span class="p">]</span>
-    <span class="o">.</span><span class="n">rename</span><span class="p">(</span><span class="n">columns</span><span class="o">=</span><span class="p">{</span><span class="s2">&quot;ISON3&quot;</span><span class="p">:</span> <span class="s2">&quot;id&quot;</span><span class="p">})</span>
-    <span class="o">.</span><span class="n">set_index</span><span class="p">(</span><span class="s2">&quot;id&quot;</span><span class="p">)</span>
-<span class="p">)</span>
-</pre></div>
-
-    </div>
-</div>
-</div>
-
-  </div>
-
-  
-
-  <div class="
-      cell border-box-sizing code_cell rendered">
-    <div class="input">
-
-<div class="inner_cell">
-    <div class="input_area">
-<div class=" highlight hl-ipython3"><pre><span></span><span class="k">def</span> <span class="nf">get_time_series</span><span class="p">(</span><span class="n">col</span><span class="p">):</span>
-    <span class="n">time_series_df</span> <span class="o">=</span> <span class="n">country_data</span><span class="p">[</span><span class="n">col</span><span class="p">]</span><span class="o">.</span><span class="n">apply</span><span class="p">(</span><span class="nb">dict</span><span class="p">)</span><span class="o">.</span><span class="n">apply</span><span class="p">(</span><span class="n">pd</span><span class="o">.</span><span class="n">Series</span><span class="p">)</span>
-    <span class="n">time_series_df</span><span class="o">.</span><span class="n">index</span><span class="o">.</span><span class="n">name</span> <span class="o">=</span> <span class="kc">None</span>
-    <span class="n">time_series_df</span><span class="o">.</span><span class="n">columns</span> <span class="o">=</span> <span class="n">time_series_df</span><span class="o">.</span><span class="n">columns</span><span class="o">.</span><span class="n">astype</span><span class="p">(</span><span class="s2">&quot;int&quot;</span><span class="p">)</span>
-
-    <span class="k">return</span> <span class="n">time_series_df</span>
-</pre></div>
-
-    </div>
-</div>
-</div>
-
-  </div>
-
-  
-
-  <div class="
-      cell border-box-sizing code_cell rendered">
-    <div class="input">
-
-<div class="inner_cell">
-    <div class="input_area">
-<div class=" highlight hl-ipython3"><pre><span></span><span class="n">income_time_series</span> <span class="o">=</span> <span class="n">get_time_series</span><span class="p">(</span><span class="s2">&quot;income&quot;</span><span class="p">)</span>
-<span class="n">life_exp_time_series</span> <span class="o">=</span> <span class="n">get_time_series</span><span class="p">(</span><span class="s2">&quot;lifeExpectancy&quot;</span><span class="p">)</span>
-<span class="n">pop_time_series</span> <span class="o">=</span> <span class="n">get_time_series</span><span class="p">(</span><span class="s2">&quot;population&quot;</span><span class="p">)</span>
-</pre></div>
-
-    </div>
-</div>
-</div>
-
-  </div>
-
-  
-
-  <div class="
-      cell border-box-sizing code_cell rendered">
-    <div class="input">
-
-<div class="inner_cell">
-    <div class="input_area">
-<div class=" highlight hl-ipython3"><pre><span></span><span class="n">income_min</span><span class="p">,</span> <span class="n">income_max</span> <span class="o">=</span> <span class="n">income_time_series</span><span class="o">.</span><span class="n">min</span><span class="p">()</span><span class="o">.</span><span class="n">min</span><span class="p">(),</span> <span class="n">income_time_series</span><span class="o">.</span><span class="n">max</span><span class="p">()</span><span class="o">.</span><span class="n">max</span><span class="p">()</span>
-<span class="n">life_exp_min</span><span class="p">,</span> <span class="n">life_exp_max</span> <span class="o">=</span> <span class="p">(</span>
-    <span class="n">life_exp_time_series</span><span class="o">.</span><span class="n">min</span><span class="p">()</span><span class="o">.</span><span class="n">min</span><span class="p">(),</span>
-    <span class="n">life_exp_time_series</span><span class="o">.</span><span class="n">max</span><span class="p">()</span><span class="o">.</span><span class="n">max</span><span class="p">(),</span>
-<span class="p">)</span>
-<span class="n">pop_min</span><span class="p">,</span> <span class="n">pop_max</span> <span class="o">=</span> <span class="n">pop_time_series</span><span class="o">.</span><span class="n">min</span><span class="p">()</span><span class="o">.</span><span class="n">min</span><span class="p">(),</span> <span class="n">pop_time_series</span><span class="o">.</span><span class="n">max</span><span class="p">()</span><span class="o">.</span><span class="n">max</span><span class="p">()</span>
-</pre></div>
-
-    </div>
-</div>
-</div>
-
-  </div>
-
-  
-
-  <div class="
-      cell border-box-sizing code_cell rendered">
-    <div class="input">
-
-<div class="inner_cell">
-    <div class="input_area">
-<div class=" highlight hl-ipython3"><pre><span></span><span class="n">data_dict</span> <span class="o">=</span> <span class="p">{</span>
-    <span class="s2">&quot;Income&quot;</span><span class="p">:</span> <span class="n">income_time_series</span><span class="p">,</span>
-    <span class="s2">&quot;Population&quot;</span><span class="p">:</span> <span class="n">pop_time_series</span><span class="p">,</span>
-    <span class="s2">&quot;Life Expectancy&quot;</span><span class="p">:</span> <span class="n">life_exp_time_series</span><span class="p">,</span>
-<span class="p">}</span>
-
-<span class="n">min_max_dict</span> <span class="o">=</span> <span class="p">{</span>
-    <span class="s2">&quot;Income&quot;</span><span class="p">:</span> <span class="p">(</span><span class="n">np</span><span class="o">.</span><span class="n">log</span><span class="p">(</span><span class="n">income_min</span><span class="p">),</span> <span class="n">np</span><span class="o">.</span><span class="n">log</span><span class="p">(</span><span class="n">income_max</span><span class="p">)),</span>
-    <span class="s2">&quot;Population&quot;</span><span class="p">:</span> <span class="p">(</span><span class="n">np</span><span class="o">.</span><span class="n">log</span><span class="p">(</span><span class="n">pop_min</span><span class="p">),</span> <span class="n">np</span><span class="o">.</span><span class="n">log</span><span class="p">(</span><span class="n">pop_max</span><span class="p">)),</span>
-    <span class="s2">&quot;Life Expectancy&quot;</span><span class="p">:</span> <span class="p">(</span><span class="n">life_exp_min</span><span class="p">,</span> <span class="n">life_exp_max</span><span class="p">),</span>
-<span class="p">}</span>
-
-<span class="n">color_scheme_dict</span> <span class="o">=</span> <span class="p">{</span>
-    <span class="s2">&quot;Income&quot;</span><span class="p">:</span> <span class="s2">&quot;Greens&quot;</span><span class="p">,</span>
-    <span class="s2">&quot;Population&quot;</span><span class="p">:</span> <span class="s2">&quot;Blues&quot;</span><span class="p">,</span>
-    <span class="s2">&quot;Life Expectancy&quot;</span><span class="p">:</span> <span class="s2">&quot;Oranges&quot;</span><span class="p">,</span>
-<span class="p">}</span>
-
-<span class="n">data_type_dropdown</span> <span class="o">=</span> <span class="n">widgets</span><span class="o">.</span><span class="n">Dropdown</span><span class="p">(</span>
-    <span class="n">description</span><span class="o">=</span><span class="s2">&quot;Data Type&quot;</span><span class="p">,</span>
-    <span class="n">options</span><span class="o">=</span><span class="p">[</span><span class="s2">&quot;Income&quot;</span><span class="p">,</span> <span class="s2">&quot;Life Expectancy&quot;</span><span class="p">,</span> <span class="s2">&quot;Population&quot;</span><span class="p">],</span>
-    <span class="n">value</span><span class="o">=</span><span class="s2">&quot;Population&quot;</span><span class="p">,</span>
-<span class="p">)</span>
-
-<span class="n">year_slider</span> <span class="o">=</span> <span class="n">widgets</span><span class="o">.</span><span class="n">IntSlider</span><span class="p">(</span>
-    <span class="n">description</span><span class="o">=</span><span class="s2">&quot;year&quot;</span><span class="p">,</span>
-    <span class="nb">min</span><span class="o">=</span><span class="mi">1800</span><span class="p">,</span>
-    <span class="nb">max</span><span class="o">=</span><span class="mi">2008</span><span class="p">,</span>
-    <span class="n">continuous_update</span><span class="o">=</span><span class="kc">False</span><span class="p">,</span>
-    <span class="n">layout</span><span class="o">=</span><span class="n">widgets</span><span class="o">.</span><span class="n">Layout</span><span class="p">(</span><span class="n">width</span><span class="o">=</span><span class="s2">&quot;300px&quot;</span><span class="p">),</span>
-<span class="p">)</span>
-
-<span class="n">play_button</span> <span class="o">=</span> <span class="n">widgets</span><span class="o">.</span><span class="n">Play</span><span class="p">(</span><span class="nb">min</span><span class="o">=</span><span class="mi">1800</span><span class="p">,</span> <span class="nb">max</span><span class="o">=</span><span class="mi">2008</span><span class="p">,</span> <span class="n">interval</span><span class="o">=</span><span class="mi">10</span><span class="p">)</span>
-<span class="n">widgets</span><span class="o">.</span><span class="n">jslink</span><span class="p">((</span><span class="n">play_button</span><span class="p">,</span> <span class="s2">&quot;value&quot;</span><span class="p">),</span> <span class="p">(</span><span class="n">year_slider</span><span class="p">,</span> <span class="s2">&quot;value&quot;</span><span class="p">))</span>
-
-<span class="c1"># world map</span>
-<span class="n">world_map_fig_title_tmpl</span> <span class="o">=</span> <span class="s2">&quot;World </span><span class="si">{data_type}</span><span class="s2"> for year </span><span class="si">{year}</span><span class="s2">&quot;</span>
-<span class="n">world_map_fig</span> <span class="o">=</span> <span class="n">plt</span><span class="o">.</span><span class="n">figure</span><span class="p">(</span>
-    <span class="n">layout</span><span class="o">=</span><span class="n">widgets</span><span class="o">.</span><span class="n">Layout</span><span class="p">(</span><span class="n">width</span><span class="o">=</span><span class="s2">&quot;1000px&quot;</span><span class="p">,</span> <span class="n">height</span><span class="o">=</span><span class="s2">&quot;500px&quot;</span><span class="p">),</span>
-    <span class="n">fig_margin</span><span class="o">=</span><span class="nb">dict</span><span class="p">(</span><span class="n">top</span><span class="o">=</span><span class="mi">45</span><span class="p">,</span> <span class="n">bottom</span><span class="o">=</span><span class="mi">10</span><span class="p">,</span> <span class="n">left</span><span class="o">=</span><span class="mi">20</span><span class="p">,</span> <span class="n">right</span><span class="o">=</span><span class="mi">20</span><span class="p">),</span>
-<span class="p">)</span>
-<span class="n">tooltip</span> <span class="o">=</span> <span class="n">bq</span><span class="o">.</span><span class="n">Tooltip</span><span class="p">(</span><span class="n">fields</span><span class="o">=</span><span class="p">[</span><span class="s2">&quot;name&quot;</span><span class="p">],</span> <span class="n">labels</span><span class="o">=</span><span class="p">[</span><span class="s2">&quot;Country&quot;</span><span class="p">])</span>
-
-<span class="n">plt</span><span class="o">.</span><span class="n">scales</span><span class="p">(</span><span class="n">scales</span><span class="o">=</span><span class="p">{</span><span class="s2">&quot;projection&quot;</span><span class="p">:</span> <span class="n">bq</span><span class="o">.</span><span class="n">Mercator</span><span class="p">(),</span> <span class="s2">&quot;color&quot;</span><span class="p">:</span> <span class="n">bq</span><span class="o">.</span><span class="n">ColorScale</span><span class="p">()})</span>
-
-<span class="n">world_map</span> <span class="o">=</span> <span class="n">plt</span><span class="o">.</span><span class="n">geo</span><span class="p">(</span>
-    <span class="n">map_data</span><span class="o">=</span><span class="s2">&quot;WorldMap&quot;</span><span class="p">,</span>
-    <span class="n">tooltip</span><span class="o">=</span><span class="n">tooltip</span><span class="p">,</span>
-    <span class="n">interactions</span><span class="o">=</span><span class="p">{</span><span class="s2">&quot;click&quot;</span><span class="p">:</span> <span class="s2">&quot;select&quot;</span><span class="p">,</span> <span class="s2">&quot;hover&quot;</span><span class="p">:</span> <span class="s2">&quot;tooltip&quot;</span><span class="p">},</span>
-    <span class="n">axes_options</span><span class="o">=</span><span class="p">{</span><span class="s2">&quot;color&quot;</span><span class="p">:</span> <span class="p">{</span><span class="s2">&quot;visible&quot;</span><span class="p">:</span> <span class="kc">False</span><span class="p">}},</span>
-    <span class="n">selected_styles</span><span class="o">=</span><span class="p">{</span><span class="s2">&quot;selected_fill&quot;</span><span class="p">:</span> <span class="s2">&quot;yellow&quot;</span><span class="p">},</span>
-    <span class="n">colors</span><span class="o">=</span><span class="p">{</span><span class="s2">&quot;default_color&quot;</span><span class="p">:</span> <span class="s2">&quot;Grey&quot;</span><span class="p">},</span>
-<span class="p">)</span>
-
-<span class="c1"># data time series fig</span>
-<span class="n">ts_fig_title_tmpl</span> <span class="o">=</span> <span class="s2">&quot;</span><span class="si">{data_type}</span><span class="s2"> Time Series&quot;</span>
-<span class="n">time_series_fig</span> <span class="o">=</span> <span class="n">plt</span><span class="o">.</span><span class="n">figure</span><span class="p">(</span>
-    <span class="n">layout</span><span class="o">=</span><span class="n">widgets</span><span class="o">.</span><span class="n">Layout</span><span class="p">(</span><span class="n">width</span><span class="o">=</span><span class="s2">&quot;1000px&quot;</span><span class="p">,</span> <span class="n">height</span><span class="o">=</span><span class="s2">&quot;400px&quot;</span><span class="p">),</span>
-    <span class="n">fig_margin</span><span class="o">=</span><span class="nb">dict</span><span class="p">(</span><span class="n">top</span><span class="o">=</span><span class="mi">40</span><span class="p">,</span> <span class="n">bottom</span><span class="o">=</span><span class="mi">30</span><span class="p">,</span> <span class="n">left</span><span class="o">=</span><span class="mi">60</span><span class="p">,</span> <span class="n">right</span><span class="o">=</span><span class="mi">40</span><span class="p">),</span>
-<span class="p">)</span>
-<span class="n">country_time_series</span> <span class="o">=</span> <span class="n">plt</span><span class="o">.</span><span class="n">plot</span><span class="p">(</span>
-    <span class="nb">list</span><span class="p">(</span><span class="n">pop_time_series</span><span class="o">.</span><span class="n">columns</span><span class="p">),</span>
-    <span class="p">[],</span>
-    <span class="n">axes_options</span><span class="o">=</span><span class="p">{</span><span class="s2">&quot;x&quot;</span><span class="p">:</span> <span class="p">{</span><span class="s2">&quot;label&quot;</span><span class="p">:</span> <span class="s2">&quot;Year&quot;</span><span class="p">},</span> <span class="s2">&quot;y&quot;</span><span class="p">:</span> <span class="p">{</span><span class="s2">&quot;tick_format&quot;</span><span class="p">:</span> <span class="s2">&quot;~s&quot;</span><span class="p">}},</span>
-    <span class="n">display_legend</span><span class="o">=</span><span class="kc">True</span><span class="p">,</span>
-<span class="p">)</span>
-
-<span class="c1"># link widgets</span>
-<span class="k">def</span> <span class="nf">on_data_type_update</span><span class="p">(</span><span class="o">*</span><span class="n">args</span><span class="p">):</span>
-    <span class="k">global</span> <span class="n">data_time_series</span>
-    <span class="c1"># reset color and selected attributes of world_map</span>
-    <span class="n">world_map</span><span class="o">.</span><span class="n">color</span> <span class="o">=</span> <span class="p">{}</span>
-    <span class="n">world_map</span><span class="o">.</span><span class="n">selected</span> <span class="o">=</span> <span class="p">[]</span>
-
-    <span class="n">data_type</span> <span class="o">=</span> <span class="n">data_type_dropdown</span><span class="o">.</span><span class="n">value</span>
-    <span class="n">data_time_series</span> <span class="o">=</span> <span class="n">data_dict</span><span class="p">[</span><span class="n">data_type</span><span class="p">]</span>
-
-    <span class="n">scale_min</span><span class="p">,</span> <span class="n">scale_max</span> <span class="o">=</span> <span class="n">min_max_dict</span><span class="p">[</span><span class="n">data_type</span><span class="p">]</span>
-    <span class="n">color_scale</span> <span class="o">=</span> <span class="n">world_map</span><span class="o">.</span><span class="n">scales</span><span class="p">[</span><span class="s2">&quot;color&quot;</span><span class="p">]</span>
-    <span class="n">color_scale</span><span class="o">.</span><span class="n">scheme</span> <span class="o">=</span> <span class="n">color_scheme_dict</span><span class="p">[</span><span class="n">data_type</span><span class="p">]</span>
-    <span class="n">color_scale</span><span class="o">.</span><span class="n">min</span> <span class="o">=</span> <span class="n">scale_min</span>
-    <span class="n">color_scale</span><span class="o">.</span><span class="n">max</span> <span class="o">=</span> <span class="n">scale_max</span>
-    <span class="n">year_slider</span><span class="o">.</span><span class="n">value</span> <span class="o">=</span> <span class="n">initial_year</span>
-
-
-<span class="n">data_type_dropdown</span><span class="o">.</span><span class="n">observe</span><span class="p">(</span><span class="n">on_data_type_update</span><span class="p">,</span> <span class="s2">&quot;value&quot;</span><span class="p">)</span>
-
-
-<span class="k">def</span> <span class="nf">update_color</span><span class="p">(</span><span class="o">*</span><span class="n">args</span><span class="p">):</span>
-    <span class="n">data_type</span> <span class="o">=</span> <span class="n">data_type_dropdown</span><span class="o">.</span><span class="n">value</span>
-    <span class="n">year</span> <span class="o">=</span> <span class="n">year_slider</span><span class="o">.</span><span class="n">value</span>
-
-    <span class="k">if</span> <span class="n">year</span> <span class="ow">in</span> <span class="n">data_time_series</span><span class="o">.</span><span class="n">columns</span><span class="p">:</span>
-        <span class="k">if</span> <span class="n">data_type</span> <span class="ow">in</span> <span class="p">[</span><span class="s2">&quot;Population&quot;</span><span class="p">,</span> <span class="s2">&quot;Income&quot;</span><span class="p">]:</span>
-            <span class="n">color_data</span> <span class="o">=</span> <span class="n">np</span><span class="o">.</span><span class="n">log</span><span class="p">(</span><span class="n">data_time_series</span><span class="p">[</span><span class="n">year</span><span class="p">])</span>
-        <span class="k">else</span><span class="p">:</span>
-            <span class="n">color_data</span> <span class="o">=</span> <span class="n">data_time_series</span><span class="p">[</span><span class="n">year</span><span class="p">]</span>
-        <span class="n">world_map</span><span class="o">.</span><span class="n">color</span> <span class="o">=</span> <span class="nb">dict</span><span class="p">(</span><span class="n">color_data</span><span class="p">)</span>
-    <span class="k">else</span><span class="p">:</span>
-        <span class="n">world_map</span><span class="o">.</span><span class="n">color</span> <span class="o">=</span> <span class="p">{}</span>
-
-    <span class="n">world_map_fig</span><span class="o">.</span><span class="n">title</span> <span class="o">=</span> <span class="n">world_map_fig_title_tmpl</span><span class="o">.</span><span class="n">format</span><span class="p">(</span>
-        <span class="n">data_type</span><span class="o">=</span><span class="n">data_type</span><span class="p">,</span> <span class="n">year</span><span class="o">=</span><span class="n">year</span>
-    <span class="p">)</span>
-
-
-<span class="n">year_slider</span><span class="o">.</span><span class="n">observe</span><span class="p">(</span><span class="n">update_color</span><span class="p">,</span> <span class="s2">&quot;value&quot;</span><span class="p">)</span>
-
-
-<span class="k">def</span> <span class="nf">plot_time_series_for_country</span><span class="p">(</span><span class="o">*</span><span class="n">args</span><span class="p">):</span>
-    <span class="k">if</span> <span class="n">world_map</span><span class="o">.</span><span class="n">selected</span> <span class="ow">is</span> <span class="ow">not</span> <span class="kc">None</span> <span class="ow">and</span> <span class="nb">len</span><span class="p">(</span><span class="n">world_map</span><span class="o">.</span><span class="n">selected</span><span class="p">)</span> <span class="o">&gt;</span> <span class="mi">0</span><span class="p">:</span>
-        <span class="n">selected_countries</span> <span class="o">=</span> <span class="n">world_map</span><span class="o">.</span><span class="n">selected</span>
-        <span class="n">country_time_series</span><span class="o">.</span><span class="n">y</span> <span class="o">=</span> <span class="n">data_time_series</span><span class="o">.</span><span class="n">loc</span><span class="p">[</span><span class="n">selected_countries</span><span class="p">]</span>
-        <span class="n">country_time_series</span><span class="o">.</span><span class="n">labels</span> <span class="o">=</span> <span class="p">[</span>
-            <span class="n">country_code_map</span><span class="p">[</span><span class="n">c_id</span><span class="p">]</span> <span class="k">for</span> <span class="n">c_id</span> <span class="ow">in</span> <span class="n">selected_countries</span>
-        <span class="p">]</span>
-    <span class="k">else</span><span class="p">:</span>
-        <span class="n">country_time_series</span><span class="o">.</span><span class="n">labels</span> <span class="o">=</span> <span class="p">[]</span>
-        <span class="n">country_time_series</span><span class="o">.</span><span class="n">y</span> <span class="o">=</span> <span class="p">[]</span>
-    <span class="n">time_series_fig</span><span class="o">.</span><span class="n">title</span> <span class="o">=</span> <span class="n">ts_fig_title_tmpl</span><span class="o">.</span><span class="n">format</span><span class="p">(</span><span class="n">data_type</span><span class="o">=</span><span class="n">data_type_dropdown</span><span class="o">.</span><span class="n">value</span><span class="p">)</span>
-
-
-<span class="n">world_map</span><span class="o">.</span><span class="n">observe</span><span class="p">(</span><span class="n">plot_time_series_for_country</span><span class="p">,</span> <span class="s2">&quot;selected&quot;</span><span class="p">)</span>
-
-<span class="n">on_data_type_update</span><span class="p">(</span><span class="kc">None</span><span class="p">)</span>
-
-<span class="n">widgets</span><span class="o">.</span><span class="n">VBox</span><span class="p">(</span>
-    <span class="p">[</span>
-        <span class="n">world_map_fig</span><span class="p">,</span>
-        <span class="n">widgets</span><span class="o">.</span><span class="n">HBox</span><span class="p">(</span>
-            <span class="p">[</span>
-                <span class="n">time_series_fig</span><span class="p">,</span>
-                <span class="n">widgets</span><span class="o">.</span><span class="n">VBox</span><span class="p">([</span><span class="n">data_type_dropdown</span><span class="p">,</span> <span class="n">year_slider</span><span class="p">,</span> <span class="n">play_button</span><span class="p">]),</span>
-            <span class="p">]</span>
-        <span class="p">),</span>
-    <span class="p">]</span>
-<span class="p">)</span>
-</pre></div>
-
-    </div>
-</div>
-</div>
-
-  </div>
-