j1-template 2022.5.0.rc1 → 2022.5.0.rc4

data/lib/starter_web/pages/public/_jupyter/notebooks/textbooks/Feature_Vector_Distribution-Iris-Digits.html

@@ -0,0 +1,479 @@
+  <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="Tutorial-for-building-a-feature-vector-distribution-plot">Tutorial for building a feature vector distribution plot<a class="anchor-link" href="#Tutorial-for-building-a-feature-vector-distribution-plot">&#182;</a></h2><p>In this tutorial we will build an interactive widget using bqplot and ipywidgets. bqplot is a powerful interactive plotting library for jupyter. Its main power comes from how well integrated it is into the ipywidgets library. There are a few things you should understand before diving into this tutorial.</p>
+<h3 id="ipywidgets:">ipywidgets:<a class="anchor-link" href="#ipywidgets:">&#182;</a></h3><ul>
+<li><p>Widgets: Widgets python objects which link directly to their html counterpart allowing easy interaction between js,css,html and python.</p>
+</li>
+<li><p>Boxes: Boxes allow you to group widgets together, this can be either vertical or horizontally.</p>
+</li>
+</ul>
+<h3 id="bqplot:">bqplot:<a class="anchor-link" href="#bqplot:">&#182;</a></h3><ul>
+<li><p>Figures: Figures are a canvas that you will mark on. Its best to think of the figure as another widget (which it is)</p>
+</li>
+<li><p>Marks: marks are things that you draw onto the figure, these are composed of a variety of chart types such as bars, lines, histograms etc. You can put a bunch of marks on a single figure.</p>
+</li>
+</ul>
+<p>If you are used to matplotlib, the paradigm of how axis and scales are used in bqplot can be somewhat counterintuitive at first, so take some time to read the documentation and play around until you understand them. Once you do, they are very powerful when you want to link multiple plots together.</p>
+<ul>
+<li><p>Axis: Axis describe what the lines around a figure will look like. Only figures have axis, marks don't.</p>
+</li>
+<li><p>Scales: The scale describes how ranges should be displayed ie. linear or logarithmic. Scales are used by both axis and marks. Their max and min can auto aujust to the data, or be set. Be careful, you can add an axis to a figure that has a different scale than the one a mark you are adding to the figure has.</p>
+</li>
+<li><p>Tooltips: These allow you to add information on hover. They only accept three fields 'name', 'x' and 'y'. So in this tutorial we put all of the infomration we want to show into the name column as a string.</p>
+</li>
+</ul>
+
+</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">from</span> <span class="nn">ipywidgets</span> <span class="kn">import</span> <span class="n">HBox</span><span class="p">,</span> <span class="n">VBox</span><span class="p">,</span> <span class="n">Dropdown</span>
+<span class="kn">from</span> <span class="nn">bqplot.marks</span> <span class="kn">import</span> <span class="n">Scatter</span><span class="p">,</span> <span class="n">Bars</span>
+<span class="kn">from</span> <span class="nn">bqplot.scales</span> <span class="kn">import</span> <span class="n">LinearScale</span><span class="p">,</span> <span class="n">OrdinalScale</span>
+<span class="kn">from</span> <span class="nn">bqplot.figure</span> <span class="kn">import</span> <span class="n">Figure</span>
+<span class="kn">from</span> <span class="nn">bqplot</span> <span class="kn">import</span> <span class="n">Tooltip</span>
+<span class="kn">from</span> <span class="nn">bqplot.axes</span> <span class="kn">import</span> <span class="n">Axis</span>
+<span class="kn">import</span> <span class="nn">numpy</span> <span class="k">as</span> <span class="nn">np</span>
+
+<span class="c1"># simple function to return the bins for the plot</span>
+<span class="k">def</span> <span class="nf">get_h_bins</span><span class="p">(</span><span class="n">df</span><span class="p">,</span> <span class="n">bins</span><span class="p">,</span> <span class="n">f_lim</span><span class="p">):</span>
+    <span class="k">if</span> <span class="n">f_lim</span><span class="p">:</span>
+        <span class="k">return</span> <span class="n">np</span><span class="o">.</span><span class="n">arange</span><span class="p">(</span>
+            <span class="n">f_lim</span><span class="p">[</span><span class="s2">&quot;min&quot;</span><span class="p">],</span> <span class="n">f_lim</span><span class="p">[</span><span class="s2">&quot;max&quot;</span><span class="p">],</span> <span class="p">(</span><span class="n">f_lim</span><span class="p">[</span><span class="s2">&quot;max&quot;</span><span class="p">]</span> <span class="o">-</span> <span class="n">f_lim</span><span class="p">[</span><span class="s2">&quot;min&quot;</span><span class="p">])</span> <span class="o">/</span> <span class="nb">float</span><span class="p">(</span><span class="n">bins</span><span class="p">)</span>
+        <span class="p">)</span>
+    <span class="n">scale_max</span> <span class="o">=</span> <span class="nb">int</span><span class="p">(</span><span class="n">df</span><span class="o">.</span><span class="n">describe</span><span class="p">()</span><span class="o">.</span><span class="n">loc</span><span class="p">[</span><span class="s2">&quot;max&quot;</span><span class="p">]</span><span class="o">.</span><span class="n">max</span><span class="p">()</span> <span class="o">+</span> <span class="mi">1</span><span class="p">)</span>
+    <span class="n">scale_min</span> <span class="o">=</span> <span class="nb">int</span><span class="p">(</span><span class="n">df</span><span class="o">.</span><span class="n">describe</span><span class="p">()</span><span class="o">.</span><span class="n">loc</span><span class="p">[</span><span class="s2">&quot;min&quot;</span><span class="p">]</span><span class="o">.</span><span class="n">min</span><span class="p">()</span> <span class="o">-</span> <span class="mi">1</span><span class="p">)</span>
+    <span class="k">return</span> <span class="n">np</span><span class="o">.</span><span class="n">arange</span><span class="p">(</span><span class="n">scale_min</span><span class="p">,</span> <span class="n">scale_max</span><span class="p">,</span> <span class="p">(</span><span class="n">scale_max</span> <span class="o">-</span> <span class="n">scale_min</span><span class="p">)</span> <span class="o">/</span> <span class="nb">float</span><span class="p">(</span><span class="n">bins</span><span class="p">))</span>
+
+
+<span class="k">def</span> <span class="nf">feature_vector_distribution</span><span class="p">(</span>
+    <span class="n">features</span><span class="p">,</span> <span class="n">label_column</span><span class="p">,</span> <span class="n">bins</span><span class="o">=</span><span class="mi">25</span><span class="p">,</span> <span class="n">group_columns</span><span class="o">=</span><span class="kc">None</span><span class="p">,</span> <span class="n">f_lim</span><span class="o">=</span><span class="kc">None</span><span class="p">,</span> <span class="n">colors</span><span class="o">=</span><span class="kc">None</span>
+<span class="p">):</span>
+    <span class="sd">&quot;&quot;&quot;</span>
+<span class="sd">    features (dataframe): a data frame of feature vectors along with a label column and other metadata</span>
+<span class="sd">    label_column (str): the name of the column in the features dataframe that refers to the label infomration</span>
+<span class="sd">    bins (int): the number of bins in the histograms</span>
+<span class="sd">    group_columns (list): if you want other metadata in the tooltip, these columns will be added</span>
+<span class="sd">    f_lim (dict): this sets the limits for max and min of the plots to a constant</span>
+<span class="sd">        {&#39;max&#39;:10, &#39;min&#39;:10}. otherwise defaults to the values of the current features</span>
+<span class="sd">        which can be misleading.</span>
+<span class="sd">    colors (list): list of colors to use. Internally has a list of 10. If the labels</span>
+<span class="sd">        are longer you will need to pass your own</span>
+
+<span class="sd">    &quot;&quot;&quot;</span>
+    <span class="n">dist</span> <span class="o">=</span> <span class="s2">&quot;640px&quot;</span>
+    <span class="n">third_dist</span> <span class="o">=</span> <span class="s2">&quot;213px&quot;</span>
+
+    <span class="k">if</span> <span class="n">f_lim</span><span class="p">:</span>
+        <span class="n">sc_x</span> <span class="o">=</span> <span class="n">LinearScale</span><span class="p">(</span><span class="nb">min</span><span class="o">=</span><span class="n">f_lim</span><span class="p">[</span><span class="s2">&quot;min&quot;</span><span class="p">],</span> <span class="nb">max</span><span class="o">=</span><span class="n">f_lim</span><span class="p">[</span><span class="s2">&quot;max&quot;</span><span class="p">])</span>
+        <span class="n">sc_y</span> <span class="o">=</span> <span class="n">LinearScale</span><span class="p">(</span><span class="nb">min</span><span class="o">=</span><span class="n">f_lim</span><span class="p">[</span><span class="s2">&quot;min&quot;</span><span class="p">],</span> <span class="nb">max</span><span class="o">=</span><span class="n">f_lim</span><span class="p">[</span><span class="s2">&quot;max&quot;</span><span class="p">])</span>
+    <span class="k">else</span><span class="p">:</span>
+        <span class="n">sc_x</span> <span class="o">=</span> <span class="n">LinearScale</span><span class="p">()</span>
+        <span class="n">sc_y</span> <span class="o">=</span> <span class="n">LinearScale</span><span class="p">()</span>
+
+    <span class="n">scale_y</span> <span class="o">=</span> <span class="n">LinearScale</span><span class="p">(</span><span class="nb">min</span><span class="o">=</span><span class="mi">0</span><span class="p">)</span>
+
+    <span class="n">x_ord_legend</span> <span class="o">=</span> <span class="n">OrdinalScale</span><span class="p">()</span>
+    <span class="n">y_lin_legend</span> <span class="o">=</span> <span class="n">LinearScale</span><span class="p">()</span>
+
+    <span class="k">if</span> <span class="n">group_columns</span> <span class="ow">is</span> <span class="kc">None</span><span class="p">:</span>
+        <span class="n">count_column</span> <span class="o">=</span> <span class="n">features</span><span class="o">.</span><span class="n">columns</span><span class="p">[</span><span class="mi">1</span><span class="p">]</span>
+        <span class="n">group_columns</span> <span class="o">=</span> <span class="p">[]</span>
+    <span class="k">else</span><span class="p">:</span>
+        <span class="n">count_column</span> <span class="o">=</span> <span class="n">group_columns</span><span class="p">[</span><span class="mi">0</span><span class="p">]</span>
+
+    <span class="k">if</span> <span class="n">colors</span> <span class="ow">is</span> <span class="kc">None</span><span class="p">:</span>
+        <span class="n">colors</span> <span class="o">=</span> <span class="p">[</span>
+            <span class="s2">&quot;#E6B0AA&quot;</span><span class="p">,</span>
+            <span class="s2">&quot;#C39BD3&quot;</span><span class="p">,</span>
+            <span class="s2">&quot;#73C6B6&quot;</span><span class="p">,</span>
+            <span class="s2">&quot;#F7DC6F&quot;</span><span class="p">,</span>
+            <span class="s2">&quot;#F0B27A&quot;</span><span class="p">,</span>
+            <span class="s2">&quot;#D0D3D4&quot;</span><span class="p">,</span>
+            <span class="s2">&quot;#85929E&quot;</span><span class="p">,</span>
+            <span class="s2">&quot;#6E2C00&quot;</span><span class="p">,</span>
+            <span class="s2">&quot;#1A5276&quot;</span><span class="p">,</span>
+            <span class="s2">&quot;#17202A&quot;</span><span class="p">,</span>
+        <span class="p">]</span>
+    <span class="n">box_color</span> <span class="o">=</span> <span class="s2">&quot;black&quot;</span>
+
+    <span class="n">feature_x</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;Feature 1&quot;</span><span class="p">)</span>
+    <span class="n">feature_y</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;Feature 2&quot;</span><span class="p">)</span>
+
+    <span class="n">feature_x</span><span class="o">.</span><span class="n">options</span> <span class="o">=</span> <span class="p">[</span>
+        <span class="n">x</span> <span class="k">for</span> <span class="n">x</span> <span class="ow">in</span> <span class="n">features</span><span class="o">.</span><span class="n">columns</span> <span class="k">if</span> <span class="n">x</span> <span class="ow">not</span> <span class="ow">in</span> <span class="p">[</span><span class="n">label_column</span><span class="p">]</span> <span class="o">+</span> <span class="n">group_columns</span>
+    <span class="p">]</span>
+    <span class="n">feature_y</span><span class="o">.</span><span class="n">options</span> <span class="o">=</span> <span class="p">[</span>
+        <span class="n">x</span> <span class="k">for</span> <span class="n">x</span> <span class="ow">in</span> <span class="n">features</span><span class="o">.</span><span class="n">columns</span> <span class="k">if</span> <span class="n">x</span> <span class="ow">not</span> <span class="ow">in</span> <span class="p">[</span><span class="n">label_column</span><span class="p">]</span> <span class="o">+</span> <span class="n">group_columns</span>
+    <span class="p">]</span>
+
+    <span class="n">feature1</span> <span class="o">=</span> <span class="n">feature_x</span><span class="o">.</span><span class="n">options</span><span class="p">[</span><span class="mi">0</span><span class="p">]</span>
+    <span class="n">feature2</span> <span class="o">=</span> <span class="n">feature_y</span><span class="o">.</span><span class="n">options</span><span class="p">[</span><span class="mi">1</span><span class="p">]</span>
+
+    <span class="n">feature_y</span><span class="o">.</span><span class="n">value</span> <span class="o">=</span> <span class="n">feature2</span>
+
+    <span class="n">tt</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;, &quot;</span><span class="o">.</span><span class="n">join</span><span class="p">([</span><span class="s2">&quot;index&quot;</span><span class="p">,</span> <span class="n">label_column</span><span class="p">]</span> <span class="o">+</span> <span class="n">group_columns</span><span class="p">)]</span>
+    <span class="p">)</span>
+
+    <span class="n">scatters</span> <span class="o">=</span> <span class="p">[]</span>
+    <span class="n">hists_y</span> <span class="o">=</span> <span class="p">[]</span>
+    <span class="n">hists_x</span> <span class="o">=</span> <span class="p">[]</span>
+
+    <span class="n">h_bins_x</span> <span class="o">=</span> <span class="n">get_h_bins</span><span class="p">(</span><span class="n">features</span><span class="p">[[</span><span class="n">feature1</span><span class="p">]],</span> <span class="n">bins</span><span class="p">,</span> <span class="n">f_lim</span><span class="p">)</span>
+    <span class="n">h_bins_y</span> <span class="o">=</span> <span class="n">get_h_bins</span><span class="p">(</span><span class="n">features</span><span class="p">[[</span><span class="n">feature2</span><span class="p">]],</span> <span class="n">bins</span><span class="p">,</span> <span class="n">f_lim</span><span class="p">)</span>
+
+    <span class="k">for</span> <span class="n">index</span><span class="p">,</span> <span class="n">group</span> <span class="ow">in</span> <span class="nb">enumerate</span><span class="p">(</span><span class="n">features</span><span class="o">.</span><span class="n">groupby</span><span class="p">([</span><span class="n">label_column</span><span class="p">])):</span>
+
+        <span class="c1"># put the label column and any group column data in the tooltip</span>
+        <span class="n">names</span> <span class="o">=</span> <span class="p">[]</span>
+        <span class="k">for</span> <span class="n">row</span> <span class="ow">in</span> <span class="nb">range</span><span class="p">(</span><span class="n">group</span><span class="p">[</span><span class="mi">1</span><span class="p">]</span><span class="o">.</span><span class="n">shape</span><span class="p">[</span><span class="mi">0</span><span class="p">]):</span>
+            <span class="n">names</span><span class="o">.</span><span class="n">append</span><span class="p">(</span>
+                <span class="s2">&quot;</span><span class="si">{}</span><span class="s2">,&quot;</span><span class="o">.</span><span class="n">format</span><span class="p">(</span><span class="n">row</span><span class="p">)</span>
+                <span class="o">+</span> <span class="s2">&quot;,&quot;</span><span class="o">.</span><span class="n">join</span><span class="p">(</span>
+                    <span class="p">[</span>
+                        <span class="nb">str</span><span class="p">(</span><span class="n">x</span><span class="p">)</span>
+                        <span class="k">for</span> <span class="n">x</span> <span class="ow">in</span> <span class="n">group</span><span class="p">[</span><span class="mi">1</span><span class="p">][[</span><span class="n">label_column</span><span class="p">]</span> <span class="o">+</span> <span class="n">group_columns</span><span class="p">]</span>
+                        <span class="o">.</span><span class="n">iloc</span><span class="p">[</span><span class="n">row</span><span class="p">]</span>
+                        <span class="o">.</span><span class="n">values</span>
+                    <span class="p">]</span>
+                <span class="p">)</span>
+            <span class="p">)</span>
+
+        <span class="c1"># create a scatter plot for each group</span>
+        <span class="n">scatters</span><span class="o">.</span><span class="n">append</span><span class="p">(</span>
+            <span class="n">Scatter</span><span class="p">(</span>
+                <span class="n">x</span><span class="o">=</span><span class="n">group</span><span class="p">[</span><span class="mi">1</span><span class="p">][</span><span class="n">feature1</span><span class="p">]</span><span class="o">.</span><span class="n">values</span><span class="p">,</span>
+                <span class="n">y</span><span class="o">=</span><span class="n">group</span><span class="p">[</span><span class="mi">1</span><span class="p">][</span><span class="n">feature2</span><span class="p">]</span><span class="o">.</span><span class="n">values</span><span class="p">,</span>
+                <span class="n">names</span><span class="o">=</span><span class="n">names</span><span class="p">,</span>
+                <span class="n">display_names</span><span class="o">=</span><span class="kc">False</span><span class="p">,</span>
+                <span class="n">opacities</span><span class="o">=</span><span class="p">[</span><span class="mf">0.5</span><span class="p">],</span>
+                <span class="n">default_size</span><span class="o">=</span><span class="mi">30</span><span class="p">,</span>
+                <span class="n">scales</span><span class="o">=</span><span class="p">{</span><span class="s2">&quot;x&quot;</span><span class="p">:</span> <span class="n">sc_x</span><span class="p">,</span> <span class="s2">&quot;y&quot;</span><span class="p">:</span> <span class="n">sc_y</span><span class="p">},</span>
+                <span class="n">colors</span><span class="o">=</span><span class="p">[</span><span class="n">colors</span><span class="p">[</span><span class="n">index</span><span class="p">]],</span>
+                <span class="n">tooltip</span><span class="o">=</span><span class="n">tt</span><span class="p">,</span>
+            <span class="p">)</span>
+        <span class="p">)</span>
+
+        <span class="c1"># create a histograms using a bar chart for each group</span>
+        <span class="c1"># histogram plot for bqplot does not have enough options (no setting range, no setting orientation)</span>
+        <span class="n">h_y</span><span class="p">,</span> <span class="n">h_x</span> <span class="o">=</span> <span class="n">np</span><span class="o">.</span><span class="n">histogram</span><span class="p">(</span><span class="n">group</span><span class="p">[</span><span class="mi">1</span><span class="p">][</span><span class="n">feature1</span><span class="p">]</span><span class="o">.</span><span class="n">values</span><span class="p">,</span> <span class="n">bins</span><span class="o">=</span><span class="n">h_bins_x</span><span class="p">)</span>
+        <span class="n">hists_x</span><span class="o">.</span><span class="n">append</span><span class="p">(</span>
+            <span class="n">Bars</span><span class="p">(</span>
+                <span class="n">x</span><span class="o">=</span><span class="n">h_x</span><span class="p">,</span>
+                <span class="n">y</span><span class="o">=</span><span class="n">h_y</span><span class="p">,</span>
+                <span class="n">opacities</span><span class="o">=</span><span class="p">[</span><span class="mf">0.3</span><span class="p">]</span> <span class="o">*</span> <span class="n">bins</span><span class="p">,</span>
+                <span class="n">scales</span><span class="o">=</span><span class="p">{</span><span class="s2">&quot;x&quot;</span><span class="p">:</span> <span class="n">sc_x</span><span class="p">,</span> <span class="s2">&quot;y&quot;</span><span class="p">:</span> <span class="n">scale_y</span><span class="p">},</span>
+                <span class="n">colors</span><span class="o">=</span><span class="p">[</span><span class="n">colors</span><span class="p">[</span><span class="n">index</span><span class="p">]],</span>
+                <span class="n">orientation</span><span class="o">=</span><span class="s2">&quot;vertical&quot;</span><span class="p">,</span>
+            <span class="p">)</span>
+        <span class="p">)</span>
+
+        <span class="n">h_y</span><span class="p">,</span> <span class="n">h_x</span> <span class="o">=</span> <span class="n">np</span><span class="o">.</span><span class="n">histogram</span><span class="p">(</span><span class="n">group</span><span class="p">[</span><span class="mi">1</span><span class="p">][</span><span class="n">feature2</span><span class="p">]</span><span class="o">.</span><span class="n">values</span><span class="p">,</span> <span class="n">bins</span><span class="o">=</span><span class="n">h_bins_y</span><span class="p">)</span>
+        <span class="n">hists_y</span><span class="o">.</span><span class="n">append</span><span class="p">(</span>
+            <span class="n">Bars</span><span class="p">(</span>
+                <span class="n">x</span><span class="o">=</span><span class="n">h_x</span><span class="p">,</span>
+                <span class="n">y</span><span class="o">=</span><span class="n">h_y</span><span class="p">,</span>
+                <span class="n">opacities</span><span class="o">=</span><span class="p">[</span><span class="mf">0.3</span><span class="p">]</span> <span class="o">*</span> <span class="n">bins</span><span class="p">,</span>
+                <span class="n">scales</span><span class="o">=</span><span class="p">{</span><span class="s2">&quot;x&quot;</span><span class="p">:</span> <span class="n">sc_x</span><span class="p">,</span> <span class="s2">&quot;y&quot;</span><span class="p">:</span> <span class="n">scale_y</span><span class="p">},</span>
+                <span class="n">colors</span><span class="o">=</span><span class="p">[</span><span class="n">colors</span><span class="p">[</span><span class="n">index</span><span class="p">]],</span>
+                <span class="n">orientation</span><span class="o">=</span><span class="s2">&quot;horizontal&quot;</span><span class="p">,</span>
+            <span class="p">)</span>
+        <span class="p">)</span>
+
+    <span class="c1"># legend will show the names of the labels as well as a total count of each</span>
+    <span class="n">legend_bar</span> <span class="o">=</span> <span class="n">Bars</span><span class="p">(</span>
+        <span class="n">x</span><span class="o">=</span><span class="n">features</span><span class="o">.</span><span class="n">groupby</span><span class="p">(</span><span class="n">label_column</span><span class="p">)</span><span class="o">.</span><span class="n">count</span><span class="p">()[</span><span class="n">count_column</span><span class="p">]</span><span class="o">.</span><span class="n">index</span><span class="p">,</span>
+        <span class="n">y</span><span class="o">=</span><span class="n">features</span><span class="o">.</span><span class="n">groupby</span><span class="p">(</span><span class="n">label_column</span><span class="p">)</span><span class="o">.</span><span class="n">count</span><span class="p">()[</span><span class="n">count_column</span><span class="p">]</span><span class="o">.</span><span class="n">values</span><span class="p">,</span>
+        <span class="n">colors</span><span class="o">=</span><span class="n">colors</span><span class="p">,</span>
+        <span class="n">opacities</span><span class="o">=</span><span class="p">[</span><span class="mf">0.3</span><span class="p">]</span> <span class="o">*</span> <span class="mi">6</span><span class="p">,</span>
+        <span class="n">scales</span><span class="o">=</span><span class="p">{</span><span class="s2">&quot;x&quot;</span><span class="p">:</span> <span class="n">x_ord_legend</span><span class="p">,</span> <span class="s2">&quot;y&quot;</span><span class="p">:</span> <span class="n">y_lin_legend</span><span class="p">},</span>
+        <span class="n">orientation</span><span class="o">=</span><span class="s2">&quot;horizontal&quot;</span><span class="p">,</span>
+    <span class="p">)</span>
+
+    <span class="n">ax_x_legend</span> <span class="o">=</span> <span class="n">Axis</span><span class="p">(</span>
+        <span class="n">scale</span><span class="o">=</span><span class="n">x_ord_legend</span><span class="p">,</span>
+        <span class="n">tick_style</span><span class="o">=</span><span class="p">{</span><span class="s2">&quot;font-size&quot;</span><span class="p">:</span> <span class="mi">24</span><span class="p">},</span>
+        <span class="n">label</span><span class="o">=</span><span class="s2">&quot;&quot;</span><span class="p">,</span>
+        <span class="n">orientation</span><span class="o">=</span><span class="s2">&quot;vertical&quot;</span><span class="p">,</span>
+        <span class="n">tick_values</span><span class="o">=</span><span class="n">features</span><span class="o">.</span><span class="n">groupby</span><span class="p">(</span><span class="n">label_column</span><span class="p">)</span><span class="o">.</span><span class="n">count</span><span class="p">()[</span><span class="n">count_column</span><span class="p">]</span><span class="o">.</span><span class="n">index</span><span class="p">,</span>
+    <span class="p">)</span>
+
+    <span class="n">ax_y_legend</span> <span class="o">=</span> <span class="n">Axis</span><span class="p">(</span>
+        <span class="n">scale</span><span class="o">=</span><span class="n">y_lin_legend</span><span class="p">,</span>
+        <span class="n">orientation</span><span class="o">=</span><span class="s2">&quot;horizontal&quot;</span><span class="p">,</span>
+        <span class="n">label</span><span class="o">=</span><span class="s2">&quot;Total&quot;</span><span class="p">,</span>
+        <span class="n">color</span><span class="o">=</span><span class="n">box_color</span><span class="p">,</span>
+        <span class="n">num_ticks</span><span class="o">=</span><span class="mi">4</span><span class="p">,</span>
+    <span class="p">)</span>
+
+    <span class="c1"># these are blank axes that are used to fill in the border for the top and right of the figures</span>
+    <span class="n">ax_top</span> <span class="o">=</span> <span class="n">Axis</span><span class="p">(</span><span class="n">scale</span><span class="o">=</span><span class="n">sc_x</span><span class="p">,</span> <span class="n">color</span><span class="o">=</span><span class="n">box_color</span><span class="p">,</span> <span class="n">side</span><span class="o">=</span><span class="s2">&quot;top&quot;</span><span class="p">,</span> <span class="n">tick_style</span><span class="o">=</span><span class="p">{</span><span class="s2">&quot;font-size&quot;</span><span class="p">:</span> <span class="mi">0</span><span class="p">})</span>
+    <span class="n">ax_right</span> <span class="o">=</span> <span class="n">Axis</span><span class="p">(</span>
+        <span class="n">scale</span><span class="o">=</span><span class="n">sc_x</span><span class="p">,</span> <span class="n">color</span><span class="o">=</span><span class="n">box_color</span><span class="p">,</span> <span class="n">side</span><span class="o">=</span><span class="s2">&quot;right&quot;</span><span class="p">,</span> <span class="n">tick_style</span><span class="o">=</span><span class="p">{</span><span class="s2">&quot;font-size&quot;</span><span class="p">:</span> <span class="mi">0</span><span class="p">}</span>
+    <span class="p">)</span>
+    <span class="n">ax_left</span> <span class="o">=</span> <span class="n">Axis</span><span class="p">(</span>
+        <span class="n">scale</span><span class="o">=</span><span class="n">sc_x</span><span class="p">,</span> <span class="n">color</span><span class="o">=</span><span class="n">box_color</span><span class="p">,</span> <span class="n">side</span><span class="o">=</span><span class="s2">&quot;left&quot;</span><span class="p">,</span> <span class="n">tick_style</span><span class="o">=</span><span class="p">{</span><span class="s2">&quot;font-size&quot;</span><span class="p">:</span> <span class="mi">0</span><span class="p">}</span>
+    <span class="p">)</span>
+    <span class="n">ax_bottom</span> <span class="o">=</span> <span class="n">Axis</span><span class="p">(</span>
+        <span class="n">scale</span><span class="o">=</span><span class="n">sc_x</span><span class="p">,</span> <span class="n">color</span><span class="o">=</span><span class="n">box_color</span><span class="p">,</span> <span class="n">side</span><span class="o">=</span><span class="s2">&quot;bottom&quot;</span><span class="p">,</span> <span class="n">tick_style</span><span class="o">=</span><span class="p">{</span><span class="s2">&quot;font-size&quot;</span><span class="p">:</span> <span class="mi">0</span><span class="p">}</span>
+    <span class="p">)</span>
+    <span class="n">ax_top</span> <span class="o">=</span> <span class="n">Axis</span><span class="p">(</span><span class="n">scale</span><span class="o">=</span><span class="n">sc_x</span><span class="p">,</span> <span class="n">color</span><span class="o">=</span><span class="n">box_color</span><span class="p">,</span> <span class="n">side</span><span class="o">=</span><span class="s2">&quot;top&quot;</span><span class="p">,</span> <span class="n">num_ticks</span><span class="o">=</span><span class="mi">0</span><span class="p">)</span>
+    <span class="n">ax_right</span> <span class="o">=</span> <span class="n">Axis</span><span class="p">(</span><span class="n">scale</span><span class="o">=</span><span class="n">sc_x</span><span class="p">,</span> <span class="n">color</span><span class="o">=</span><span class="n">box_color</span><span class="p">,</span> <span class="n">side</span><span class="o">=</span><span class="s2">&quot;right&quot;</span><span class="p">,</span> <span class="n">num_ticks</span><span class="o">=</span><span class="mi">0</span><span class="p">)</span>
+    <span class="n">ax_left</span> <span class="o">=</span> <span class="n">Axis</span><span class="p">(</span><span class="n">scale</span><span class="o">=</span><span class="n">sc_x</span><span class="p">,</span> <span class="n">color</span><span class="o">=</span><span class="n">box_color</span><span class="p">,</span> <span class="n">side</span><span class="o">=</span><span class="s2">&quot;left&quot;</span><span class="p">,</span> <span class="n">num_ticks</span><span class="o">=</span><span class="mi">0</span><span class="p">)</span>
+    <span class="n">ax_bottom</span> <span class="o">=</span> <span class="n">Axis</span><span class="p">(</span><span class="n">scale</span><span class="o">=</span><span class="n">sc_x</span><span class="p">,</span> <span class="n">color</span><span class="o">=</span><span class="n">box_color</span><span class="p">,</span> <span class="n">side</span><span class="o">=</span><span class="s2">&quot;bottom&quot;</span><span class="p">,</span> <span class="n">num_ticks</span><span class="o">=</span><span class="mi">0</span><span class="p">)</span>
+
+    <span class="c1"># scatter plot axis</span>
+    <span class="n">ax_x</span> <span class="o">=</span> <span class="n">Axis</span><span class="p">(</span><span class="n">label</span><span class="o">=</span><span class="n">feature1</span><span class="p">,</span> <span class="n">scale</span><span class="o">=</span><span class="n">sc_x</span><span class="p">,</span> <span class="n">color</span><span class="o">=</span><span class="n">box_color</span><span class="p">)</span>
+    <span class="n">ax_y</span> <span class="o">=</span> <span class="n">Axis</span><span class="p">(</span><span class="n">label</span><span class="o">=</span><span class="n">feature2</span><span class="p">,</span> <span class="n">scale</span><span class="o">=</span><span class="n">sc_y</span><span class="p">,</span> <span class="n">orientation</span><span class="o">=</span><span class="s2">&quot;vertical&quot;</span><span class="p">,</span> <span class="n">color</span><span class="o">=</span><span class="n">box_color</span><span class="p">)</span>
+
+    <span class="c1"># count column of histogram</span>
+    <span class="n">ax_count_vert</span> <span class="o">=</span> <span class="n">Axis</span><span class="p">(</span>
+        <span class="n">label</span><span class="o">=</span><span class="s2">&quot;&quot;</span><span class="p">,</span> <span class="n">scale</span><span class="o">=</span><span class="n">scale_y</span><span class="p">,</span> <span class="n">orientation</span><span class="o">=</span><span class="s2">&quot;vertical&quot;</span><span class="p">,</span> <span class="n">color</span><span class="o">=</span><span class="n">box_color</span><span class="p">,</span> <span class="n">num_ticks</span><span class="o">=</span><span class="mi">5</span>
+    <span class="p">)</span>
+    <span class="n">ax_count_horiz</span> <span class="o">=</span> <span class="n">Axis</span><span class="p">(</span>
+        <span class="n">label</span><span class="o">=</span><span class="s2">&quot;&quot;</span><span class="p">,</span> <span class="n">scale</span><span class="o">=</span><span class="n">scale_y</span><span class="p">,</span> <span class="n">orientation</span><span class="o">=</span><span class="s2">&quot;horizontal&quot;</span><span class="p">,</span> <span class="n">color</span><span class="o">=</span><span class="n">box_color</span><span class="p">,</span> <span class="n">num_ticks</span><span class="o">=</span><span class="mi">5</span>
+    <span class="p">)</span>
+
+    <span class="c1"># histogram bin axis</span>
+    <span class="n">ax_hist_x</span> <span class="o">=</span> <span class="n">Axis</span><span class="p">(</span><span class="n">label</span><span class="o">=</span><span class="s2">&quot;&quot;</span><span class="p">,</span> <span class="n">scale</span><span class="o">=</span><span class="n">sc_x</span><span class="p">,</span> <span class="n">orientation</span><span class="o">=</span><span class="s2">&quot;vertical&quot;</span><span class="p">,</span> <span class="n">color</span><span class="o">=</span><span class="n">box_color</span><span class="p">)</span>
+    <span class="n">ax_hist_y</span> <span class="o">=</span> <span class="n">Axis</span><span class="p">(</span><span class="n">label</span><span class="o">=</span><span class="s2">&quot;&quot;</span><span class="p">,</span> <span class="n">scale</span><span class="o">=</span><span class="n">sc_x</span><span class="p">,</span> <span class="n">orientation</span><span class="o">=</span><span class="s2">&quot;horizontal&quot;</span><span class="p">,</span> <span class="n">color</span><span class="o">=</span><span class="n">box_color</span><span class="p">)</span>
+
+    <span class="c1"># create figures for each plot</span>
+    <span class="n">f_scatter</span> <span class="o">=</span> <span class="n">Figure</span><span class="p">(</span>
+        <span class="n">axes</span><span class="o">=</span><span class="p">[</span><span class="n">ax_x</span><span class="p">,</span> <span class="n">ax_y</span><span class="p">,</span> <span class="n">ax_top</span><span class="p">,</span> <span class="n">ax_right</span><span class="p">],</span>
+        <span class="n">background_style</span><span class="o">=</span><span class="p">{</span><span class="s2">&quot;fill&quot;</span><span class="p">:</span> <span class="s2">&quot;white&quot;</span><span class="p">},</span>  <span class="c1"># css is inserted directly</span>
+        <span class="n">marks</span><span class="o">=</span><span class="n">scatters</span><span class="p">,</span>
+        <span class="n">min_aspect_ratio</span><span class="o">=</span><span class="mi">1</span><span class="p">,</span>
+        <span class="n">max_aspect_ratio</span><span class="o">=</span><span class="mi">1</span><span class="p">,</span>
+        <span class="n">fig_margin</span><span class="o">=</span><span class="p">{</span><span class="s2">&quot;top&quot;</span><span class="p">:</span> <span class="mi">0</span><span class="p">,</span> <span class="s2">&quot;bottom&quot;</span><span class="p">:</span> <span class="mi">60</span><span class="p">,</span> <span class="s2">&quot;left&quot;</span><span class="p">:</span> <span class="mi">60</span><span class="p">,</span> <span class="s2">&quot;right&quot;</span><span class="p">:</span> <span class="mi">0</span><span class="p">},</span>
+    <span class="p">)</span>
+
+    <span class="n">f_hists_y</span> <span class="o">=</span> <span class="n">Figure</span><span class="p">(</span>
+        <span class="n">axes</span><span class="o">=</span><span class="p">[</span><span class="n">ax_left</span><span class="p">,</span> <span class="n">ax_count_horiz</span><span class="p">,</span> <span class="n">ax_top</span><span class="p">,</span> <span class="n">ax_right</span><span class="p">],</span>
+        <span class="n">background_style</span><span class="o">=</span><span class="p">{</span><span class="s2">&quot;fill&quot;</span><span class="p">:</span> <span class="s2">&quot;white&quot;</span><span class="p">},</span>
+        <span class="n">marks</span><span class="o">=</span><span class="n">hists_y</span><span class="p">,</span>
+        <span class="n">min_aspect_ratio</span><span class="o">=</span><span class="mf">0.33</span><span class="p">,</span>
+        <span class="n">max_aspect_ratio</span><span class="o">=</span><span class="mf">0.33</span><span class="p">,</span>
+        <span class="n">fig_margin</span><span class="o">=</span><span class="p">{</span><span class="s2">&quot;top&quot;</span><span class="p">:</span> <span class="mi">0</span><span class="p">,</span> <span class="s2">&quot;bottom&quot;</span><span class="p">:</span> <span class="mi">60</span><span class="p">,</span> <span class="s2">&quot;left&quot;</span><span class="p">:</span> <span class="mi">10</span><span class="p">,</span> <span class="s2">&quot;right&quot;</span><span class="p">:</span> <span class="mi">0</span><span class="p">},</span>
+    <span class="p">)</span>
+
+    <span class="n">f_hists_x</span> <span class="o">=</span> <span class="n">Figure</span><span class="p">(</span>
+        <span class="n">axes</span><span class="o">=</span><span class="p">[</span><span class="n">ax_count_vert</span><span class="p">,</span> <span class="n">ax_bottom</span><span class="p">,</span> <span class="n">ax_top</span><span class="p">,</span> <span class="n">ax_right</span><span class="p">],</span>
+        <span class="n">background_style</span><span class="o">=</span><span class="p">{</span><span class="s2">&quot;fill&quot;</span><span class="p">:</span> <span class="s2">&quot;white&quot;</span><span class="p">},</span>
+        <span class="n">marks</span><span class="o">=</span><span class="n">hists_x</span><span class="p">,</span>
+        <span class="n">min_aspect_ratio</span><span class="o">=</span><span class="mi">3</span><span class="p">,</span>
+        <span class="n">max_aspect_ratio</span><span class="o">=</span><span class="mi">3</span><span class="p">,</span>
+        <span class="n">fig_margin</span><span class="o">=</span><span class="p">{</span><span class="s2">&quot;top&quot;</span><span class="p">:</span> <span class="mi">20</span><span class="p">,</span> <span class="s2">&quot;bottom&quot;</span><span class="p">:</span> <span class="mi">10</span><span class="p">,</span> <span class="s2">&quot;left&quot;</span><span class="p">:</span> <span class="mi">60</span><span class="p">,</span> <span class="s2">&quot;right&quot;</span><span class="p">:</span> <span class="mi">0</span><span class="p">},</span>
+    <span class="p">)</span>
+
+    <span class="n">f_legend</span> <span class="o">=</span> <span class="n">Figure</span><span class="p">(</span>
+        <span class="n">marks</span><span class="o">=</span><span class="p">[</span><span class="n">legend_bar</span><span class="p">],</span>
+        <span class="n">axes</span><span class="o">=</span><span class="p">[</span><span class="n">ax_x_legend</span><span class="p">,</span> <span class="n">ax_y_legend</span><span class="p">],</span>
+        <span class="n">title</span><span class="o">=</span><span class="s2">&quot;&quot;</span><span class="p">,</span>
+        <span class="n">legend_location</span><span class="o">=</span><span class="s2">&quot;bottom-right&quot;</span><span class="p">,</span>
+        <span class="n">background_style</span><span class="o">=</span><span class="p">{</span><span class="s2">&quot;fill&quot;</span><span class="p">:</span> <span class="s2">&quot;white&quot;</span><span class="p">},</span>
+        <span class="n">min_aspect_ratio</span><span class="o">=</span><span class="mi">1</span><span class="p">,</span>
+        <span class="n">max_aspect_ratio</span><span class="o">=</span><span class="mi">1</span><span class="p">,</span>
+        <span class="n">fig_margin</span><span class="o">=</span><span class="p">{</span><span class="s2">&quot;top&quot;</span><span class="p">:</span> <span class="mi">10</span><span class="p">,</span> <span class="s2">&quot;bottom&quot;</span><span class="p">:</span> <span class="mi">30</span><span class="p">,</span> <span class="s2">&quot;left&quot;</span><span class="p">:</span> <span class="mi">20</span><span class="p">,</span> <span class="s2">&quot;right&quot;</span><span class="p">:</span> <span class="mi">20</span><span class="p">},</span>
+    <span class="p">)</span>
+
+    <span class="c1"># we already set the ratios, but it is necessary to set the size explicitly anyway</span>
+    <span class="c1"># this is kind of cool, inserts this into the style in html</span>
+    <span class="n">f_legend</span><span class="o">.</span><span class="n">layout</span><span class="o">.</span><span class="n">height</span> <span class="o">=</span> <span class="n">third_dist</span>
+    <span class="n">f_legend</span><span class="o">.</span><span class="n">layout</span><span class="o">.</span><span class="n">width</span> <span class="o">=</span> <span class="n">third_dist</span>
+    <span class="n">f_hists_x</span><span class="o">.</span><span class="n">layout</span><span class="o">.</span><span class="n">height</span> <span class="o">=</span> <span class="n">third_dist</span>
+    <span class="n">f_hists_x</span><span class="o">.</span><span class="n">layout</span><span class="o">.</span><span class="n">width</span> <span class="o">=</span> <span class="n">dist</span>
+    <span class="n">f_hists_y</span><span class="o">.</span><span class="n">layout</span><span class="o">.</span><span class="n">height</span> <span class="o">=</span> <span class="n">dist</span>
+    <span class="n">f_hists_y</span><span class="o">.</span><span class="n">layout</span><span class="o">.</span><span class="n">width</span> <span class="o">=</span> <span class="n">third_dist</span>
+    <span class="n">f_scatter</span><span class="o">.</span><span class="n">layout</span><span class="o">.</span><span class="n">height</span> <span class="o">=</span> <span class="n">dist</span>
+    <span class="n">f_scatter</span><span class="o">.</span><span class="n">layout</span><span class="o">.</span><span class="n">width</span> <span class="o">=</span> <span class="n">dist</span>
+
+    <span class="c1"># we create some functions that allow changes when the widgets notice an event</span>
+    <span class="k">def</span> <span class="nf">change_x_feature</span><span class="p">(</span><span class="n">b</span><span class="p">):</span>
+        <span class="n">h_bins_x</span> <span class="o">=</span> <span class="n">get_h_bins</span><span class="p">(</span><span class="n">features</span><span class="p">[[</span><span class="n">feature_x</span><span class="o">.</span><span class="n">value</span><span class="p">]],</span> <span class="n">bins</span><span class="p">,</span> <span class="n">f_lim</span><span class="p">)</span>
+        <span class="k">for</span> <span class="n">index</span><span class="p">,</span> <span class="n">group</span> <span class="ow">in</span> <span class="nb">enumerate</span><span class="p">(</span><span class="n">features</span><span class="o">.</span><span class="n">groupby</span><span class="p">([</span><span class="n">label_column</span><span class="p">])):</span>
+            <span class="n">scatters</span><span class="p">[</span><span class="n">index</span><span class="p">]</span><span class="o">.</span><span class="n">x</span> <span class="o">=</span> <span class="n">group</span><span class="p">[</span><span class="mi">1</span><span class="p">][</span><span class="n">feature_x</span><span class="o">.</span><span class="n">value</span><span class="p">]</span>
+            <span class="n">h_y</span><span class="p">,</span> <span class="n">h_x</span> <span class="o">=</span> <span class="n">np</span><span class="o">.</span><span class="n">histogram</span><span class="p">(</span><span class="n">group</span><span class="p">[</span><span class="mi">1</span><span class="p">][</span><span class="n">feature_x</span><span class="o">.</span><span class="n">value</span><span class="p">]</span><span class="o">.</span><span class="n">values</span><span class="p">,</span> <span class="n">bins</span><span class="o">=</span><span class="n">h_bins_x</span><span class="p">)</span>
+            <span class="n">hists_x</span><span class="p">[</span><span class="n">index</span><span class="p">]</span><span class="o">.</span><span class="n">y</span> <span class="o">=</span> <span class="n">h_y</span>
+
+        <span class="n">ax_x</span><span class="o">.</span><span class="n">label</span> <span class="o">=</span> <span class="n">feature_x</span><span class="o">.</span><span class="n">value</span>
+
+    <span class="k">def</span> <span class="nf">change_y_feature</span><span class="p">(</span><span class="n">b</span><span class="p">):</span>
+        <span class="n">h_bins_y</span> <span class="o">=</span> <span class="n">get_h_bins</span><span class="p">(</span><span class="n">features</span><span class="p">[[</span><span class="n">feature_y</span><span class="o">.</span><span class="n">value</span><span class="p">]],</span> <span class="n">bins</span><span class="p">,</span> <span class="n">f_lim</span><span class="p">)</span>
+        <span class="k">for</span> <span class="n">index</span><span class="p">,</span> <span class="n">group</span> <span class="ow">in</span> <span class="nb">enumerate</span><span class="p">(</span><span class="n">features</span><span class="o">.</span><span class="n">groupby</span><span class="p">([</span><span class="n">label_column</span><span class="p">])):</span>
+            <span class="n">scatters</span><span class="p">[</span><span class="n">index</span><span class="p">]</span><span class="o">.</span><span class="n">y</span> <span class="o">=</span> <span class="n">group</span><span class="p">[</span><span class="mi">1</span><span class="p">][</span><span class="n">feature_y</span><span class="o">.</span><span class="n">value</span><span class="p">]</span>
+            <span class="n">h_y</span><span class="p">,</span> <span class="n">h_x</span> <span class="o">=</span> <span class="n">np</span><span class="o">.</span><span class="n">histogram</span><span class="p">(</span><span class="n">group</span><span class="p">[</span><span class="mi">1</span><span class="p">][</span><span class="n">feature_y</span><span class="o">.</span><span class="n">value</span><span class="p">]</span><span class="o">.</span><span class="n">values</span><span class="p">,</span> <span class="n">bins</span><span class="o">=</span><span class="n">h_bins_y</span><span class="p">)</span>
+            <span class="n">hists_y</span><span class="p">[</span><span class="n">index</span><span class="p">]</span><span class="o">.</span><span class="n">y</span> <span class="o">=</span> <span class="n">h_y</span>
+
+        <span class="n">ax_y</span><span class="o">.</span><span class="n">label</span> <span class="o">=</span> <span class="n">feature_y</span><span class="o">.</span><span class="n">value</span>
+
+    <span class="c1"># when the user selects a different feature, switch the data plotted</span>
+    <span class="n">feature_x</span><span class="o">.</span><span class="n">observe</span><span class="p">(</span><span class="n">change_x_feature</span><span class="p">,</span> <span class="s2">&quot;value&quot;</span><span class="p">)</span>
+    <span class="n">feature_y</span><span class="o">.</span><span class="n">observe</span><span class="p">(</span><span class="n">change_y_feature</span><span class="p">,</span> <span class="s2">&quot;value&quot;</span><span class="p">)</span>
+
+    <span class="c1"># return the stacked figures to be plotted</span>
+    <span class="k">return</span> <span class="n">VBox</span><span class="p">(</span>
+        <span class="p">[</span>
+            <span class="n">HBox</span><span class="p">([</span><span class="n">feature_x</span><span class="p">,</span> <span class="n">feature_y</span><span class="p">]),</span>
+            <span class="n">HBox</span><span class="p">([</span><span class="n">f_hists_x</span><span class="p">,</span> <span class="n">f_legend</span><span class="p">]),</span>
+            <span class="n">HBox</span><span class="p">([</span><span class="n">f_scatter</span><span class="p">,</span> <span class="n">f_hists_y</span><span class="p">]),</span>
+        <span class="p">]</span>
+    <span class="p">)</span>
+</pre></div>
+
+    </div>
+</div>
+</div>
+
+  </div>
+<div class="cell border-box-sizing text_cell rendered"><div class="inner_cell">
+<div class="text_cell_render border-box-sizing rendered_html">
+<h3 id="Iris-Data-Set">Iris Data Set<a class="anchor-link" href="#Iris-Data-Set">&#182;</a></h3>
+</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="c1"># Install scikit-learn</span>
+<span class="o">!</span>pip install sklearn
+</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="kn">import</span> <span class="nn">pandas</span> <span class="k">as</span> <span class="nn">pd</span>
+<span class="kn">from</span> <span class="nn">sklearn.datasets</span> <span class="kn">import</span> <span class="n">load_iris</span>
+<span class="kn">from</span> <span class="nn">sklearn.decomposition</span> <span class="kn">import</span> <span class="n">PCA</span>
+<span class="kn">from</span> <span class="nn">sklearn.preprocessing</span> <span class="kn">import</span> <span class="n">scale</span>
+
+<span class="n">np</span><span class="o">.</span><span class="n">random</span><span class="o">.</span><span class="n">seed</span><span class="p">(</span><span class="mi">42</span><span class="p">)</span>
+
+<span class="n">digits</span> <span class="o">=</span> <span class="n">load_iris</span><span class="p">()</span>
+<span class="n">data</span> <span class="o">=</span> <span class="n">scale</span><span class="p">(</span><span class="n">digits</span><span class="o">.</span><span class="n">data</span><span class="p">)</span>
+<span class="n">n_features</span> <span class="o">=</span> <span class="mi">4</span>
+<span class="c1"># n_pca=3</span>
+<span class="c1"># pca = PCA(n_components=n_pca).fit(data)</span>
+<span class="n">df</span> <span class="o">=</span> <span class="n">pd</span><span class="o">.</span><span class="n">DataFrame</span><span class="p">(</span><span class="n">data</span><span class="p">,</span> <span class="n">columns</span><span class="o">=</span><span class="p">[</span><span class="s2">&quot;feature_</span><span class="si">{}</span><span class="s2">&quot;</span><span class="o">.</span><span class="n">format</span><span class="p">(</span><span class="n">x</span><span class="p">)</span> <span class="k">for</span> <span class="n">x</span> <span class="ow">in</span> <span class="nb">range</span><span class="p">(</span><span class="n">n_features</span><span class="p">)])</span>
+<span class="n">df</span><span class="p">[</span><span class="s2">&quot;leaf&quot;</span><span class="p">]</span> <span class="o">=</span> <span class="n">digits</span><span class="o">.</span><span class="n">target</span>
+<span class="n">df</span><span class="p">[</span><span class="s2">&quot;extra_info&quot;</span><span class="p">]</span> <span class="o">=</span> <span class="p">[</span><span class="n">np</span><span class="o">.</span><span class="n">random</span><span class="o">.</span><span class="n">randint</span><span class="p">(</span><span class="mi">100</span><span class="p">)</span> <span class="k">for</span> <span class="n">x</span> <span class="ow">in</span> <span class="nb">range</span><span class="p">(</span><span class="n">digits</span><span class="o">.</span><span class="n">target</span><span class="o">.</span><span class="n">shape</span><span class="p">[</span><span class="mi">0</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">feature_vector_distribution</span><span class="p">(</span>
+    <span class="n">df</span><span class="p">,</span> <span class="s2">&quot;leaf&quot;</span><span class="p">,</span> <span class="n">group_columns</span><span class="o">=</span><span class="p">[</span><span class="s2">&quot;extra_info&quot;</span><span class="p">],</span> <span class="n">bins</span><span class="o">=</span><span class="mi">25</span><span class="p">,</span> <span class="n">f_lim</span><span class="o">=</span><span class="p">{</span><span class="s2">&quot;min&quot;</span><span class="p">:</span> <span class="o">-</span><span class="mi">3</span><span class="p">,</span> <span class="s2">&quot;max&quot;</span><span class="p">:</span> <span class="mi">3</span><span class="p">}</span>
+<span class="p">)</span>
+</pre></div>
+
+    </div>
+</div>
+</div>
+
+  </div>
+<div class="cell border-box-sizing text_cell rendered"><div class="inner_cell">
+<div class="text_cell_render border-box-sizing rendered_html">
+<h3 id="Digits-data-set,-with-PCA-applied-to-reduce-to-10-features">Digits data set, with PCA applied to reduce to 10 features<a class="anchor-link" href="#Digits-data-set,-with-PCA-applied-to-reduce-to-10-features">&#182;</a></h3>
+</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">from</span> <span class="nn">sklearn.datasets</span> <span class="kn">import</span> <span class="n">load_digits</span>
+<span class="kn">from</span> <span class="nn">sklearn.decomposition</span> <span class="kn">import</span> <span class="n">PCA</span>
+<span class="kn">from</span> <span class="nn">sklearn.preprocessing</span> <span class="kn">import</span> <span class="n">scale</span>
+
+<span class="n">np</span><span class="o">.</span><span class="n">random</span><span class="o">.</span><span class="n">seed</span><span class="p">(</span><span class="mi">42</span><span class="p">)</span>
+
+<span class="n">digits</span> <span class="o">=</span> <span class="n">load_digits</span><span class="p">()</span>
+<span class="n">data</span> <span class="o">=</span> <span class="n">scale</span><span class="p">(</span><span class="n">digits</span><span class="o">.</span><span class="n">data</span><span class="p">)</span>
+
+<span class="n">n_pca</span> <span class="o">=</span> <span class="mi">10</span>
+<span class="n">pca</span> <span class="o">=</span> <span class="n">PCA</span><span class="p">(</span><span class="n">n_components</span><span class="o">=</span><span class="n">n_pca</span><span class="p">)</span><span class="o">.</span><span class="n">fit</span><span class="p">(</span><span class="n">data</span><span class="p">)</span>
+<span class="n">df</span> <span class="o">=</span> <span class="n">pd</span><span class="o">.</span><span class="n">DataFrame</span><span class="p">(</span>
+    <span class="n">pca</span><span class="o">.</span><span class="n">transform</span><span class="p">(</span><span class="n">data</span><span class="p">),</span> <span class="n">columns</span><span class="o">=</span><span class="p">[</span><span class="s2">&quot;pca_</span><span class="si">{}</span><span class="s2">&quot;</span><span class="o">.</span><span class="n">format</span><span class="p">(</span><span class="n">x</span><span class="p">)</span> <span class="k">for</span> <span class="n">x</span> <span class="ow">in</span> <span class="nb">range</span><span class="p">(</span><span class="n">n_pca</span><span class="p">)]</span>
+<span class="p">)</span>
+<span class="n">df</span><span class="p">[</span><span class="s2">&quot;digit&quot;</span><span class="p">]</span> <span class="o">=</span> <span class="n">digits</span><span class="o">.</span><span class="n">target</span>
+<span class="n">df</span><span class="p">[</span><span class="s2">&quot;test&quot;</span><span class="p">]</span> <span class="o">=</span> <span class="p">[</span><span class="n">np</span><span class="o">.</span><span class="n">random</span><span class="o">.</span><span class="n">randint</span><span class="p">(</span><span class="mi">100</span><span class="p">)</span> <span class="k">for</span> <span class="n">x</span> <span class="ow">in</span> <span class="nb">range</span><span class="p">(</span><span class="n">digits</span><span class="o">.</span><span class="n">target</span><span class="o">.</span><span class="n">shape</span><span class="p">[</span><span class="mi">0</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">feature_vector_distribution</span><span class="p">(</span>
+    <span class="n">df</span><span class="p">,</span> <span class="s2">&quot;digit&quot;</span><span class="p">,</span> <span class="n">group_columns</span><span class="o">=</span><span class="p">[</span><span class="s2">&quot;test&quot;</span><span class="p">],</span> <span class="n">bins</span><span class="o">=</span><span class="mi">20</span><span class="p">,</span> <span class="n">f_lim</span><span class="o">=</span><span class="p">{</span><span class="s2">&quot;min&quot;</span><span class="p">:</span> <span class="o">-</span><span class="mi">7</span><span class="p">,</span> <span class="s2">&quot;max&quot;</span><span class="p">:</span> <span class="mi">7</span><span class="p">}</span>
+<span class="p">)</span>
+</pre></div>
+
+    </div>
+</div>
+</div>
+
+  </div>
+