<?xml version="1.0" encoding="UTF-8"?>
<rss  xmlns:atom="http://www.w3.org/2005/Atom" 
      xmlns:media="http://search.yahoo.com/mrss/" 
      xmlns:content="http://purl.org/rss/1.0/modules/content/" 
      xmlns:dc="http://purl.org/dc/elements/1.1/" 
      version="2.0">
<channel>
<title>great_tables</title>
<link>https://posit-dev.github.io/great-tables/blog/</link>
<atom:link href="https://posit-dev.github.io/great-tables/blog/index.xml" rel="self" type="application/rss+xml"/>
<description>Absolutely Delightful Table-making in Python</description>
<generator>quarto-1.9.37</generator>
<lastBuildDate>Thu, 12 Mar 2026 00:00:00 GMT</lastBuildDate>
<item>
  <title>Recreating Septa Transit Timetables in Python</title>
  <dc:creator>Michael Chow and Rich Iannone</dc:creator>
  <link>https://posit-dev.github.io/great-tables/blog/septa-timetables/</link>
  <description><![CDATA[ 




<p>Recently, Rich and I were poking around transit data, and we were struck by the amount of structuring that goes into transit timetables.</p>
<p>For example, consider this weekend rail schedule table from SEPTA, Philadelphia’s transit agency.</p>
<p><img src="https://posit-dev.github.io/great-tables/blog/septa-timetables/example-timetable.png" class="img-fluid" style="max-width: 700px; display: block; margin-left: auto; margin-right: auto;"></p>
<p>Notice these big pieces:</p>
<ul>
<li>The vertical text on the left indicating trains are traveling “TO CENTER CITY”.</li>
<li>The blue header, and spanner columns (“Services” and “Train Number”) grouping related columns.</li>
<li>The striped background for easier reading. Also the black background indicating stations in Center City (the urban core).</li>
</ul>
<p>Tables like this often have to be created in tools like Illustrator, and updated by hand. At the same time, when agencies automate table creation, they often sacrifice a lot of the assistive features and helpful affordances of the table.</p>
<p>We set out to recreate this table in Great Tables (and by we I mean 99% Rich). In this post, I’ll walk quickly through how we recreated it, and share some other examples of transit timetables in the wild. For the theory behind why tables like this are useful, see <a href="../../blog/design-philosophy/index.html">The Design Philosophy of Great Tables</a>.</p>
<section id="the-final-result" class="level2">
<h2 class="anchored" data-anchor-id="the-final-result">The final result</h2>
<p>Here’s a look at our quick version in Great Tables. In this post we’ll walk through quickly how we created it, but wanted to treat you to the final result up front! Note that the table is fully in HTML for accessibility.</p>
<div id="af5057e2" class="cell" data-execution_count="1">
<details class="code-fold">
<summary>Code</summary>
<div class="code-copy-outer-scaffold"><div class="sourceCode cell-code" id="cb1" style="background: #f1f3f5;"><pre class="sourceCode python code-with-copy"><code class="sourceCode python"><span id="cb1-1"><span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">from</span> great_tables <span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">import</span> GT, html, style, loc, google_font</span>
<span id="cb1-2"><span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">import</span> polars <span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">as</span> pl</span>
<span id="cb1-3"><span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">import</span> polars.selectors <span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">as</span> cs</span>
<span id="cb1-4"></span>
<span id="cb1-5">stops <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> pl.read_csv(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"chw-stops.csv"</span>)</span>
<span id="cb1-6">times <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> pl.read_csv(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"times.csv"</span>)</span>
<span id="cb1-7"></span>
<span id="cb1-8">stop_times <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> times.join(other<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>stops, on<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"stop_name"</span>, maintain_order<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"left"</span>).select(</span>
<span id="cb1-9">    pl.lit(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"To Center City"</span>).alias(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"direction"</span>), pl.col(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"*"</span>)</span>
<span id="cb1-10">)</span>
<span id="cb1-11"></span>
<span id="cb1-12"></span>
<span id="cb1-13"><span class="kw" style="color: #003B4F;
background-color: null;
font-weight: bold;
font-style: inherit;">def</span> h_m_p(s):</span>
<span id="cb1-14">    h, m, _ <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> [<span class="bu" style="color: null;
background-color: null;
font-style: inherit;">int</span>(part) <span class="cf" style="color: #003B4F;
background-color: null;
font-weight: bold;
font-style: inherit;">for</span> part <span class="kw" style="color: #003B4F;
background-color: null;
font-weight: bold;
font-style: inherit;">in</span> s.split(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">":"</span>)]</span>
<span id="cb1-15">    ap <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"a"</span></span>
<span id="cb1-16"></span>
<span id="cb1-17">    <span class="cf" style="color: #003B4F;
background-color: null;
font-weight: bold;
font-style: inherit;">if</span> h <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">&gt;</span> <span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">12</span>:</span>
<span id="cb1-18">        h <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">-=</span> <span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">12</span></span>
<span id="cb1-19">        ap <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"p"</span></span>
<span id="cb1-20">    <span class="cf" style="color: #003B4F;
background-color: null;
font-weight: bold;
font-style: inherit;">return</span> <span class="ss" style="color: #20794D;
background-color: null;
font-style: inherit;">f"</span><span class="sc" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">{</span>h<span class="sc" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">}</span><span class="ss" style="color: #20794D;
background-color: null;
font-style: inherit;">:</span><span class="sc" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">{</span>m<span class="sc" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">:02d}{</span>ap<span class="sc" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">}</span><span class="ss" style="color: #20794D;
background-color: null;
font-style: inherit;">"</span></span>
<span id="cb1-21"></span>
<span id="cb1-22"></span>
<span id="cb1-23"><span class="kw" style="color: #003B4F;
background-color: null;
font-weight: bold;
font-style: inherit;">def</span> tick(b):</span>
<span id="cb1-24">    <span class="cf" style="color: #003B4F;
background-color: null;
font-weight: bold;
font-style: inherit;">return</span> <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"&amp;check;"</span> <span class="cf" style="color: #003B4F;
background-color: null;
font-weight: bold;
font-style: inherit;">if</span> b <span class="cf" style="color: #003B4F;
background-color: null;
font-weight: bold;
font-style: inherit;">else</span> <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">""</span></span>
<span id="cb1-25"></span>
<span id="cb1-26"></span>
<span id="cb1-27">transit_table <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> (</span>
<span id="cb1-28">    GT(stop_times)</span>
<span id="cb1-29">    .tab_stub(groupname_col<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"direction"</span>)</span>
<span id="cb1-30">    .tab_header(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Saturdays, Sundays, and Major Holidays"</span>)</span>
<span id="cb1-31">    .cols_hide(columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>[<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"stop_url"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"zone_id"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"stop_desc"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"stop_lat"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"stop_lon"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"stop_id"</span>])</span>
<span id="cb1-32">    .fmt(h_m_p, columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>cs.matches(<span class="vs" style="color: #20794D;
background-color: null;
font-style: inherit;">r"</span><span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">^</span><span class="pp" style="color: #AD0000;
background-color: null;
font-style: inherit;">[0-9]</span><span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">{4}</span><span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">$</span><span class="vs" style="color: #20794D;
background-color: null;
font-style: inherit;">"</span>))</span>
<span id="cb1-33">    .fmt(tick, columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>cs.starts_with(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"service_"</span>))</span>
<span id="cb1-34">    .cols_label(</span>
<span id="cb1-35">        stop_name<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Stations"</span>,</span>
<span id="cb1-36">        service_access<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"A"</span>,</span>
<span id="cb1-37">        service_cash<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"C"</span>,</span>
<span id="cb1-38">        service_park<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"P"</span>,</span>
<span id="cb1-39">        fare_zone<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>html(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Fare&lt;br&gt;Zone"</span>),</span>
<span id="cb1-40">    )</span>
<span id="cb1-41">    .tab_spanner(label<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Services"</span>, columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>cs.starts_with(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"service_"</span>))</span>
<span id="cb1-42">    .tab_spanner(label<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Train Number"</span>, columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>cs.matches(<span class="vs" style="color: #20794D;
background-color: null;
font-style: inherit;">r"</span><span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">^</span><span class="pp" style="color: #AD0000;
background-color: null;
font-style: inherit;">[0-9]</span><span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">{4}</span><span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">$</span><span class="vs" style="color: #20794D;
background-color: null;
font-style: inherit;">"</span>))</span>
<span id="cb1-43">    .cols_move_to_start(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"fare_zone"</span>)</span>
<span id="cb1-44">    .cols_move_to_start(cs.starts_with(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"service_"</span>))</span>
<span id="cb1-45">    .cols_width(cases<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>{c: <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"20px"</span> <span class="cf" style="color: #003B4F;
background-color: null;
font-weight: bold;
font-style: inherit;">for</span> c <span class="kw" style="color: #003B4F;
background-color: null;
font-weight: bold;
font-style: inherit;">in</span> stop_times.columns <span class="cf" style="color: #003B4F;
background-color: null;
font-weight: bold;
font-style: inherit;">if</span> c.startswith(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"service_"</span>)})</span>
<span id="cb1-46">    .cols_width(cases<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>{c: <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"60px"</span> <span class="cf" style="color: #003B4F;
background-color: null;
font-weight: bold;
font-style: inherit;">for</span> c <span class="kw" style="color: #003B4F;
background-color: null;
font-weight: bold;
font-style: inherit;">in</span> stop_times.columns <span class="cf" style="color: #003B4F;
background-color: null;
font-weight: bold;
font-style: inherit;">if</span> c.startswith(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"8"</span>)})</span>
<span id="cb1-47">    .opt_row_striping(row_striping<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="va" style="color: #111111;
background-color: null;
font-style: inherit;">True</span>)</span>
<span id="cb1-48">    .cols_align(align<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"center"</span>, columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"fare_zone"</span>)</span>
<span id="cb1-49">    .cols_align(align<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"right"</span>, columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>cs.matches(<span class="vs" style="color: #20794D;
background-color: null;
font-style: inherit;">r"</span><span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">^</span><span class="pp" style="color: #AD0000;
background-color: null;
font-style: inherit;">[0-9]</span><span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">{4}</span><span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">$</span><span class="vs" style="color: #20794D;
background-color: null;
font-style: inherit;">"</span>))</span>
<span id="cb1-50">    <span class="co" style="color: #5E5E5E;
background-color: null;
font-style: inherit;"># style header</span></span>
<span id="cb1-51">    .tab_style(</span>
<span id="cb1-52">        locations<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>loc.header(),</span>
<span id="cb1-53">        style<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>style.css(</span>
<span id="cb1-54">            <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"background-color: rgb(66, 99, 128) !important; color: white !important; font-size: 24px !important; font-weight: bold !important; border-width: 0px !important;"</span>,</span>
<span id="cb1-55">        ),</span>
<span id="cb1-56">    )</span>
<span id="cb1-57">    <span class="co" style="color: #5E5E5E;
background-color: null;
font-style: inherit;"># style vertical text on left</span></span>
<span id="cb1-58">    .tab_style(</span>
<span id="cb1-59">        locations<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>loc.row_groups(),</span>
<span id="cb1-60">        <span class="co" style="color: #5E5E5E;
background-color: null;
font-style: inherit;"># </span><span class="al" style="color: #AD0000;
background-color: null;
font-style: inherit;">TODO</span><span class="co" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">: rotate text vertically</span></span>
<span id="cb1-61">        style<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>style.css(</span>
<span id="cb1-62">            <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"writing-mode: sideways-lr; padding-bottom: 25% !important; font-size: 24px !important; font-weight: bold !important; text-transform: uppercase !important;"</span></span>
<span id="cb1-63">        ),</span>
<span id="cb1-64">    )</span>
<span id="cb1-65">    .tab_style(</span>
<span id="cb1-66">        style<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>style.css(</span>
<span id="cb1-67">            <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"background-color: black !important; color: white !important; border-top: none !important; border-bottom: none !important;"</span></span>
<span id="cb1-68">        ),</span>
<span id="cb1-69">        locations<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>loc.body(columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="va" style="color: #111111;
background-color: null;
font-style: inherit;">None</span>, rows<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="bu" style="color: null;
background-color: null;
font-style: inherit;">list</span>(<span class="bu" style="color: null;
background-color: null;
font-style: inherit;">range</span>(<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">-</span><span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">4</span>, <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">-</span><span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">1</span>))),</span>
<span id="cb1-70">    )</span>
<span id="cb1-71">    .tab_style(</span>
<span id="cb1-72">        style<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>style.css(</span>
<span id="cb1-73">            <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"""</span></span>
<span id="cb1-74"><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">                border-top: none !important;</span></span>
<span id="cb1-75"><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">                border-bottom: none !important;</span></span>
<span id="cb1-76"><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">                border-right: solid white 2px !important;</span></span>
<span id="cb1-77"><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">                color: white !important;</span></span>
<span id="cb1-78"><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">            """</span></span>
<span id="cb1-79">        ),</span>
<span id="cb1-80">        locations<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>loc.body(columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=~</span>cs.matches(<span class="vs" style="color: #20794D;
background-color: null;
font-style: inherit;">r"</span><span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">^</span><span class="pp" style="color: #AD0000;
background-color: null;
font-style: inherit;">[0-9]</span><span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">{4}</span><span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">$</span><span class="vs" style="color: #20794D;
background-color: null;
font-style: inherit;">"</span>), rows<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="bu" style="color: null;
background-color: null;
font-style: inherit;">list</span>(<span class="bu" style="color: null;
background-color: null;
font-style: inherit;">range</span>(<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">-</span><span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">4</span>, <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">-</span><span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">1</span>))),</span>
<span id="cb1-81">    )</span>
<span id="cb1-82">    .tab_style(</span>
<span id="cb1-83">        style<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>style.css(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"border-right: solid black 2px !important;"</span>),</span>
<span id="cb1-84">        locations<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>loc.body(columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=~</span>cs.matches(<span class="vs" style="color: #20794D;
background-color: null;
font-style: inherit;">r"</span><span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">^</span><span class="pp" style="color: #AD0000;
background-color: null;
font-style: inherit;">[0-9]</span><span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">{4}</span><span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">$</span><span class="vs" style="color: #20794D;
background-color: null;
font-style: inherit;">"</span>), rows<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="bu" style="color: null;
background-color: null;
font-style: inherit;">list</span>(<span class="bu" style="color: null;
background-color: null;
font-style: inherit;">range</span>(<span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">0</span>, <span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">10</span>)) <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">+</span> [<span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">13</span>]),</span>
<span id="cb1-85">    )</span>
<span id="cb1-86">    .tab_options(</span>
<span id="cb1-87">        row_striping_background_color<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"#A9A9A9"</span>,</span>
<span id="cb1-88">        row_group_as_column<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="va" style="color: #111111;
background-color: null;
font-style: inherit;">True</span>,</span>
<span id="cb1-89">    )</span>
<span id="cb1-90">    .opt_table_outline()</span>
<span id="cb1-91">    .opt_table_font(font<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>google_font(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"IBM Plex Sans"</span>))</span>
<span id="cb1-92">)</span>
<span id="cb1-93"></span>
<span id="cb1-94">transit_table</span></code></pre></div></div>
</details>
<div class="cell-output cell-output-stderr">
<pre><code>/opt/hostedtoolcache/Python/3.10.20/x64/lib/python3.10/site-packages/great_tables/_render_checks.py:37: RenderWarning: Rendering table with .cols_width() in Quarto may result in unexpected behavior. This is because Quarto performs custom table processing. Either use all percentage widths, or set .tab_options(quarto_disable_processing=True) to disable Quarto table processing.
  warnings.warn(</code></pre>
</div>
<div class="cell-output cell-output-display" data-execution_count="1">
<div id="mxpkbsqatu" style="padding-left:0px;padding-right:0px;padding-top:10px;padding-bottom:10px;overflow-x:auto;overflow-y:auto;width:auto;height:auto;">
<style>
@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans&display=swap');
#mxpkbsqatu table {
          font-family: 'IBM Plex Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Helvetica Neue', 'Fira Sans', 'Droid Sans', Arial, sans-serif;
          -webkit-font-smoothing: antialiased;
          -moz-osx-font-smoothing: grayscale;
        }

#mxpkbsqatu thead, tbody, tfoot, tr, td, th { border-style: none; }
 tr { background-color: transparent; }
#mxpkbsqatu p { margin: 0; padding: 0; }
 #mxpkbsqatu .gt_table { display: table; border-collapse: collapse; line-height: normal; margin-left: auto; margin-right: auto; color: #333333; font-size: 16px; font-weight: normal; font-style: normal; background-color: #FFFFFF; width: auto; border-top-style: solid; border-top-width: 3px; border-top-color: #D3D3D3; border-right-style: solid; border-right-width: 3px; border-right-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 3px; border-bottom-color: #D3D3D3; border-left-style: solid; border-left-width: 3px; border-left-color: #D3D3D3; }
 #mxpkbsqatu .gt_caption { padding-top: 4px; padding-bottom: 4px; }
 #mxpkbsqatu .gt_title { color: #333333; font-size: 125%; font-weight: initial; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; border-bottom-color: #FFFFFF; border-bottom-width: 0; }
 #mxpkbsqatu .gt_subtitle { color: #333333; font-size: 85%; font-weight: initial; padding-top: 3px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; border-top-color: #FFFFFF; border-top-width: 0; }
 #mxpkbsqatu .gt_heading { background-color: #FFFFFF; text-align: center; border-bottom-color: #FFFFFF; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #mxpkbsqatu .gt_bottom_border { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #mxpkbsqatu .gt_col_headings { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #mxpkbsqatu .gt_col_heading { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; overflow-x: hidden; }
 #mxpkbsqatu .gt_column_spanner_outer { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; padding-top: 0; padding-bottom: 0; padding-left: 4px; padding-right: 4px; }
 #mxpkbsqatu .gt_column_spanner_outer:first-child { padding-left: 0; }
 #mxpkbsqatu .gt_column_spanner_outer:last-child { padding-right: 0; }
 #mxpkbsqatu .gt_column_spanner { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; overflow-x: hidden; display: inline-block; width: 100%; }
 #mxpkbsqatu .gt_spanner_row { border-bottom-style: hidden; }
 #mxpkbsqatu .gt_group_heading { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; text-align: left; }
 #mxpkbsqatu .gt_empty_group_heading { padding: 0.5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: middle; }
 #mxpkbsqatu .gt_from_md> :first-child { margin-top: 0; }
 #mxpkbsqatu .gt_from_md> :last-child { margin-bottom: 0; }
 #mxpkbsqatu .gt_row { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; margin: 10px; border-top-style: solid; border-top-width: 1px; border-top-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; overflow-x: hidden; }
 #mxpkbsqatu .gt_stub { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; }
 #mxpkbsqatu .gt_stub_row_group { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; vertical-align: top; }
 #mxpkbsqatu .gt_row_group_first td { border-top-width: 2px; }
 #mxpkbsqatu .gt_row_group_first th { border-top-width: 2px; }
 #mxpkbsqatu .gt_striped { color: #333333; background-color: #A9A9A9; }
 #mxpkbsqatu .gt_table_body { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #mxpkbsqatu .gt_grand_summary_row { color: #333333; background-color: #FFFFFF; text-transform: inherit; padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; }
 #mxpkbsqatu .gt_first_grand_summary_row_bottom { border-top-style: double; border-top-width: 6px; border-top-color: #D3D3D3; }
 #mxpkbsqatu .gt_last_grand_summary_row_top { border-bottom-style: double; border-bottom-width: 6px; border-bottom-color: #D3D3D3; }
 #mxpkbsqatu .gt_sourcenotes { color: #333333; background-color: #FFFFFF; border-bottom-style: none; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; }
 #mxpkbsqatu .gt_sourcenote { font-size: 90%; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; text-align: left; }
 #mxpkbsqatu .gt_left { text-align: left; }
 #mxpkbsqatu .gt_center { text-align: center; }
 #mxpkbsqatu .gt_right { text-align: right; font-variant-numeric: tabular-nums; }
 #mxpkbsqatu .gt_font_normal { font-weight: normal; }
 #mxpkbsqatu .gt_font_bold { font-weight: bold; }
 #mxpkbsqatu .gt_font_italic { font-style: italic; }
 #mxpkbsqatu .gt_super { font-size: 65%; }
 #mxpkbsqatu .gt_footnote_marks { font-size: 75%; vertical-align: 0.4em; position: initial; }
 #mxpkbsqatu .gt_asterisk { font-size: 100%; vertical-align: 0; }
 
</style>
<table style="table-layout: fixed;" class="gt_table" data-quarto-disable-processing="false" data-quarto-bootstrap="false">
<colgroup>
  <col>
  <col style="width:20px;">
  <col style="width:20px;">
  <col style="width:20px;">
  <col>
  <col>
  <col style="width:60px;">
  <col style="width:60px;">
  <col style="width:60px;">
  <col style="width:60px;">
  <col style="width:60px;">
  <col style="width:60px;">
  <col style="width:60px;">
  <col style="width:60px;">
</colgroup>

<thead>

  <tr class="gt_heading">
    <td colspan="14" class="gt_heading gt_title gt_font_normal" style="background-color: rgb(66, 99, 128) !important; color: white !important; font-size: 24px !important; font-weight: bold !important; border-width: 0px !important;">Saturdays, Sundays, and Major Holidays</td>
  </tr>
<tr class="gt_col_headings gt_spanner_row">
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="2" colspan="1" scope="col" id=""></th>
  <th class="gt_center gt_columns_top_border gt_column_spanner_outer" rowspan="1" colspan="3" scope="colgroup" id="Services">
    <span class="gt_column_spanner">Services</span>
  </th>
  <th class="gt_col_heading gt_columns_bottom_border gt_center" rowspan="2" colspan="1" scope="col" id="fare_zone">Fare<br>Zone</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="2" colspan="1" scope="col" id="stop_name">Stations</th>
  <th class="gt_center gt_columns_top_border gt_column_spanner_outer" rowspan="1" colspan="8" scope="colgroup" id="Train-Number">
    <span class="gt_column_spanner">Train Number</span>
  </th>
</tr>
<tr class="gt_col_headings">
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="service_access">A</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="service_cash">C</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="service_park">P</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="8210">8210</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="8716">8716</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="8318">8318</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="8322">8322</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="8338">8338</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="8242">8242</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="8750">8750</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="8756">8756</th>
</tr>
</thead>
<tbody class="gt_table_body">
  <tr>
  <th style="writing-mode: sideways-lr; padding-bottom: 25% !important; font-size: 24px !important; font-weight: bold !important; text-transform: uppercase !important;" class="gt_row gt_left gt_stub_row_group" rowspan="14">To Center City</th>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_right"></td>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_right"></td>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_right">✓</td>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_center">2</td>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_left">Chestnut Hill West</td>
    <td class="gt_row gt_right">6:51a</td>
    <td class="gt_row gt_right">8:08a</td>
    <td class="gt_row gt_right">8:49a</td>
    <td class="gt_row gt_right">9:49a</td>
    <td class="gt_row gt_right">1:52p</td>
    <td class="gt_row gt_right">2:49p</td>
    <td class="gt_row gt_right">4:48p</td>
    <td class="gt_row gt_right">6:20p</td>
  </tr>
  <tr>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_right gt_striped"></td>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_right gt_striped"></td>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_right gt_striped">✓</td>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_center gt_striped">2</td>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_left gt_striped">Highland</td>
    <td class="gt_row gt_right gt_striped">6:52a</td>
    <td class="gt_row gt_right gt_striped">8:09a</td>
    <td class="gt_row gt_right gt_striped">8:50a</td>
    <td class="gt_row gt_right gt_striped">9:50a</td>
    <td class="gt_row gt_right gt_striped">1:53p</td>
    <td class="gt_row gt_right gt_striped">2:50p</td>
    <td class="gt_row gt_right gt_striped">4:49p</td>
    <td class="gt_row gt_right gt_striped">6:21p</td>
  </tr>
  <tr>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_right"></td>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_right"></td>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_right">✓</td>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_center">1</td>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_left">St. Martins</td>
    <td class="gt_row gt_right">6:54a</td>
    <td class="gt_row gt_right">8:11a</td>
    <td class="gt_row gt_right">8:52a</td>
    <td class="gt_row gt_right">9:52a</td>
    <td class="gt_row gt_right">1:55p</td>
    <td class="gt_row gt_right">2:52p</td>
    <td class="gt_row gt_right">4:51p</td>
    <td class="gt_row gt_right">6:23p</td>
  </tr>
  <tr>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_right gt_striped"></td>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_right gt_striped"></td>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_right gt_striped">✓</td>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_center gt_striped">1</td>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_left gt_striped">Richard Allen Lane</td>
    <td class="gt_row gt_right gt_striped">6:56a</td>
    <td class="gt_row gt_right gt_striped">8:13a</td>
    <td class="gt_row gt_right gt_striped">8:54a</td>
    <td class="gt_row gt_right gt_striped">9:54a</td>
    <td class="gt_row gt_right gt_striped">1:57p</td>
    <td class="gt_row gt_right gt_striped">2:54p</td>
    <td class="gt_row gt_right gt_striped">4:53p</td>
    <td class="gt_row gt_right gt_striped">6:25p</td>
  </tr>
  <tr>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_right">✓</td>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_right"></td>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_right">✓</td>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_center">1</td>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_left">Carpenter</td>
    <td class="gt_row gt_right">6:58a</td>
    <td class="gt_row gt_right">8:15a</td>
    <td class="gt_row gt_right">8:56a</td>
    <td class="gt_row gt_right">9:56a</td>
    <td class="gt_row gt_right">1:59p</td>
    <td class="gt_row gt_right">2:56p</td>
    <td class="gt_row gt_right">4:55p</td>
    <td class="gt_row gt_right">6:27p</td>
  </tr>
  <tr>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_right gt_striped"></td>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_right gt_striped"></td>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_right gt_striped"></td>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_center gt_striped">1</td>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_left gt_striped">Upsal</td>
    <td class="gt_row gt_right gt_striped">7:00a</td>
    <td class="gt_row gt_right gt_striped">8:17a</td>
    <td class="gt_row gt_right gt_striped">8:58a</td>
    <td class="gt_row gt_right gt_striped">9:58a</td>
    <td class="gt_row gt_right gt_striped">2:01p</td>
    <td class="gt_row gt_right gt_striped">2:58p</td>
    <td class="gt_row gt_right gt_striped">4:57p</td>
    <td class="gt_row gt_right gt_striped">6:29p</td>
  </tr>
  <tr>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_right">✓</td>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_right">✓</td>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_right"></td>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_center">C</td>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_left">Tulpehocken</td>
    <td class="gt_row gt_right">7:02a</td>
    <td class="gt_row gt_right">8:19a</td>
    <td class="gt_row gt_right">9:00a</td>
    <td class="gt_row gt_right">10:00a</td>
    <td class="gt_row gt_right">2:03p</td>
    <td class="gt_row gt_right">3:00p</td>
    <td class="gt_row gt_right">4:59p</td>
    <td class="gt_row gt_right">6:31p</td>
  </tr>
  <tr>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_right gt_striped">✓</td>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_right gt_striped">✓</td>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_right gt_striped"></td>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_center gt_striped">C</td>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_left gt_striped">Chelten Avenue</td>
    <td class="gt_row gt_right gt_striped">7:04a</td>
    <td class="gt_row gt_right gt_striped">8:21a</td>
    <td class="gt_row gt_right gt_striped">9:02a</td>
    <td class="gt_row gt_right gt_striped">10:02a</td>
    <td class="gt_row gt_right gt_striped">2:05p</td>
    <td class="gt_row gt_right gt_striped">3:02p</td>
    <td class="gt_row gt_right gt_striped">5:01p</td>
    <td class="gt_row gt_right gt_striped">6:33p</td>
  </tr>
  <tr>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_right">✓</td>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_right">✓</td>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_right"></td>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_center">C</td>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_left">Queen Lane</td>
    <td class="gt_row gt_right">7:06a</td>
    <td class="gt_row gt_right">8:23a</td>
    <td class="gt_row gt_right">9:04a</td>
    <td class="gt_row gt_right">10:04a</td>
    <td class="gt_row gt_right">2:07p</td>
    <td class="gt_row gt_right">3:04p</td>
    <td class="gt_row gt_right">5:03p</td>
    <td class="gt_row gt_right">6:35p</td>
  </tr>
  <tr>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_right gt_striped">✓</td>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_right gt_striped"></td>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_right gt_striped"></td>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_center gt_striped">C</td>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_left gt_striped">North Philadelphia</td>
    <td class="gt_row gt_right gt_striped">7:12a</td>
    <td class="gt_row gt_right gt_striped">8:29a</td>
    <td class="gt_row gt_right gt_striped">9:12a</td>
    <td class="gt_row gt_right gt_striped">10:12a</td>
    <td class="gt_row gt_right gt_striped">2:15p</td>
    <td class="gt_row gt_right gt_striped">3:12p</td>
    <td class="gt_row gt_right gt_striped">5:09p</td>
    <td class="gt_row gt_right gt_striped">6:41p</td>
  </tr>
  <tr>
    <td style="background-color: black !important; color: white !important; border-top: none !important; border-bottom: none !important; 
                border-top: none !important;
                border-bottom: none !important;
                border-right: solid white 2px !important;
                color: white !important;
            " class="gt_row gt_right">✓</td>
    <td style="background-color: black !important; color: white !important; border-top: none !important; border-bottom: none !important; 
                border-top: none !important;
                border-bottom: none !important;
                border-right: solid white 2px !important;
                color: white !important;
            " class="gt_row gt_right"></td>
    <td style="background-color: black !important; color: white !important; border-top: none !important; border-bottom: none !important; 
                border-top: none !important;
                border-bottom: none !important;
                border-right: solid white 2px !important;
                color: white !important;
            " class="gt_row gt_right">✓</td>
    <td style="background-color: black !important; color: white !important; border-top: none !important; border-bottom: none !important; 
                border-top: none !important;
                border-bottom: none !important;
                border-right: solid white 2px !important;
                color: white !important;
            " class="gt_row gt_center">2</td>
    <td style="background-color: black !important; color: white !important; border-top: none !important; border-bottom: none !important; 
                border-top: none !important;
                border-bottom: none !important;
                border-right: solid white 2px !important;
                color: white !important;
            " class="gt_row gt_left">Gray 30th Street</td>
    <td style="background-color: black !important; color: white !important; border-top: none !important; border-bottom: none !important;" class="gt_row gt_right">7:23a</td>
    <td style="background-color: black !important; color: white !important; border-top: none !important; border-bottom: none !important;" class="gt_row gt_right">8:42a</td>
    <td style="background-color: black !important; color: white !important; border-top: none !important; border-bottom: none !important;" class="gt_row gt_right">9:23a</td>
    <td style="background-color: black !important; color: white !important; border-top: none !important; border-bottom: none !important;" class="gt_row gt_right">10:23a</td>
    <td style="background-color: black !important; color: white !important; border-top: none !important; border-bottom: none !important;" class="gt_row gt_right">2:26p</td>
    <td style="background-color: black !important; color: white !important; border-top: none !important; border-bottom: none !important;" class="gt_row gt_right">3:23p</td>
    <td style="background-color: black !important; color: white !important; border-top: none !important; border-bottom: none !important;" class="gt_row gt_right">5:20p</td>
    <td style="background-color: black !important; color: white !important; border-top: none !important; border-bottom: none !important;" class="gt_row gt_right">6:54p</td>
  </tr>
  <tr>
    <td style="background-color: black !important; color: white !important; border-top: none !important; border-bottom: none !important; 
                border-top: none !important;
                border-bottom: none !important;
                border-right: solid white 2px !important;
                color: white !important;
            " class="gt_row gt_right gt_striped"></td>
    <td style="background-color: black !important; color: white !important; border-top: none !important; border-bottom: none !important; 
                border-top: none !important;
                border-bottom: none !important;
                border-right: solid white 2px !important;
                color: white !important;
            " class="gt_row gt_right gt_striped"></td>
    <td style="background-color: black !important; color: white !important; border-top: none !important; border-bottom: none !important; 
                border-top: none !important;
                border-bottom: none !important;
                border-right: solid white 2px !important;
                color: white !important;
            " class="gt_row gt_right gt_striped">✓</td>
    <td style="background-color: black !important; color: white !important; border-top: none !important; border-bottom: none !important; 
                border-top: none !important;
                border-bottom: none !important;
                border-right: solid white 2px !important;
                color: white !important;
            " class="gt_row gt_center gt_striped">2</td>
    <td style="background-color: black !important; color: white !important; border-top: none !important; border-bottom: none !important; 
                border-top: none !important;
                border-bottom: none !important;
                border-right: solid white 2px !important;
                color: white !important;
            " class="gt_row gt_left gt_striped">Suburban Station</td>
    <td style="background-color: black !important; color: white !important; border-top: none !important; border-bottom: none !important;" class="gt_row gt_right gt_striped">7:28a</td>
    <td style="background-color: black !important; color: white !important; border-top: none !important; border-bottom: none !important;" class="gt_row gt_right gt_striped">8:47a</td>
    <td style="background-color: black !important; color: white !important; border-top: none !important; border-bottom: none !important;" class="gt_row gt_right gt_striped">9:28a</td>
    <td style="background-color: black !important; color: white !important; border-top: none !important; border-bottom: none !important;" class="gt_row gt_right gt_striped">10:28a</td>
    <td style="background-color: black !important; color: white !important; border-top: none !important; border-bottom: none !important;" class="gt_row gt_right gt_striped">2:31p</td>
    <td style="background-color: black !important; color: white !important; border-top: none !important; border-bottom: none !important;" class="gt_row gt_right gt_striped">3:28p</td>
    <td style="background-color: black !important; color: white !important; border-top: none !important; border-bottom: none !important;" class="gt_row gt_right gt_striped">5:25p</td>
    <td style="background-color: black !important; color: white !important; border-top: none !important; border-bottom: none !important;" class="gt_row gt_right gt_striped">6:59p</td>
  </tr>
  <tr>
    <td style="background-color: black !important; color: white !important; border-top: none !important; border-bottom: none !important; 
                border-top: none !important;
                border-bottom: none !important;
                border-right: solid white 2px !important;
                color: white !important;
            " class="gt_row gt_right"></td>
    <td style="background-color: black !important; color: white !important; border-top: none !important; border-bottom: none !important; 
                border-top: none !important;
                border-bottom: none !important;
                border-right: solid white 2px !important;
                color: white !important;
            " class="gt_row gt_right"></td>
    <td style="background-color: black !important; color: white !important; border-top: none !important; border-bottom: none !important; 
                border-top: none !important;
                border-bottom: none !important;
                border-right: solid white 2px !important;
                color: white !important;
            " class="gt_row gt_right">✓</td>
    <td style="background-color: black !important; color: white !important; border-top: none !important; border-bottom: none !important; 
                border-top: none !important;
                border-bottom: none !important;
                border-right: solid white 2px !important;
                color: white !important;
            " class="gt_row gt_center">2</td>
    <td style="background-color: black !important; color: white !important; border-top: none !important; border-bottom: none !important; 
                border-top: none !important;
                border-bottom: none !important;
                border-right: solid white 2px !important;
                color: white !important;
            " class="gt_row gt_left">Jefferson Station</td>
    <td style="background-color: black !important; color: white !important; border-top: none !important; border-bottom: none !important;" class="gt_row gt_right">7:33a</td>
    <td style="background-color: black !important; color: white !important; border-top: none !important; border-bottom: none !important;" class="gt_row gt_right">8:52a</td>
    <td style="background-color: black !important; color: white !important; border-top: none !important; border-bottom: none !important;" class="gt_row gt_right">9:33a</td>
    <td style="background-color: black !important; color: white !important; border-top: none !important; border-bottom: none !important;" class="gt_row gt_right">10:33a</td>
    <td style="background-color: black !important; color: white !important; border-top: none !important; border-bottom: none !important;" class="gt_row gt_right">2:36p</td>
    <td style="background-color: black !important; color: white !important; border-top: none !important; border-bottom: none !important;" class="gt_row gt_right">3:33p</td>
    <td style="background-color: black !important; color: white !important; border-top: none !important; border-bottom: none !important;" class="gt_row gt_right">5:30p</td>
    <td style="background-color: black !important; color: white !important; border-top: none !important; border-bottom: none !important;" class="gt_row gt_right">7:04p</td>
  </tr>
  <tr>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_right gt_striped">✓</td>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_right gt_striped"></td>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_right gt_striped">✓</td>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_center gt_striped">2</td>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_left gt_striped">Temple University</td>
    <td class="gt_row gt_right gt_striped">7:37a</td>
    <td class="gt_row gt_right gt_striped">8:57a</td>
    <td class="gt_row gt_right gt_striped">9:37a</td>
    <td class="gt_row gt_right gt_striped">10:37a</td>
    <td class="gt_row gt_right gt_striped">2:40p</td>
    <td class="gt_row gt_right gt_striped">3:37p</td>
    <td class="gt_row gt_right gt_striped">5:35p</td>
    <td class="gt_row gt_right gt_striped">7:08p</td>
  </tr>
</tbody>


</table>

</div>
</div>
</div>
</section>
<section id="reading-in-stops-and-times" class="level2">
<h2 class="anchored" data-anchor-id="reading-in-stops-and-times">Reading in stops and times</h2>
<p>For this example, I simplified SEPTA’s transit data down to two pieces:</p>
<ul>
<li><code>chw-stops.csv</code> - detailed information about each stop location.</li>
<li><code>times.csv</code> - when a train arrives at a stop on the Chesnut Hill West line. Each row is a stop location, and each column is a trip (e.g.&nbsp;the 6:51am train).</li>
</ul>
<p>To make the final table we joined these two together, to get the trips and stop information together.</p>
<div id="2ec33c8a" class="cell" data-execution_count="2">
<div class="code-copy-outer-scaffold"><div class="sourceCode cell-code" id="cb3" style="background: #f1f3f5;"><pre class="sourceCode python code-with-copy"><code class="sourceCode python"><span id="cb3-1"><span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">import</span> polars <span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">as</span> pl</span>
<span id="cb3-2"></span>
<span id="cb3-3">stops <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> pl.read_csv(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"chw-stops.csv"</span>)</span>
<span id="cb3-4">times <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> pl.read_csv(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"times.csv"</span>)</span></code></pre></div></div>
</div>
<p>Here’s a quick preview of stops.</p>
<div id="31f176f8" class="cell" data-execution_count="3">
<div class="code-copy-outer-scaffold"><div class="sourceCode cell-code" id="cb4" style="background: #f1f3f5;"><pre class="sourceCode python code-with-copy"><code class="sourceCode python"><span id="cb4-1">stops.select(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"stop_name"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"service_access"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"service_cash"</span>).head()</span></code></pre></div></div>
<div class="cell-output cell-output-display" data-execution_count="3">
<div><style>
.dataframe > thead > tr,
.dataframe > tbody > tr {
  text-align: right;
  white-space: pre-wrap;
}
</style>
<small>shape: (5, 3)</small><table class="dataframe table table-sm table-striped small"><thead><tr><th>stop_name</th><th>service_access</th><th>service_cash</th></tr><tr><td>str</td><td>i64</td><td>i64</td></tr></thead><tbody><tr><td>"Gray 30th Street"</td><td>1</td><td>0</td></tr><tr><td>"Suburban Station"</td><td>0</td><td>0</td></tr><tr><td>"Jefferson Station"</td><td>0</td><td>0</td></tr><tr><td>"Temple University"</td><td>1</td><td>0</td></tr><tr><td>"Chestnut Hill West"</td><td>0</td><td>0</td></tr></tbody></table></div>
</div>
</div>
<p>Notice that the table above has the name of each stop, and a 1 or 0 in the <code>service_access</code> column to indicate whether the stop is wheelchair accessible. Note that a big challenge for this specific route is that sometimes boarding the train requires using steps, and sometimes the station requires using steps. For example, Chelton Ave (not shown) does not require steps to board the train, but the station itself is not wheelchair accessible because of steps to get to the platform.</p>
<p>Here’s a quick preview of the times.</p>
<div id="484a51c6" class="cell" data-execution_count="4">
<div class="code-copy-outer-scaffold"><div class="sourceCode cell-code" id="cb5" style="background: #f1f3f5;"><pre class="sourceCode python code-with-copy"><code class="sourceCode python"><span id="cb5-1">times.head(<span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">3</span>)</span></code></pre></div></div>
<div class="cell-output cell-output-display" data-execution_count="4">
<div><style>
.dataframe > thead > tr,
.dataframe > tbody > tr {
  text-align: right;
  white-space: pre-wrap;
}
</style>
<small>shape: (3, 9)</small><table class="dataframe table table-sm table-striped small"><thead><tr><th>stop_name</th><th>8210</th><th>8716</th><th>8318</th><th>8322</th><th>8338</th><th>8242</th><th>8750</th><th>8756</th></tr><tr><td>str</td><td>str</td><td>str</td><td>str</td><td>str</td><td>str</td><td>str</td><td>str</td><td>str</td></tr></thead><tbody><tr><td>"Chestnut Hill West"</td><td>"06:51:00"</td><td>"08:08:00"</td><td>"08:49:00"</td><td>"09:49:00"</td><td>"13:52:00"</td><td>"14:49:00"</td><td>"16:48:00"</td><td>"18:20:00"</td></tr><tr><td>"Highland"</td><td>"06:52:00"</td><td>"08:09:00"</td><td>"08:50:00"</td><td>"09:50:00"</td><td>"13:53:00"</td><td>"14:50:00"</td><td>"16:49:00"</td><td>"18:21:00"</td></tr><tr><td>"St. Martins"</td><td>"06:54:00"</td><td>"08:11:00"</td><td>"08:52:00"</td><td>"09:52:00"</td><td>"13:55:00"</td><td>"14:52:00"</td><td>"16:51:00"</td><td>"18:23:00"</td></tr></tbody></table></div>
</div>
</div>
<p>Notice that each trip is a column (i.e.&nbsp;a train leaving from Chesnut Hill West at a specific time), and each row is a stop. For example, the 8210 train is the 6:51am train. (Note that schedules and train numbers can change, so this data may be out of date).</p>
<p>Joining these together gives us <code>stop_times</code>, with trips and stop information on the columns.</p>
<div id="5f0d63d3" class="cell" data-execution_count="5">
<div class="code-copy-outer-scaffold"><div class="sourceCode cell-code" id="cb6" style="background: #f1f3f5;"><pre class="sourceCode python code-with-copy"><code class="sourceCode python"><span id="cb6-1">stop_times <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> times.join(other<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>stops, on<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"stop_name"</span>, maintain_order<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"left"</span>).select(</span>
<span id="cb6-2">    pl.lit(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"To Center City"</span>).alias(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"direction"</span>), pl.col(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"*"</span>)</span>
<span id="cb6-3">)</span>
<span id="cb6-4"></span>
<span id="cb6-5">stop_times.head(<span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">3</span>)</span></code></pre></div></div>
<div class="cell-output cell-output-display" data-execution_count="5">
<div><style>
.dataframe > thead > tr,
.dataframe > tbody > tr {
  text-align: right;
  white-space: pre-wrap;
}
</style>
<small>shape: (3, 20)</small><table class="dataframe table table-sm table-striped small"><thead><tr><th>direction</th><th>stop_name</th><th>8210</th><th>8716</th><th>8318</th><th>8322</th><th>8338</th><th>8242</th><th>8750</th><th>8756</th><th>service_access</th><th>service_cash</th><th>service_park</th><th>fare_zone</th><th>stop_id</th><th>stop_desc</th><th>stop_lat</th><th>stop_lon</th><th>zone_id</th><th>stop_url</th></tr><tr><td>str</td><td>str</td><td>str</td><td>str</td><td>str</td><td>str</td><td>str</td><td>str</td><td>str</td><td>str</td><td>i64</td><td>i64</td><td>i64</td><td>str</td><td>i64</td><td>str</td><td>f64</td><td>f64</td><td>str</td><td>str</td></tr></thead><tbody><tr><td>"To Center City"</td><td>"Chestnut Hill West"</td><td>"06:51:00"</td><td>"08:08:00"</td><td>"08:49:00"</td><td>"09:49:00"</td><td>"13:52:00"</td><td>"14:49:00"</td><td>"16:48:00"</td><td>"18:20:00"</td><td>0</td><td>0</td><td>1</td><td>"2"</td><td>90801</td><td>null</td><td>40.076389</td><td>-75.208333</td><td>"2S"</td><td>null</td></tr><tr><td>"To Center City"</td><td>"Highland"</td><td>"06:52:00"</td><td>"08:09:00"</td><td>"08:50:00"</td><td>"09:50:00"</td><td>"13:53:00"</td><td>"14:50:00"</td><td>"16:49:00"</td><td>"18:21:00"</td><td>0</td><td>0</td><td>1</td><td>"2"</td><td>90802</td><td>null</td><td>40.070556</td><td>-75.211111</td><td>"2S"</td><td>null</td></tr><tr><td>"To Center City"</td><td>"St. Martins"</td><td>"06:54:00"</td><td>"08:11:00"</td><td>"08:52:00"</td><td>"09:52:00"</td><td>"13:55:00"</td><td>"14:52:00"</td><td>"16:51:00"</td><td>"18:23:00"</td><td>0</td><td>0</td><td>1</td><td>"1"</td><td>90803</td><td>null</td><td>40.065833</td><td>-75.204444</td><td>"2S"</td><td>null</td></tr></tbody></table></div>
</div>
</div>
<p>Notice that in the table above, the first row tells us when each train leaves Chesnut Hill West, and information about the Chesnut Hill West stop.</p>
</section>
<section id="creating-the-table" class="level2">
<h2 class="anchored" data-anchor-id="creating-the-table">Creating the table</h2>
<p>Below is the code for the table, with 5 key activities marked with comments. For example, the first is creating high level structure, like the header and the left-hand “To Center City” stub. Others include formatting in checkmarks, customizing columns (e.g.&nbsp;their width), and styling (e.g.&nbsp;setting background colors and fonts).</p>
<p>It’s a lot to take in, but worth it!:</p>
<div id="76e3985f" class="cell" data-execution_count="6">
<div class="code-copy-outer-scaffold"><div class="sourceCode cell-code" id="cb7" style="background: #f1f3f5;"><pre class="sourceCode python code-with-copy"><code class="sourceCode python"><span id="cb7-1"><span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">from</span> great_tables <span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">import</span> GT, html, style, loc, google_font</span>
<span id="cb7-2"><span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">import</span> polars <span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">as</span> pl</span>
<span id="cb7-3"><span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">import</span> polars.selectors <span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">as</span> cs</span>
<span id="cb7-4"></span>
<span id="cb7-5"></span>
<span id="cb7-6"><span class="kw" style="color: #003B4F;
background-color: null;
font-weight: bold;
font-style: inherit;">def</span> h_m_p(s):</span>
<span id="cb7-7">    h, m, _ <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> [<span class="bu" style="color: null;
background-color: null;
font-style: inherit;">int</span>(part) <span class="cf" style="color: #003B4F;
background-color: null;
font-weight: bold;
font-style: inherit;">for</span> part <span class="kw" style="color: #003B4F;
background-color: null;
font-weight: bold;
font-style: inherit;">in</span> s.split(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">":"</span>)]</span>
<span id="cb7-8">    ap <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"a"</span></span>
<span id="cb7-9"></span>
<span id="cb7-10">    <span class="cf" style="color: #003B4F;
background-color: null;
font-weight: bold;
font-style: inherit;">if</span> h <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">&gt;</span> <span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">12</span>:</span>
<span id="cb7-11">        h <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">-=</span> <span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">12</span></span>
<span id="cb7-12">        ap <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"p"</span></span>
<span id="cb7-13">    <span class="cf" style="color: #003B4F;
background-color: null;
font-weight: bold;
font-style: inherit;">return</span> <span class="ss" style="color: #20794D;
background-color: null;
font-style: inherit;">f"</span><span class="sc" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">{</span>h<span class="sc" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">}</span><span class="ss" style="color: #20794D;
background-color: null;
font-style: inherit;">:</span><span class="sc" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">{</span>m<span class="sc" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">:02d}{</span>ap<span class="sc" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">}</span><span class="ss" style="color: #20794D;
background-color: null;
font-style: inherit;">"</span></span>
<span id="cb7-14"></span>
<span id="cb7-15"></span>
<span id="cb7-16"><span class="kw" style="color: #003B4F;
background-color: null;
font-weight: bold;
font-style: inherit;">def</span> tick(b):</span>
<span id="cb7-17">    <span class="cf" style="color: #003B4F;
background-color: null;
font-weight: bold;
font-style: inherit;">return</span> <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"&amp;check;"</span> <span class="cf" style="color: #003B4F;
background-color: null;
font-weight: bold;
font-style: inherit;">if</span> b <span class="cf" style="color: #003B4F;
background-color: null;
font-weight: bold;
font-style: inherit;">else</span> <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">""</span></span>
<span id="cb7-18"></span>
<span id="cb7-19"></span>
<span id="cb7-20">transit_table <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> (</span>
<span id="cb7-21">    GT(stop_times)</span>
<span id="cb7-22"></span>
<span id="cb7-23">    <span class="co" style="color: #5E5E5E;
background-color: null;
font-style: inherit;"># Create left-hand stub, top header, and hide extra cols --------</span></span>
<span id="cb7-24">    .tab_stub(groupname_col<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"direction"</span>)</span>
<span id="cb7-25">    .tab_header(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Saturdays, Sundays, and Major Holidays"</span>)</span>
<span id="cb7-26">    .cols_hide(</span>
<span id="cb7-27">        columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>[<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"stop_url"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"zone_id"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"stop_desc"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"stop_lat"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"stop_lon"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"stop_id"</span>]</span>
<span id="cb7-28">    )</span>
<span id="cb7-29"></span>
<span id="cb7-30">    <span class="co" style="color: #5E5E5E;
background-color: null;
font-style: inherit;"># custom functions for checkmarks and time formatting -----------</span></span>
<span id="cb7-31">    .fmt(h_m_p, columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>cs.matches(<span class="vs" style="color: #20794D;
background-color: null;
font-style: inherit;">r"</span><span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">^</span><span class="pp" style="color: #AD0000;
background-color: null;
font-style: inherit;">[0-9]</span><span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">{4}</span><span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">$</span><span class="vs" style="color: #20794D;
background-color: null;
font-style: inherit;">"</span>))</span>
<span id="cb7-32">    .fmt(tick, columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>cs.starts_with(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"service_"</span>))</span>
<span id="cb7-33"></span>
<span id="cb7-34">    <span class="co" style="color: #5E5E5E;
background-color: null;
font-style: inherit;"># relabel columns and add spanners (labels over columns) --------</span></span>
<span id="cb7-35">    .cols_label(</span>
<span id="cb7-36">        stop_name<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Stations"</span>,</span>
<span id="cb7-37">        service_access<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"A"</span>,</span>
<span id="cb7-38">        service_cash<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"C"</span>,</span>
<span id="cb7-39">        service_park<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"P"</span>,</span>
<span id="cb7-40">        fare_zone<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>html(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Fare&lt;br&gt;Zone"</span>),</span>
<span id="cb7-41">    )</span>
<span id="cb7-42">    .tab_spanner(label<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Services"</span>, columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>cs.starts_with(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"service_"</span>))</span>
<span id="cb7-43">    .tab_spanner(label<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Train Number"</span>, columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>cs.matches(<span class="vs" style="color: #20794D;
background-color: null;
font-style: inherit;">r"</span><span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">^</span><span class="pp" style="color: #AD0000;
background-color: null;
font-style: inherit;">[0-9]</span><span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">{4}</span><span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">$</span><span class="vs" style="color: #20794D;
background-color: null;
font-style: inherit;">"</span>))</span>
<span id="cb7-44"></span>
<span id="cb7-45">    <span class="co" style="color: #5E5E5E;
background-color: null;
font-style: inherit;"># move columns around and setting their width and alignment -----</span></span>
<span id="cb7-46">    .cols_move_to_start(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"fare_zone"</span>)</span>
<span id="cb7-47">    .cols_move_to_start(cs.starts_with(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"service_"</span>))</span>
<span id="cb7-48">    .cols_width(</span>
<span id="cb7-49">        cases<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>{c: <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"18px"</span> <span class="cf" style="color: #003B4F;
background-color: null;
font-weight: bold;
font-style: inherit;">for</span> c <span class="kw" style="color: #003B4F;
background-color: null;
font-weight: bold;
font-style: inherit;">in</span> stop_times.columns <span class="cf" style="color: #003B4F;
background-color: null;
font-weight: bold;
font-style: inherit;">if</span> c.startswith(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"service_"</span>)}</span>
<span id="cb7-50">    )</span>
<span id="cb7-51">    .cols_width(cases<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>{c: <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"60px"</span> <span class="cf" style="color: #003B4F;
background-color: null;
font-weight: bold;
font-style: inherit;">for</span> c <span class="kw" style="color: #003B4F;
background-color: null;
font-weight: bold;
font-style: inherit;">in</span> stop_times.columns <span class="cf" style="color: #003B4F;
background-color: null;
font-weight: bold;
font-style: inherit;">if</span> c.startswith(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"8"</span>)})</span>
<span id="cb7-52">    .cols_align(align<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"center"</span>, columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"fare_zone"</span>)</span>
<span id="cb7-53">    .cols_align(align<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"right"</span>, columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>cs.matches(<span class="vs" style="color: #20794D;
background-color: null;
font-style: inherit;">r"</span><span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">^</span><span class="pp" style="color: #AD0000;
background-color: null;
font-style: inherit;">[0-9]</span><span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">{4}</span><span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">$</span><span class="vs" style="color: #20794D;
background-color: null;
font-style: inherit;">"</span>))</span>
<span id="cb7-54"></span>
<span id="cb7-55">    <span class="co" style="color: #5E5E5E;
background-color: null;
font-style: inherit;"># styles: striping, vertical text, background colors, fonts -----</span></span>
<span id="cb7-56">    <span class="co" style="color: #5E5E5E;
background-color: null;
font-style: inherit;"># style header</span></span>
<span id="cb7-57">    .tab_style(</span>
<span id="cb7-58">        locations<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>loc.header(),</span>
<span id="cb7-59">        style<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>style.css(</span>
<span id="cb7-60">            <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"background-color: rgb(66, 99, 128) !important; color: white !important; font-size: 24px !important; font-weight: bold !important; border-width: 0px !important;"</span>,</span>
<span id="cb7-61">        ),</span>
<span id="cb7-62">    )</span>
<span id="cb7-63">    <span class="co" style="color: #5E5E5E;
background-color: null;
font-style: inherit;"># style vertical text on left</span></span>
<span id="cb7-64">    .tab_style(</span>
<span id="cb7-65">        locations<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>loc.row_groups(),</span>
<span id="cb7-66">        style<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>style.css(</span>
<span id="cb7-67">            <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"writing-mode: sideways-lr; padding-bottom: 25% !important; font-size: 24px !important; font-weight: bold !important; text-transform: uppercase !important;"</span></span>
<span id="cb7-68">        ),</span>
<span id="cb7-69">    )</span>
<span id="cb7-70">    .tab_style(</span>
<span id="cb7-71">        style<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>style.css(</span>
<span id="cb7-72">            <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"background-color: black !important; color: white !important; border-top: none !important; border-bottom: none !important;"</span></span>
<span id="cb7-73">        ),</span>
<span id="cb7-74">        locations<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>loc.body(columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="va" style="color: #111111;
background-color: null;
font-style: inherit;">None</span>, rows<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="bu" style="color: null;
background-color: null;
font-style: inherit;">list</span>(<span class="bu" style="color: null;
background-color: null;
font-style: inherit;">range</span>(<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">-</span><span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">4</span>, <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">-</span><span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">1</span>))),</span>
<span id="cb7-75">    )</span>
<span id="cb7-76">    .tab_style(</span>
<span id="cb7-77">        style<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>style.css(</span>
<span id="cb7-78">            <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"""</span></span>
<span id="cb7-79"><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">                border-top: none !important;</span></span>
<span id="cb7-80"><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">                border-bottom: none !important;</span></span>
<span id="cb7-81"><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">                border-right: solid white 2px !important;</span></span>
<span id="cb7-82"><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">                color: white !important;</span></span>
<span id="cb7-83"><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">            """</span></span>
<span id="cb7-84">        ),</span>
<span id="cb7-85">        locations<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>loc.body(</span>
<span id="cb7-86">            columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=~</span>cs.matches(<span class="vs" style="color: #20794D;
background-color: null;
font-style: inherit;">r"</span><span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">^</span><span class="pp" style="color: #AD0000;
background-color: null;
font-style: inherit;">[0-9]</span><span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">{4}</span><span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">$</span><span class="vs" style="color: #20794D;
background-color: null;
font-style: inherit;">"</span>), rows<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="bu" style="color: null;
background-color: null;
font-style: inherit;">list</span>(<span class="bu" style="color: null;
background-color: null;
font-style: inherit;">range</span>(<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">-</span><span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">4</span>, <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">-</span><span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">1</span>))</span>
<span id="cb7-87">        ),</span>
<span id="cb7-88">    )</span>
<span id="cb7-89">    .tab_style(</span>
<span id="cb7-90">        style<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>style.css(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"border-right: solid black 2px !important;"</span>),</span>
<span id="cb7-91">        locations<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>loc.body(</span>
<span id="cb7-92">            columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=~</span>cs.matches(<span class="vs" style="color: #20794D;
background-color: null;
font-style: inherit;">r"</span><span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">^</span><span class="pp" style="color: #AD0000;
background-color: null;
font-style: inherit;">[0-9]</span><span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">{4}</span><span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">$</span><span class="vs" style="color: #20794D;
background-color: null;
font-style: inherit;">"</span>), rows<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="bu" style="color: null;
background-color: null;
font-style: inherit;">list</span>(<span class="bu" style="color: null;
background-color: null;
font-style: inherit;">range</span>(<span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">0</span>, <span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">10</span>)) <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">+</span> [<span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">13</span>]</span>
<span id="cb7-93">        ),</span>
<span id="cb7-94">    )</span>
<span id="cb7-95">    .tab_options(</span>
<span id="cb7-96">        row_striping_background_color<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"#A9A9A9"</span>,</span>
<span id="cb7-97">        row_group_as_column<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="va" style="color: #111111;
background-color: null;
font-style: inherit;">True</span>,</span>
<span id="cb7-98">    )</span>
<span id="cb7-99">    .opt_row_striping(row_striping<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="va" style="color: #111111;
background-color: null;
font-style: inherit;">True</span>)</span>
<span id="cb7-100">    .opt_table_outline()</span>
<span id="cb7-101">    .opt_table_font(font<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>google_font(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"IBM Plex Sans"</span>))</span>
<span id="cb7-102">)</span>
<span id="cb7-103"></span>
<span id="cb7-104">transit_table</span></code></pre></div></div>
<div class="cell-output cell-output-display" data-execution_count="6">
<div id="rkwvectetm" style="padding-left:0px;padding-right:0px;padding-top:10px;padding-bottom:10px;overflow-x:auto;overflow-y:auto;width:auto;height:auto;">
<style>
@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans&display=swap');
#rkwvectetm table {
          font-family: 'IBM Plex Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Helvetica Neue', 'Fira Sans', 'Droid Sans', Arial, sans-serif;
          -webkit-font-smoothing: antialiased;
          -moz-osx-font-smoothing: grayscale;
        }

#rkwvectetm thead, tbody, tfoot, tr, td, th { border-style: none; }
 tr { background-color: transparent; }
#rkwvectetm p { margin: 0; padding: 0; }
 #rkwvectetm .gt_table { display: table; border-collapse: collapse; line-height: normal; margin-left: auto; margin-right: auto; color: #333333; font-size: 16px; font-weight: normal; font-style: normal; background-color: #FFFFFF; width: auto; border-top-style: solid; border-top-width: 3px; border-top-color: #D3D3D3; border-right-style: solid; border-right-width: 3px; border-right-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 3px; border-bottom-color: #D3D3D3; border-left-style: solid; border-left-width: 3px; border-left-color: #D3D3D3; }
 #rkwvectetm .gt_caption { padding-top: 4px; padding-bottom: 4px; }
 #rkwvectetm .gt_title { color: #333333; font-size: 125%; font-weight: initial; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; border-bottom-color: #FFFFFF; border-bottom-width: 0; }
 #rkwvectetm .gt_subtitle { color: #333333; font-size: 85%; font-weight: initial; padding-top: 3px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; border-top-color: #FFFFFF; border-top-width: 0; }
 #rkwvectetm .gt_heading { background-color: #FFFFFF; text-align: center; border-bottom-color: #FFFFFF; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #rkwvectetm .gt_bottom_border { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #rkwvectetm .gt_col_headings { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #rkwvectetm .gt_col_heading { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; overflow-x: hidden; }
 #rkwvectetm .gt_column_spanner_outer { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; padding-top: 0; padding-bottom: 0; padding-left: 4px; padding-right: 4px; }
 #rkwvectetm .gt_column_spanner_outer:first-child { padding-left: 0; }
 #rkwvectetm .gt_column_spanner_outer:last-child { padding-right: 0; }
 #rkwvectetm .gt_column_spanner { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; overflow-x: hidden; display: inline-block; width: 100%; }
 #rkwvectetm .gt_spanner_row { border-bottom-style: hidden; }
 #rkwvectetm .gt_group_heading { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; text-align: left; }
 #rkwvectetm .gt_empty_group_heading { padding: 0.5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: middle; }
 #rkwvectetm .gt_from_md> :first-child { margin-top: 0; }
 #rkwvectetm .gt_from_md> :last-child { margin-bottom: 0; }
 #rkwvectetm .gt_row { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; margin: 10px; border-top-style: solid; border-top-width: 1px; border-top-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; overflow-x: hidden; }
 #rkwvectetm .gt_stub { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; }
 #rkwvectetm .gt_stub_row_group { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; vertical-align: top; }
 #rkwvectetm .gt_row_group_first td { border-top-width: 2px; }
 #rkwvectetm .gt_row_group_first th { border-top-width: 2px; }
 #rkwvectetm .gt_striped { color: #333333; background-color: #A9A9A9; }
 #rkwvectetm .gt_table_body { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #rkwvectetm .gt_grand_summary_row { color: #333333; background-color: #FFFFFF; text-transform: inherit; padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; }
 #rkwvectetm .gt_first_grand_summary_row_bottom { border-top-style: double; border-top-width: 6px; border-top-color: #D3D3D3; }
 #rkwvectetm .gt_last_grand_summary_row_top { border-bottom-style: double; border-bottom-width: 6px; border-bottom-color: #D3D3D3; }
 #rkwvectetm .gt_sourcenotes { color: #333333; background-color: #FFFFFF; border-bottom-style: none; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; }
 #rkwvectetm .gt_sourcenote { font-size: 90%; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; text-align: left; }
 #rkwvectetm .gt_left { text-align: left; }
 #rkwvectetm .gt_center { text-align: center; }
 #rkwvectetm .gt_right { text-align: right; font-variant-numeric: tabular-nums; }
 #rkwvectetm .gt_font_normal { font-weight: normal; }
 #rkwvectetm .gt_font_bold { font-weight: bold; }
 #rkwvectetm .gt_font_italic { font-style: italic; }
 #rkwvectetm .gt_super { font-size: 65%; }
 #rkwvectetm .gt_footnote_marks { font-size: 75%; vertical-align: 0.4em; position: initial; }
 #rkwvectetm .gt_asterisk { font-size: 100%; vertical-align: 0; }
 
</style>
<table style="table-layout: fixed;" class="gt_table" data-quarto-disable-processing="false" data-quarto-bootstrap="false">
<colgroup>
  <col>
  <col style="width:18px;">
  <col style="width:18px;">
  <col style="width:18px;">
  <col>
  <col>
  <col style="width:60px;">
  <col style="width:60px;">
  <col style="width:60px;">
  <col style="width:60px;">
  <col style="width:60px;">
  <col style="width:60px;">
  <col style="width:60px;">
  <col style="width:60px;">
</colgroup>

<thead>

  <tr class="gt_heading">
    <td colspan="14" class="gt_heading gt_title gt_font_normal" style="background-color: rgb(66, 99, 128) !important; color: white !important; font-size: 24px !important; font-weight: bold !important; border-width: 0px !important;">Saturdays, Sundays, and Major Holidays</td>
  </tr>
<tr class="gt_col_headings gt_spanner_row">
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="2" colspan="1" scope="col" id=""></th>
  <th class="gt_center gt_columns_top_border gt_column_spanner_outer" rowspan="1" colspan="3" scope="colgroup" id="Services">
    <span class="gt_column_spanner">Services</span>
  </th>
  <th class="gt_col_heading gt_columns_bottom_border gt_center" rowspan="2" colspan="1" scope="col" id="fare_zone">Fare<br>Zone</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="2" colspan="1" scope="col" id="stop_name">Stations</th>
  <th class="gt_center gt_columns_top_border gt_column_spanner_outer" rowspan="1" colspan="8" scope="colgroup" id="Train-Number">
    <span class="gt_column_spanner">Train Number</span>
  </th>
</tr>
<tr class="gt_col_headings">
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="service_access">A</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="service_cash">C</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="service_park">P</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="8210">8210</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="8716">8716</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="8318">8318</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="8322">8322</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="8338">8338</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="8242">8242</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="8750">8750</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="8756">8756</th>
</tr>
</thead>
<tbody class="gt_table_body">
  <tr>
  <th style="writing-mode: sideways-lr; padding-bottom: 25% !important; font-size: 24px !important; font-weight: bold !important; text-transform: uppercase !important;" class="gt_row gt_left gt_stub_row_group" rowspan="14">To Center City</th>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_right"></td>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_right"></td>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_right">✓</td>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_center">2</td>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_left">Chestnut Hill West</td>
    <td class="gt_row gt_right">6:51a</td>
    <td class="gt_row gt_right">8:08a</td>
    <td class="gt_row gt_right">8:49a</td>
    <td class="gt_row gt_right">9:49a</td>
    <td class="gt_row gt_right">1:52p</td>
    <td class="gt_row gt_right">2:49p</td>
    <td class="gt_row gt_right">4:48p</td>
    <td class="gt_row gt_right">6:20p</td>
  </tr>
  <tr>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_right gt_striped"></td>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_right gt_striped"></td>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_right gt_striped">✓</td>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_center gt_striped">2</td>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_left gt_striped">Highland</td>
    <td class="gt_row gt_right gt_striped">6:52a</td>
    <td class="gt_row gt_right gt_striped">8:09a</td>
    <td class="gt_row gt_right gt_striped">8:50a</td>
    <td class="gt_row gt_right gt_striped">9:50a</td>
    <td class="gt_row gt_right gt_striped">1:53p</td>
    <td class="gt_row gt_right gt_striped">2:50p</td>
    <td class="gt_row gt_right gt_striped">4:49p</td>
    <td class="gt_row gt_right gt_striped">6:21p</td>
  </tr>
  <tr>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_right"></td>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_right"></td>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_right">✓</td>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_center">1</td>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_left">St. Martins</td>
    <td class="gt_row gt_right">6:54a</td>
    <td class="gt_row gt_right">8:11a</td>
    <td class="gt_row gt_right">8:52a</td>
    <td class="gt_row gt_right">9:52a</td>
    <td class="gt_row gt_right">1:55p</td>
    <td class="gt_row gt_right">2:52p</td>
    <td class="gt_row gt_right">4:51p</td>
    <td class="gt_row gt_right">6:23p</td>
  </tr>
  <tr>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_right gt_striped"></td>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_right gt_striped"></td>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_right gt_striped">✓</td>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_center gt_striped">1</td>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_left gt_striped">Richard Allen Lane</td>
    <td class="gt_row gt_right gt_striped">6:56a</td>
    <td class="gt_row gt_right gt_striped">8:13a</td>
    <td class="gt_row gt_right gt_striped">8:54a</td>
    <td class="gt_row gt_right gt_striped">9:54a</td>
    <td class="gt_row gt_right gt_striped">1:57p</td>
    <td class="gt_row gt_right gt_striped">2:54p</td>
    <td class="gt_row gt_right gt_striped">4:53p</td>
    <td class="gt_row gt_right gt_striped">6:25p</td>
  </tr>
  <tr>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_right">✓</td>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_right"></td>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_right">✓</td>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_center">1</td>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_left">Carpenter</td>
    <td class="gt_row gt_right">6:58a</td>
    <td class="gt_row gt_right">8:15a</td>
    <td class="gt_row gt_right">8:56a</td>
    <td class="gt_row gt_right">9:56a</td>
    <td class="gt_row gt_right">1:59p</td>
    <td class="gt_row gt_right">2:56p</td>
    <td class="gt_row gt_right">4:55p</td>
    <td class="gt_row gt_right">6:27p</td>
  </tr>
  <tr>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_right gt_striped"></td>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_right gt_striped"></td>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_right gt_striped"></td>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_center gt_striped">1</td>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_left gt_striped">Upsal</td>
    <td class="gt_row gt_right gt_striped">7:00a</td>
    <td class="gt_row gt_right gt_striped">8:17a</td>
    <td class="gt_row gt_right gt_striped">8:58a</td>
    <td class="gt_row gt_right gt_striped">9:58a</td>
    <td class="gt_row gt_right gt_striped">2:01p</td>
    <td class="gt_row gt_right gt_striped">2:58p</td>
    <td class="gt_row gt_right gt_striped">4:57p</td>
    <td class="gt_row gt_right gt_striped">6:29p</td>
  </tr>
  <tr>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_right">✓</td>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_right">✓</td>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_right"></td>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_center">C</td>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_left">Tulpehocken</td>
    <td class="gt_row gt_right">7:02a</td>
    <td class="gt_row gt_right">8:19a</td>
    <td class="gt_row gt_right">9:00a</td>
    <td class="gt_row gt_right">10:00a</td>
    <td class="gt_row gt_right">2:03p</td>
    <td class="gt_row gt_right">3:00p</td>
    <td class="gt_row gt_right">4:59p</td>
    <td class="gt_row gt_right">6:31p</td>
  </tr>
  <tr>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_right gt_striped">✓</td>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_right gt_striped">✓</td>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_right gt_striped"></td>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_center gt_striped">C</td>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_left gt_striped">Chelten Avenue</td>
    <td class="gt_row gt_right gt_striped">7:04a</td>
    <td class="gt_row gt_right gt_striped">8:21a</td>
    <td class="gt_row gt_right gt_striped">9:02a</td>
    <td class="gt_row gt_right gt_striped">10:02a</td>
    <td class="gt_row gt_right gt_striped">2:05p</td>
    <td class="gt_row gt_right gt_striped">3:02p</td>
    <td class="gt_row gt_right gt_striped">5:01p</td>
    <td class="gt_row gt_right gt_striped">6:33p</td>
  </tr>
  <tr>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_right">✓</td>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_right">✓</td>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_right"></td>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_center">C</td>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_left">Queen Lane</td>
    <td class="gt_row gt_right">7:06a</td>
    <td class="gt_row gt_right">8:23a</td>
    <td class="gt_row gt_right">9:04a</td>
    <td class="gt_row gt_right">10:04a</td>
    <td class="gt_row gt_right">2:07p</td>
    <td class="gt_row gt_right">3:04p</td>
    <td class="gt_row gt_right">5:03p</td>
    <td class="gt_row gt_right">6:35p</td>
  </tr>
  <tr>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_right gt_striped">✓</td>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_right gt_striped"></td>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_right gt_striped"></td>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_center gt_striped">C</td>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_left gt_striped">North Philadelphia</td>
    <td class="gt_row gt_right gt_striped">7:12a</td>
    <td class="gt_row gt_right gt_striped">8:29a</td>
    <td class="gt_row gt_right gt_striped">9:12a</td>
    <td class="gt_row gt_right gt_striped">10:12a</td>
    <td class="gt_row gt_right gt_striped">2:15p</td>
    <td class="gt_row gt_right gt_striped">3:12p</td>
    <td class="gt_row gt_right gt_striped">5:09p</td>
    <td class="gt_row gt_right gt_striped">6:41p</td>
  </tr>
  <tr>
    <td style="background-color: black !important; color: white !important; border-top: none !important; border-bottom: none !important; 
                border-top: none !important;
                border-bottom: none !important;
                border-right: solid white 2px !important;
                color: white !important;
            " class="gt_row gt_right">✓</td>
    <td style="background-color: black !important; color: white !important; border-top: none !important; border-bottom: none !important; 
                border-top: none !important;
                border-bottom: none !important;
                border-right: solid white 2px !important;
                color: white !important;
            " class="gt_row gt_right"></td>
    <td style="background-color: black !important; color: white !important; border-top: none !important; border-bottom: none !important; 
                border-top: none !important;
                border-bottom: none !important;
                border-right: solid white 2px !important;
                color: white !important;
            " class="gt_row gt_right">✓</td>
    <td style="background-color: black !important; color: white !important; border-top: none !important; border-bottom: none !important; 
                border-top: none !important;
                border-bottom: none !important;
                border-right: solid white 2px !important;
                color: white !important;
            " class="gt_row gt_center">2</td>
    <td style="background-color: black !important; color: white !important; border-top: none !important; border-bottom: none !important; 
                border-top: none !important;
                border-bottom: none !important;
                border-right: solid white 2px !important;
                color: white !important;
            " class="gt_row gt_left">Gray 30th Street</td>
    <td style="background-color: black !important; color: white !important; border-top: none !important; border-bottom: none !important;" class="gt_row gt_right">7:23a</td>
    <td style="background-color: black !important; color: white !important; border-top: none !important; border-bottom: none !important;" class="gt_row gt_right">8:42a</td>
    <td style="background-color: black !important; color: white !important; border-top: none !important; border-bottom: none !important;" class="gt_row gt_right">9:23a</td>
    <td style="background-color: black !important; color: white !important; border-top: none !important; border-bottom: none !important;" class="gt_row gt_right">10:23a</td>
    <td style="background-color: black !important; color: white !important; border-top: none !important; border-bottom: none !important;" class="gt_row gt_right">2:26p</td>
    <td style="background-color: black !important; color: white !important; border-top: none !important; border-bottom: none !important;" class="gt_row gt_right">3:23p</td>
    <td style="background-color: black !important; color: white !important; border-top: none !important; border-bottom: none !important;" class="gt_row gt_right">5:20p</td>
    <td style="background-color: black !important; color: white !important; border-top: none !important; border-bottom: none !important;" class="gt_row gt_right">6:54p</td>
  </tr>
  <tr>
    <td style="background-color: black !important; color: white !important; border-top: none !important; border-bottom: none !important; 
                border-top: none !important;
                border-bottom: none !important;
                border-right: solid white 2px !important;
                color: white !important;
            " class="gt_row gt_right gt_striped"></td>
    <td style="background-color: black !important; color: white !important; border-top: none !important; border-bottom: none !important; 
                border-top: none !important;
                border-bottom: none !important;
                border-right: solid white 2px !important;
                color: white !important;
            " class="gt_row gt_right gt_striped"></td>
    <td style="background-color: black !important; color: white !important; border-top: none !important; border-bottom: none !important; 
                border-top: none !important;
                border-bottom: none !important;
                border-right: solid white 2px !important;
                color: white !important;
            " class="gt_row gt_right gt_striped">✓</td>
    <td style="background-color: black !important; color: white !important; border-top: none !important; border-bottom: none !important; 
                border-top: none !important;
                border-bottom: none !important;
                border-right: solid white 2px !important;
                color: white !important;
            " class="gt_row gt_center gt_striped">2</td>
    <td style="background-color: black !important; color: white !important; border-top: none !important; border-bottom: none !important; 
                border-top: none !important;
                border-bottom: none !important;
                border-right: solid white 2px !important;
                color: white !important;
            " class="gt_row gt_left gt_striped">Suburban Station</td>
    <td style="background-color: black !important; color: white !important; border-top: none !important; border-bottom: none !important;" class="gt_row gt_right gt_striped">7:28a</td>
    <td style="background-color: black !important; color: white !important; border-top: none !important; border-bottom: none !important;" class="gt_row gt_right gt_striped">8:47a</td>
    <td style="background-color: black !important; color: white !important; border-top: none !important; border-bottom: none !important;" class="gt_row gt_right gt_striped">9:28a</td>
    <td style="background-color: black !important; color: white !important; border-top: none !important; border-bottom: none !important;" class="gt_row gt_right gt_striped">10:28a</td>
    <td style="background-color: black !important; color: white !important; border-top: none !important; border-bottom: none !important;" class="gt_row gt_right gt_striped">2:31p</td>
    <td style="background-color: black !important; color: white !important; border-top: none !important; border-bottom: none !important;" class="gt_row gt_right gt_striped">3:28p</td>
    <td style="background-color: black !important; color: white !important; border-top: none !important; border-bottom: none !important;" class="gt_row gt_right gt_striped">5:25p</td>
    <td style="background-color: black !important; color: white !important; border-top: none !important; border-bottom: none !important;" class="gt_row gt_right gt_striped">6:59p</td>
  </tr>
  <tr>
    <td style="background-color: black !important; color: white !important; border-top: none !important; border-bottom: none !important; 
                border-top: none !important;
                border-bottom: none !important;
                border-right: solid white 2px !important;
                color: white !important;
            " class="gt_row gt_right"></td>
    <td style="background-color: black !important; color: white !important; border-top: none !important; border-bottom: none !important; 
                border-top: none !important;
                border-bottom: none !important;
                border-right: solid white 2px !important;
                color: white !important;
            " class="gt_row gt_right"></td>
    <td style="background-color: black !important; color: white !important; border-top: none !important; border-bottom: none !important; 
                border-top: none !important;
                border-bottom: none !important;
                border-right: solid white 2px !important;
                color: white !important;
            " class="gt_row gt_right">✓</td>
    <td style="background-color: black !important; color: white !important; border-top: none !important; border-bottom: none !important; 
                border-top: none !important;
                border-bottom: none !important;
                border-right: solid white 2px !important;
                color: white !important;
            " class="gt_row gt_center">2</td>
    <td style="background-color: black !important; color: white !important; border-top: none !important; border-bottom: none !important; 
                border-top: none !important;
                border-bottom: none !important;
                border-right: solid white 2px !important;
                color: white !important;
            " class="gt_row gt_left">Jefferson Station</td>
    <td style="background-color: black !important; color: white !important; border-top: none !important; border-bottom: none !important;" class="gt_row gt_right">7:33a</td>
    <td style="background-color: black !important; color: white !important; border-top: none !important; border-bottom: none !important;" class="gt_row gt_right">8:52a</td>
    <td style="background-color: black !important; color: white !important; border-top: none !important; border-bottom: none !important;" class="gt_row gt_right">9:33a</td>
    <td style="background-color: black !important; color: white !important; border-top: none !important; border-bottom: none !important;" class="gt_row gt_right">10:33a</td>
    <td style="background-color: black !important; color: white !important; border-top: none !important; border-bottom: none !important;" class="gt_row gt_right">2:36p</td>
    <td style="background-color: black !important; color: white !important; border-top: none !important; border-bottom: none !important;" class="gt_row gt_right">3:33p</td>
    <td style="background-color: black !important; color: white !important; border-top: none !important; border-bottom: none !important;" class="gt_row gt_right">5:30p</td>
    <td style="background-color: black !important; color: white !important; border-top: none !important; border-bottom: none !important;" class="gt_row gt_right">7:04p</td>
  </tr>
  <tr>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_right gt_striped">✓</td>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_right gt_striped"></td>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_right gt_striped">✓</td>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_center gt_striped">2</td>
    <td style="border-right: solid black 2px !important;" class="gt_row gt_left gt_striped">Temple University</td>
    <td class="gt_row gt_right gt_striped">7:37a</td>
    <td class="gt_row gt_right gt_striped">8:57a</td>
    <td class="gt_row gt_right gt_striped">9:37a</td>
    <td class="gt_row gt_right gt_striped">10:37a</td>
    <td class="gt_row gt_right gt_striped">2:40p</td>
    <td class="gt_row gt_right gt_striped">3:37p</td>
    <td class="gt_row gt_right gt_striped">5:35p</td>
    <td class="gt_row gt_right gt_striped">7:08p</td>
  </tr>
</tbody>


</table>

</div>
</div>
</div>
</section>
<section id="other-schedules-in-the-wild" class="level2">
<h2 class="anchored" data-anchor-id="other-schedules-in-the-wild">Other schedules in the wild</h2>
<p>MetroTransit in Minneapolis uses a transposed format, with stops as columns and trips as rows. Here’s an example from their <a href="https://www.metrotransit.org/route/2">Route 2 bus timetable</a>:</p>
<p><img src="https://posit-dev.github.io/great-tables/blog/septa-timetables/metrotransit-route2.png" class="img-fluid" style="max-width: 600px; display: block; margin-left: auto; margin-right: auto;"></p>
<p>This is useful when there a lot of trips, because with trips on the rows readers can scroll down (versus needing to scroll sideways).</p>
<p>The MTA in New York City is similar. Here’s an example of their <a href="https://www.mta.info/schedules/bus/bx1">bx1 bus route timetable</a>:</p>
<p><img src="https://posit-dev.github.io/great-tables/blog/septa-timetables/mta-route-bx1.png" class="img-fluid" style="max-width: 600px; display: block; margin-left: auto; margin-right: auto;"></p>
<p>What I like about all these tables is they highlight the structure behind bus and train routes. Sometimes they skip certain stops. But realistically, what makes them a route is that trips tend to make the same stops over and over.</p>
<p>A common alternative to using these tables is to do routing from a set start to end point. For example, below is a form for selecting a start and end point on SEPTA’s website, with a resulting table of departure and arrival times.</p>
<p><img src="https://posit-dev.github.io/great-tables/blog/septa-timetables/septa-routing.png" class="img-fluid" style="max-width: 600px; display: block; margin-left: auto; margin-right: auto;"></p>
<p>Notice that the table has removed a lot of information about intermediate stops people might not care about.</p>
</section>
<section id="in-conclusion" class="level2">
<h2 class="anchored" data-anchor-id="in-conclusion">In conclusion</h2>
<p>Transit tables are richly structured displays of information. They take advantage often of the fact that a train route like Chesnut Hill West is a fixed set of stops–so that stops can be on the rows, and arrival times for trips throughout the day can be on the columns.</p>
<p>This is intuitive to people reading transit timetables, but can get tricky to display on the web. Timetables are a core part of navigating transit networks, so it was a fun experiment to try replicating one of Septa’s timetables in Great Tables!</p>


</section>

 ]]></description>
  <guid>https://posit-dev.github.io/great-tables/blog/septa-timetables/</guid>
  <pubDate>Thu, 12 Mar 2026 00:00:00 GMT</pubDate>
</item>
<item>
  <title>Great Tables v0.18.0: Easy Column Spanners and More!</title>
  <dc:creator>Rich Iannone</dc:creator>
  <link>https://posit-dev.github.io/great-tables/blog/introduction-0.18.0/</link>
  <description><![CDATA[ 




<p>The development of Great Tables continues! We’re excited to announce the release of <code>v0.18.0</code>, which brings several powerful new features. These features make it even easier to create beautiful, informative tables. The key additions in this release include new methods (and a tweak to an existing one):</p>
<ul>
<li><a href="../../reference/GT.tab_spanner_delim.html#great_tables.GT.tab_spanner_delim" title="0"><code>.tab_spanner_delim()</code></a>: quick spanner creation</li>
<li><a href="../../reference/GT.fmt_tf.html#great_tables.GT.fmt_tf" title="0"><code>.fmt_tf()</code></a>: easy boolean value formatting</li>
<li><a href="../../reference/GT.cols_label_rotate.html#great_tables.GT.cols_label_rotate" title="0"><code>.cols_label_rotate()</code></a>: enables column label rotation</li>
<li><a href="../../reference/GT.fmt_datetime.html#great_tables.GT.fmt_datetime" title="0"><code>.fmt_datetime()</code></a>: added <code>format_str=</code> parameter for extra customization</li>
</ul>
<p>Let’s explore each of these interesting new features!</p>
<section id="quick-spanner-creation-with-tab_spanner_delim" class="level3">
<h3 class="anchored" data-anchor-id="quick-spanner-creation-with-tab_spanner_delim">Quick spanner creation with <code>tab_spanner_delim()</code></h3>
<p>Working with data that has hierarchical column names can be tedious when manually creating spanners. The new <a href="../../reference/GT.tab_spanner_delim.html#great_tables.GT.tab_spanner_delim" title="0"><code>.tab_spanner_delim()</code></a> method automates this process by intelligently splitting column names based on a delimiter and creating the appropriate spanner structure.</p>
<p>Here’s a practical example using the <code>towny</code> dataset, which contains population data for a collection of municipalities across multiple census years. Let’s start by looking at the most populated cities and examining their column structure:</p>
<div id="2d20e17a" class="cell" data-execution_count="1">
<div class="code-copy-outer-scaffold"><div class="sourceCode cell-code" id="cb1" style="background: #f1f3f5;"><pre class="sourceCode python code-with-copy"><code class="sourceCode python"><span id="cb1-1"><span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">from</span> great_tables <span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">import</span> GT</span>
<span id="cb1-2"><span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">from</span> great_tables.data <span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">import</span> towny</span>
<span id="cb1-3"><span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">import</span> polars <span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">as</span> pl</span>
<span id="cb1-4"><span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">import</span> polars.selectors <span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">as</span> cs</span>
<span id="cb1-5"></span>
<span id="cb1-6"><span class="co" style="color: #5E5E5E;
background-color: null;
font-style: inherit;"># Create a smaller version of the `towny` dataset</span></span>
<span id="cb1-7">towny_mini <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> (</span>
<span id="cb1-8">    pl.from_pandas(towny)</span>
<span id="cb1-9">    .<span class="bu" style="color: null;
background-color: null;
font-style: inherit;">filter</span>(pl.col(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"csd_type"</span>) <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">==</span> <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"city"</span>)</span>
<span id="cb1-10">    .sort(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"population_2021"</span>, descending<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="va" style="color: #111111;
background-color: null;
font-style: inherit;">True</span>)</span>
<span id="cb1-11">    .select(</span>
<span id="cb1-12">        <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"name"</span>,</span>
<span id="cb1-13">        cs.starts_with(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"population_"</span>),</span>
<span id="cb1-14">        cs.starts_with(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"density_"</span>)</span>
<span id="cb1-15">    )</span>
<span id="cb1-16">    .head(<span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">5</span>)</span>
<span id="cb1-17">)</span>
<span id="cb1-18"></span>
<span id="cb1-19"><span class="co" style="color: #5E5E5E;
background-color: null;
font-style: inherit;"># Let's look at the column names</span></span>
<span id="cb1-20"><span class="bu" style="color: null;
background-color: null;
font-style: inherit;">print</span>(towny_mini.columns)</span></code></pre></div></div>
<div class="cell-output cell-output-stdout">
<pre><code>['name', 'population_1996', 'population_2001', 'population_2006', 'population_2011', 'population_2016', 'population_2021', 'density_1996', 'density_2001', 'density_2006', 'density_2011', 'density_2016', 'density_2021']</code></pre>
</div>
</div>
<p>Notice how the column names have a clear hierarchical structure with underscores as delimiters. Let’s now create a table that takes advantage of this structure:</p>
<div id="2b13ecb4" class="cell" data-execution_count="2">
<div class="code-copy-outer-scaffold"><div class="sourceCode cell-code" id="cb3" style="background: #f1f3f5;"><pre class="sourceCode python code-with-copy"><code class="sourceCode python"><span id="cb3-1">(</span>
<span id="cb3-2">    GT(towny_mini, rowname_col<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"name"</span>)</span>
<span id="cb3-3">    .tab_spanner_delim(delim<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"_"</span>)</span>
<span id="cb3-4">    .fmt_integer(columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>cs.contains(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"population"</span>))</span>
<span id="cb3-5">    .fmt_number(columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>cs.contains(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"density"</span>), decimals<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">1</span>)</span>
<span id="cb3-6">    .tab_header(title<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Population and Density Trends from Census Data"</span>)</span>
<span id="cb3-7">    .opt_align_table_header(align<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"left"</span>)</span>
<span id="cb3-8">)</span></code></pre></div></div>
<div class="cell-output cell-output-display" data-execution_count="2">
<div id="nfycwbbkbg" style="padding-left:0px;padding-right:0px;padding-top:10px;padding-bottom:10px;overflow-x:auto;overflow-y:auto;width:auto;height:auto;">
<style>
#nfycwbbkbg table {
          font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Helvetica Neue', 'Fira Sans', 'Droid Sans', Arial, sans-serif;
          -webkit-font-smoothing: antialiased;
          -moz-osx-font-smoothing: grayscale;
        }

#nfycwbbkbg thead, tbody, tfoot, tr, td, th { border-style: none; }
 tr { background-color: transparent; }
#nfycwbbkbg p { margin: 0; padding: 0; }
 #nfycwbbkbg .gt_table { display: table; border-collapse: collapse; line-height: normal; margin-left: auto; margin-right: auto; color: #333333; font-size: 16px; font-weight: normal; font-style: normal; background-color: #FFFFFF; width: auto; border-top-style: solid; border-top-width: 2px; border-top-color: #A8A8A8; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #A8A8A8; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; }
 #nfycwbbkbg .gt_caption { padding-top: 4px; padding-bottom: 4px; }
 #nfycwbbkbg .gt_title { color: #333333; font-size: 125%; font-weight: initial; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; border-bottom-color: #FFFFFF; border-bottom-width: 0; }
 #nfycwbbkbg .gt_subtitle { color: #333333; font-size: 85%; font-weight: initial; padding-top: 3px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; border-top-color: #FFFFFF; border-top-width: 0; }
 #nfycwbbkbg .gt_heading { background-color: #FFFFFF; text-align: left; border-bottom-color: #FFFFFF; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #nfycwbbkbg .gt_bottom_border { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #nfycwbbkbg .gt_col_headings { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #nfycwbbkbg .gt_col_heading { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; overflow-x: hidden; }
 #nfycwbbkbg .gt_column_spanner_outer { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; padding-top: 0; padding-bottom: 0; padding-left: 4px; padding-right: 4px; }
 #nfycwbbkbg .gt_column_spanner_outer:first-child { padding-left: 0; }
 #nfycwbbkbg .gt_column_spanner_outer:last-child { padding-right: 0; }
 #nfycwbbkbg .gt_column_spanner { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; overflow-x: hidden; display: inline-block; width: 100%; }
 #nfycwbbkbg .gt_spanner_row { border-bottom-style: hidden; }
 #nfycwbbkbg .gt_group_heading { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; text-align: left; }
 #nfycwbbkbg .gt_empty_group_heading { padding: 0.5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: middle; }
 #nfycwbbkbg .gt_from_md> :first-child { margin-top: 0; }
 #nfycwbbkbg .gt_from_md> :last-child { margin-bottom: 0; }
 #nfycwbbkbg .gt_row { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; margin: 10px; border-top-style: solid; border-top-width: 1px; border-top-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; overflow-x: hidden; }
 #nfycwbbkbg .gt_stub { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; }
 #nfycwbbkbg .gt_stub_row_group { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; vertical-align: top; }
 #nfycwbbkbg .gt_row_group_first td { border-top-width: 2px; }
 #nfycwbbkbg .gt_row_group_first th { border-top-width: 2px; }
 #nfycwbbkbg .gt_striped { color: #333333; background-color: #F4F4F4; }
 #nfycwbbkbg .gt_table_body { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #nfycwbbkbg .gt_grand_summary_row { color: #333333; background-color: #FFFFFF; text-transform: inherit; padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; }
 #nfycwbbkbg .gt_first_grand_summary_row_bottom { border-top-style: double; border-top-width: 6px; border-top-color: #D3D3D3; }
 #nfycwbbkbg .gt_last_grand_summary_row_top { border-bottom-style: double; border-bottom-width: 6px; border-bottom-color: #D3D3D3; }
 #nfycwbbkbg .gt_sourcenotes { color: #333333; background-color: #FFFFFF; border-bottom-style: none; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; }
 #nfycwbbkbg .gt_sourcenote { font-size: 90%; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; text-align: left; }
 #nfycwbbkbg .gt_left { text-align: left; }
 #nfycwbbkbg .gt_center { text-align: center; }
 #nfycwbbkbg .gt_right { text-align: right; font-variant-numeric: tabular-nums; }
 #nfycwbbkbg .gt_font_normal { font-weight: normal; }
 #nfycwbbkbg .gt_font_bold { font-weight: bold; }
 #nfycwbbkbg .gt_font_italic { font-style: italic; }
 #nfycwbbkbg .gt_super { font-size: 65%; }
 #nfycwbbkbg .gt_footnote_marks { font-size: 75%; vertical-align: 0.4em; position: initial; }
 #nfycwbbkbg .gt_asterisk { font-size: 100%; vertical-align: 0; }
 
</style>
<table class="gt_table" data-quarto-disable-processing="false" data-quarto-bootstrap="false">
<thead>

  <tr class="gt_heading">
    <td colspan="13" class="gt_heading gt_title gt_font_normal">Population and Density Trends from Census Data</td>
  </tr>
<tr class="gt_col_headings gt_spanner_row">
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="2" colspan="1" scope="col" id=""></th>
  <th class="gt_center gt_columns_top_border gt_column_spanner_outer" rowspan="1" colspan="6" scope="colgroup" id="population">
    <span class="gt_column_spanner">population</span>
  </th>
  <th class="gt_center gt_columns_top_border gt_column_spanner_outer" rowspan="1" colspan="6" scope="colgroup" id="density">
    <span class="gt_column_spanner">density</span>
  </th>
</tr>
<tr class="gt_col_headings">
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="population_1996">1996</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="population_2001">2001</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="population_2006">2006</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="population_2011">2011</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="population_2016">2016</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="population_2021">2021</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="density_1996">1996</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="density_2001">2001</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="density_2006">2006</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="density_2011">2011</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="density_2016">2016</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="density_2021">2021</th>
</tr>
</thead>
<tbody class="gt_table_body">
  <tr>
    <th class="gt_row gt_left gt_stub">Toronto</th>
    <td class="gt_row gt_right">2,385,421</td>
    <td class="gt_row gt_right">2,481,494</td>
    <td class="gt_row gt_right">2,503,281</td>
    <td class="gt_row gt_right">2,615,060</td>
    <td class="gt_row gt_right">2,731,571</td>
    <td class="gt_row gt_right">2,794,356</td>
    <td class="gt_row gt_right">3,779.8</td>
    <td class="gt_row gt_right">3,932.0</td>
    <td class="gt_row gt_right">3,966.5</td>
    <td class="gt_row gt_right">4,143.6</td>
    <td class="gt_row gt_right">4,328.3</td>
    <td class="gt_row gt_right">4,427.8</td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">Ottawa</th>
    <td class="gt_row gt_right">721,136</td>
    <td class="gt_row gt_right">774,072</td>
    <td class="gt_row gt_right">812,129</td>
    <td class="gt_row gt_right">883,391</td>
    <td class="gt_row gt_right">934,243</td>
    <td class="gt_row gt_right">1,017,449</td>
    <td class="gt_row gt_right">258.6</td>
    <td class="gt_row gt_right">277.6</td>
    <td class="gt_row gt_right">291.3</td>
    <td class="gt_row gt_right">316.8</td>
    <td class="gt_row gt_right">335.1</td>
    <td class="gt_row gt_right">364.9</td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">Mississauga</th>
    <td class="gt_row gt_right">544,382</td>
    <td class="gt_row gt_right">612,925</td>
    <td class="gt_row gt_right">668,599</td>
    <td class="gt_row gt_right">713,443</td>
    <td class="gt_row gt_right">721,599</td>
    <td class="gt_row gt_right">717,961</td>
    <td class="gt_row gt_right">1,859.6</td>
    <td class="gt_row gt_right">2,093.8</td>
    <td class="gt_row gt_right">2,283.9</td>
    <td class="gt_row gt_right">2,437.1</td>
    <td class="gt_row gt_right">2,465.0</td>
    <td class="gt_row gt_right">2,452.6</td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">Brampton</th>
    <td class="gt_row gt_right">268,251</td>
    <td class="gt_row gt_right">325,428</td>
    <td class="gt_row gt_right">433,806</td>
    <td class="gt_row gt_right">523,906</td>
    <td class="gt_row gt_right">593,638</td>
    <td class="gt_row gt_right">656,480</td>
    <td class="gt_row gt_right">1,008.9</td>
    <td class="gt_row gt_right">1,223.9</td>
    <td class="gt_row gt_right">1,631.5</td>
    <td class="gt_row gt_right">1,970.4</td>
    <td class="gt_row gt_right">2,232.7</td>
    <td class="gt_row gt_right">2,469.0</td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">Hamilton</th>
    <td class="gt_row gt_right">467,799</td>
    <td class="gt_row gt_right">490,268</td>
    <td class="gt_row gt_right">504,559</td>
    <td class="gt_row gt_right">519,949</td>
    <td class="gt_row gt_right">536,917</td>
    <td class="gt_row gt_right">569,353</td>
    <td class="gt_row gt_right">418.3</td>
    <td class="gt_row gt_right">438.4</td>
    <td class="gt_row gt_right">451.2</td>
    <td class="gt_row gt_right">464.9</td>
    <td class="gt_row gt_right">480.1</td>
    <td class="gt_row gt_right">509.1</td>
  </tr>
</tbody>


</table>

</div>
</div>
</div>
<p>The <a href="../../reference/GT.tab_spanner_delim.html#great_tables.GT.tab_spanner_delim" title="0"><code>.tab_spanner_delim()</code></a> method recognizes the underscore delimiter and creates a hierarchical structure: <code>"population"</code> and <code>"density"</code> become top-level spanners, with the years (<code>1996</code>, <code>2001</code>, <code>2021</code>) as the final column labels. This creates a clean, organized appearance that clearly groups related metrics together. And, this one method can be used instead of a combination of <a href="../../reference/GT.cols_label.html#great_tables.GT.cols_label" title="0"><code>.cols_label()</code></a> and <a href="../../reference/GT.tab_spanner.html#great_tables.GT.tab_spanner" title="0"><code>.tab_spanner()</code></a> (which requires a separate invocation per spanner added).</p>
</section>
<section id="beautiful-boolean-formatting-with-fmt_tf" class="level3">
<h3 class="anchored" data-anchor-id="beautiful-boolean-formatting-with-fmt_tf">Beautiful boolean formatting with <code>fmt_tf()</code></h3>
<p>Boolean data is common in analytical tables, but raw <code>True</code>/<code>False</code> values can look unprofessional. The new <a href="../../reference/GT.fmt_tf.html#great_tables.GT.fmt_tf" title="0"><code>.fmt_tf()</code></a> method provides elegant ways to display boolean data using symbols, words, or custom formatting.</p>
<p>Here’s a simple example showing different <code>tf_style=</code> options:</p>
<div id="7fb0db2b" class="cell" data-execution_count="3">
<div class="code-copy-outer-scaffold"><div class="sourceCode cell-code" id="cb4" style="background: #f1f3f5;"><pre class="sourceCode python code-with-copy"><code class="sourceCode python"><span id="cb4-1"><span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">from</span> great_tables <span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">import</span> GT</span>
<span id="cb4-2"><span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">import</span> polars <span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">as</span> pl</span>
<span id="cb4-3"></span>
<span id="cb4-4"><span class="co" style="color: #5E5E5E;
background-color: null;
font-style: inherit;"># Create a simple DF with boolean data</span></span>
<span id="cb4-5">bool_df <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> pl.DataFrame({</span>
<span id="cb4-6">    <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"feature"</span>: [<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Premium Sound"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Leather Seats"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Sunroof"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Navigation"</span>],</span>
<span id="cb4-7">    <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"model_a"</span>: [<span class="va" style="color: #111111;
background-color: null;
font-style: inherit;">True</span>, <span class="va" style="color: #111111;
background-color: null;
font-style: inherit;">False</span>, <span class="va" style="color: #111111;
background-color: null;
font-style: inherit;">True</span>, <span class="va" style="color: #111111;
background-color: null;
font-style: inherit;">True</span>],</span>
<span id="cb4-8">    <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"model_b"</span>: [<span class="va" style="color: #111111;
background-color: null;
font-style: inherit;">True</span>, <span class="va" style="color: #111111;
background-color: null;
font-style: inherit;">True</span>, <span class="va" style="color: #111111;
background-color: null;
font-style: inherit;">False</span>, <span class="va" style="color: #111111;
background-color: null;
font-style: inherit;">True</span>],</span>
<span id="cb4-9">    <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"model_c"</span>: [<span class="va" style="color: #111111;
background-color: null;
font-style: inherit;">False</span>, <span class="va" style="color: #111111;
background-color: null;
font-style: inherit;">True</span>, <span class="va" style="color: #111111;
background-color: null;
font-style: inherit;">True</span>, <span class="va" style="color: #111111;
background-color: null;
font-style: inherit;">False</span>]</span>
<span id="cb4-10">})</span>
<span id="cb4-11"></span>
<span id="cb4-12">(</span>
<span id="cb4-13">    GT(bool_df, rowname_col<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"feature"</span>)</span>
<span id="cb4-14">    .fmt_tf(tf_style<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"check-mark"</span>, colors<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>[<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"green"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"red"</span>])</span>
<span id="cb4-15">    .tab_header(title<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Car Features Comparison"</span>, subtitle<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Using check-mark style"</span>)</span>
<span id="cb4-16">)</span></code></pre></div></div>
<div class="cell-output cell-output-display" data-execution_count="3">
<div id="pjettdfenz" style="padding-left:0px;padding-right:0px;padding-top:10px;padding-bottom:10px;overflow-x:auto;overflow-y:auto;width:auto;height:auto;">
<style>
#pjettdfenz table {
          font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Helvetica Neue', 'Fira Sans', 'Droid Sans', Arial, sans-serif;
          -webkit-font-smoothing: antialiased;
          -moz-osx-font-smoothing: grayscale;
        }

#pjettdfenz thead, tbody, tfoot, tr, td, th { border-style: none; }
 tr { background-color: transparent; }
#pjettdfenz p { margin: 0; padding: 0; }
 #pjettdfenz .gt_table { display: table; border-collapse: collapse; line-height: normal; margin-left: auto; margin-right: auto; color: #333333; font-size: 16px; font-weight: normal; font-style: normal; background-color: #FFFFFF; width: auto; border-top-style: solid; border-top-width: 2px; border-top-color: #A8A8A8; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #A8A8A8; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; }
 #pjettdfenz .gt_caption { padding-top: 4px; padding-bottom: 4px; }
 #pjettdfenz .gt_title { color: #333333; font-size: 125%; font-weight: initial; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; border-bottom-color: #FFFFFF; border-bottom-width: 0; }
 #pjettdfenz .gt_subtitle { color: #333333; font-size: 85%; font-weight: initial; padding-top: 3px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; border-top-color: #FFFFFF; border-top-width: 0; }
 #pjettdfenz .gt_heading { background-color: #FFFFFF; text-align: center; border-bottom-color: #FFFFFF; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #pjettdfenz .gt_bottom_border { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #pjettdfenz .gt_col_headings { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #pjettdfenz .gt_col_heading { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; overflow-x: hidden; }
 #pjettdfenz .gt_column_spanner_outer { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; padding-top: 0; padding-bottom: 0; padding-left: 4px; padding-right: 4px; }
 #pjettdfenz .gt_column_spanner_outer:first-child { padding-left: 0; }
 #pjettdfenz .gt_column_spanner_outer:last-child { padding-right: 0; }
 #pjettdfenz .gt_column_spanner { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; overflow-x: hidden; display: inline-block; width: 100%; }
 #pjettdfenz .gt_spanner_row { border-bottom-style: hidden; }
 #pjettdfenz .gt_group_heading { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; text-align: left; }
 #pjettdfenz .gt_empty_group_heading { padding: 0.5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: middle; }
 #pjettdfenz .gt_from_md> :first-child { margin-top: 0; }
 #pjettdfenz .gt_from_md> :last-child { margin-bottom: 0; }
 #pjettdfenz .gt_row { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; margin: 10px; border-top-style: solid; border-top-width: 1px; border-top-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; overflow-x: hidden; }
 #pjettdfenz .gt_stub { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; }
 #pjettdfenz .gt_stub_row_group { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; vertical-align: top; }
 #pjettdfenz .gt_row_group_first td { border-top-width: 2px; }
 #pjettdfenz .gt_row_group_first th { border-top-width: 2px; }
 #pjettdfenz .gt_striped { color: #333333; background-color: #F4F4F4; }
 #pjettdfenz .gt_table_body { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #pjettdfenz .gt_grand_summary_row { color: #333333; background-color: #FFFFFF; text-transform: inherit; padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; }
 #pjettdfenz .gt_first_grand_summary_row_bottom { border-top-style: double; border-top-width: 6px; border-top-color: #D3D3D3; }
 #pjettdfenz .gt_last_grand_summary_row_top { border-bottom-style: double; border-bottom-width: 6px; border-bottom-color: #D3D3D3; }
 #pjettdfenz .gt_sourcenotes { color: #333333; background-color: #FFFFFF; border-bottom-style: none; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; }
 #pjettdfenz .gt_sourcenote { font-size: 90%; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; text-align: left; }
 #pjettdfenz .gt_left { text-align: left; }
 #pjettdfenz .gt_center { text-align: center; }
 #pjettdfenz .gt_right { text-align: right; font-variant-numeric: tabular-nums; }
 #pjettdfenz .gt_font_normal { font-weight: normal; }
 #pjettdfenz .gt_font_bold { font-weight: bold; }
 #pjettdfenz .gt_font_italic { font-style: italic; }
 #pjettdfenz .gt_super { font-size: 65%; }
 #pjettdfenz .gt_footnote_marks { font-size: 75%; vertical-align: 0.4em; position: initial; }
 #pjettdfenz .gt_asterisk { font-size: 100%; vertical-align: 0; }
 
</style>
<table class="gt_table" data-quarto-disable-processing="false" data-quarto-bootstrap="false">
<thead>

  <tr class="gt_heading">
    <td colspan="4" class="gt_heading gt_title gt_font_normal">Car Features Comparison</td>
  </tr>
  <tr class="gt_heading">
    <td colspan="4" class="gt_heading gt_subtitle gt_font_normal gt_bottom_border">Using check-mark style</td>
  </tr>
<tr class="gt_col_headings">
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="1" colspan="1" scope="col" id=""></th>
  <th class="gt_col_heading gt_columns_bottom_border gt_center" rowspan="1" colspan="1" scope="col" id="model_a">model_a</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_center" rowspan="1" colspan="1" scope="col" id="model_b">model_b</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_center" rowspan="1" colspan="1" scope="col" id="model_c">model_c</th>
</tr>
</thead>
<tbody class="gt_table_body">
  <tr>
    <th class="gt_row gt_left gt_stub">Premium Sound</th>
    <td class="gt_row gt_center"><span style="color:green">✔</span></td>
    <td class="gt_row gt_center"><span style="color:green">✔</span></td>
    <td class="gt_row gt_center"><span style="color:red">✘</span></td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">Leather Seats</th>
    <td class="gt_row gt_center"><span style="color:red">✘</span></td>
    <td class="gt_row gt_center"><span style="color:green">✔</span></td>
    <td class="gt_row gt_center"><span style="color:green">✔</span></td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">Sunroof</th>
    <td class="gt_row gt_center"><span style="color:green">✔</span></td>
    <td class="gt_row gt_center"><span style="color:red">✘</span></td>
    <td class="gt_row gt_center"><span style="color:green">✔</span></td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">Navigation</th>
    <td class="gt_row gt_center"><span style="color:green">✔</span></td>
    <td class="gt_row gt_center"><span style="color:green">✔</span></td>
    <td class="gt_row gt_center"><span style="color:red">✘</span></td>
  </tr>
</tbody>


</table>

</div>
</div>
</div>
<p>You can also use different symbols and colors for a more distinctive look:</p>
<div id="1ca8d6f6" class="cell" data-execution_count="4">
<div class="code-copy-outer-scaffold"><div class="sourceCode cell-code" id="cb5" style="background: #f1f3f5;"><pre class="sourceCode python code-with-copy"><code class="sourceCode python"><span id="cb5-1">(</span>
<span id="cb5-2">    GT(bool_df, rowname_col<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"feature"</span>)</span>
<span id="cb5-3">    .fmt_tf(tf_style<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"circles"</span>, colors<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>[<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"#4CAF50"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"#F44336"</span>])</span>
<span id="cb5-4">    .tab_header(title<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Car Features Comparison"</span>, subtitle<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Using circles style"</span>)</span>
<span id="cb5-5">)</span></code></pre></div></div>
<div class="cell-output cell-output-display" data-execution_count="4">
<div id="alqdezovrm" style="padding-left:0px;padding-right:0px;padding-top:10px;padding-bottom:10px;overflow-x:auto;overflow-y:auto;width:auto;height:auto;">
<style>
#alqdezovrm table {
          font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Helvetica Neue', 'Fira Sans', 'Droid Sans', Arial, sans-serif;
          -webkit-font-smoothing: antialiased;
          -moz-osx-font-smoothing: grayscale;
        }

#alqdezovrm thead, tbody, tfoot, tr, td, th { border-style: none; }
 tr { background-color: transparent; }
#alqdezovrm p { margin: 0; padding: 0; }
 #alqdezovrm .gt_table { display: table; border-collapse: collapse; line-height: normal; margin-left: auto; margin-right: auto; color: #333333; font-size: 16px; font-weight: normal; font-style: normal; background-color: #FFFFFF; width: auto; border-top-style: solid; border-top-width: 2px; border-top-color: #A8A8A8; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #A8A8A8; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; }
 #alqdezovrm .gt_caption { padding-top: 4px; padding-bottom: 4px; }
 #alqdezovrm .gt_title { color: #333333; font-size: 125%; font-weight: initial; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; border-bottom-color: #FFFFFF; border-bottom-width: 0; }
 #alqdezovrm .gt_subtitle { color: #333333; font-size: 85%; font-weight: initial; padding-top: 3px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; border-top-color: #FFFFFF; border-top-width: 0; }
 #alqdezovrm .gt_heading { background-color: #FFFFFF; text-align: center; border-bottom-color: #FFFFFF; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #alqdezovrm .gt_bottom_border { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #alqdezovrm .gt_col_headings { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #alqdezovrm .gt_col_heading { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; overflow-x: hidden; }
 #alqdezovrm .gt_column_spanner_outer { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; padding-top: 0; padding-bottom: 0; padding-left: 4px; padding-right: 4px; }
 #alqdezovrm .gt_column_spanner_outer:first-child { padding-left: 0; }
 #alqdezovrm .gt_column_spanner_outer:last-child { padding-right: 0; }
 #alqdezovrm .gt_column_spanner { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; overflow-x: hidden; display: inline-block; width: 100%; }
 #alqdezovrm .gt_spanner_row { border-bottom-style: hidden; }
 #alqdezovrm .gt_group_heading { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; text-align: left; }
 #alqdezovrm .gt_empty_group_heading { padding: 0.5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: middle; }
 #alqdezovrm .gt_from_md> :first-child { margin-top: 0; }
 #alqdezovrm .gt_from_md> :last-child { margin-bottom: 0; }
 #alqdezovrm .gt_row { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; margin: 10px; border-top-style: solid; border-top-width: 1px; border-top-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; overflow-x: hidden; }
 #alqdezovrm .gt_stub { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; }
 #alqdezovrm .gt_stub_row_group { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; vertical-align: top; }
 #alqdezovrm .gt_row_group_first td { border-top-width: 2px; }
 #alqdezovrm .gt_row_group_first th { border-top-width: 2px; }
 #alqdezovrm .gt_striped { color: #333333; background-color: #F4F4F4; }
 #alqdezovrm .gt_table_body { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #alqdezovrm .gt_grand_summary_row { color: #333333; background-color: #FFFFFF; text-transform: inherit; padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; }
 #alqdezovrm .gt_first_grand_summary_row_bottom { border-top-style: double; border-top-width: 6px; border-top-color: #D3D3D3; }
 #alqdezovrm .gt_last_grand_summary_row_top { border-bottom-style: double; border-bottom-width: 6px; border-bottom-color: #D3D3D3; }
 #alqdezovrm .gt_sourcenotes { color: #333333; background-color: #FFFFFF; border-bottom-style: none; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; }
 #alqdezovrm .gt_sourcenote { font-size: 90%; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; text-align: left; }
 #alqdezovrm .gt_left { text-align: left; }
 #alqdezovrm .gt_center { text-align: center; }
 #alqdezovrm .gt_right { text-align: right; font-variant-numeric: tabular-nums; }
 #alqdezovrm .gt_font_normal { font-weight: normal; }
 #alqdezovrm .gt_font_bold { font-weight: bold; }
 #alqdezovrm .gt_font_italic { font-style: italic; }
 #alqdezovrm .gt_super { font-size: 65%; }
 #alqdezovrm .gt_footnote_marks { font-size: 75%; vertical-align: 0.4em; position: initial; }
 #alqdezovrm .gt_asterisk { font-size: 100%; vertical-align: 0; }
 
</style>
<table class="gt_table" data-quarto-disable-processing="false" data-quarto-bootstrap="false">
<thead>

  <tr class="gt_heading">
    <td colspan="4" class="gt_heading gt_title gt_font_normal">Car Features Comparison</td>
  </tr>
  <tr class="gt_heading">
    <td colspan="4" class="gt_heading gt_subtitle gt_font_normal gt_bottom_border">Using circles style</td>
  </tr>
<tr class="gt_col_headings">
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="1" colspan="1" scope="col" id=""></th>
  <th class="gt_col_heading gt_columns_bottom_border gt_center" rowspan="1" colspan="1" scope="col" id="model_a">model_a</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_center" rowspan="1" colspan="1" scope="col" id="model_b">model_b</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_center" rowspan="1" colspan="1" scope="col" id="model_c">model_c</th>
</tr>
</thead>
<tbody class="gt_table_body">
  <tr>
    <th class="gt_row gt_left gt_stub">Premium Sound</th>
    <td class="gt_row gt_center"><span style="color:#4CAF50">●</span></td>
    <td class="gt_row gt_center"><span style="color:#4CAF50">●</span></td>
    <td class="gt_row gt_center"><span style="color:#F44336">⭘</span></td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">Leather Seats</th>
    <td class="gt_row gt_center"><span style="color:#F44336">⭘</span></td>
    <td class="gt_row gt_center"><span style="color:#4CAF50">●</span></td>
    <td class="gt_row gt_center"><span style="color:#4CAF50">●</span></td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">Sunroof</th>
    <td class="gt_row gt_center"><span style="color:#4CAF50">●</span></td>
    <td class="gt_row gt_center"><span style="color:#F44336">⭘</span></td>
    <td class="gt_row gt_center"><span style="color:#4CAF50">●</span></td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">Navigation</th>
    <td class="gt_row gt_center"><span style="color:#4CAF50">●</span></td>
    <td class="gt_row gt_center"><span style="color:#4CAF50">●</span></td>
    <td class="gt_row gt_center"><span style="color:#F44336">⭘</span></td>
  </tr>
</tbody>


</table>

</div>
</div>
</div>
<p>The <a href="../../reference/GT.fmt_tf.html#great_tables.GT.fmt_tf" title="0"><code>.fmt_tf()</code></a> method transforms boolean values into visually appealing symbols that make it easy to quickly scan and compare data across rows and columns.</p>
</section>
<section id="rotating-column-labels-with-cols_label_rotate" class="level3">
<h3 class="anchored" data-anchor-id="rotating-column-labels-with-cols_label_rotate">Rotating column labels with <code>cols_label_rotate()</code></h3>
<p>When dealing with many columns or long column names, horizontal space becomes precious. The <a href="../../reference/GT.cols_label_rotate.html#great_tables.GT.cols_label_rotate" title="0"><code>.cols_label_rotate()</code></a> method solves this by rotating column labels vertically, allowing for more compact table layouts.</p>
<p>Here’s an example where we use the <code>gtcars</code> dataset to create a table which communicates a feature matrix:</p>
<div id="aeea77c6" class="cell" data-execution_count="5">
<div class="code-copy-outer-scaffold"><div class="sourceCode cell-code" id="cb6" style="background: #f1f3f5;"><pre class="sourceCode python code-with-copy"><code class="sourceCode python"><span id="cb6-1"><span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">from</span> great_tables <span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">import</span> GT, style, loc</span>
<span id="cb6-2"><span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">from</span> great_tables.data <span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">import</span> gtcars</span>
<span id="cb6-3"><span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">import</span> polars <span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">as</span> pl</span>
<span id="cb6-4"><span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">import</span> polars.selectors <span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">as</span> cs</span>
<span id="cb6-5"></span>
<span id="cb6-6"><span class="co" style="color: #5E5E5E;
background-color: null;
font-style: inherit;"># Manipulate dataset to create a feature comparison table</span></span>
<span id="cb6-7">gtcars_mini <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> (</span>
<span id="cb6-8">    pl.from_pandas(gtcars)</span>
<span id="cb6-9">    .<span class="bu" style="color: null;
background-color: null;
font-style: inherit;">filter</span>(pl.col(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"year"</span>) <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">==</span> <span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">2017</span>)</span>
<span id="cb6-10">    .<span class="bu" style="color: null;
background-color: null;
font-style: inherit;">filter</span>(pl.col(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"ctry_origin"</span>).is_in([<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Germany"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Italy"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"United Kingdom"</span>]))</span>
<span id="cb6-11">    .with_columns([</span>
<span id="cb6-12">        (pl.col(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"hp"</span>) <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">&gt;</span> <span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">500</span>).alias(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"High Power"</span>),</span>
<span id="cb6-13">        (pl.col(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"mpg_h"</span>) <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">&gt;</span> <span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">25</span>).alias(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Fuel Efficient"</span>),</span>
<span id="cb6-14">        (pl.col(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"drivetrain"</span>) <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">==</span> <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"awd"</span>).alias(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"All Wheel Drive"</span>),</span>
<span id="cb6-15">        (pl.col(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"msrp"</span>) <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">&gt;</span> <span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">100000</span>).alias(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Premium Price"</span>),</span>
<span id="cb6-16">        (pl.col(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"trsmn"</span>).<span class="bu" style="color: null;
background-color: null;
font-style: inherit;">str</span>.contains(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"manual"</span>)).alias(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Manual Transmission"</span>)</span>
<span id="cb6-17">    ])</span>
<span id="cb6-18">    .select([</span>
<span id="cb6-19">        <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"mfr"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"model"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"trim"</span>,</span>
<span id="cb6-20">        <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"High Power"</span>,</span>
<span id="cb6-21">        <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Fuel Efficient"</span>,</span>
<span id="cb6-22">        <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"All Wheel Drive"</span>,</span>
<span id="cb6-23">        <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Premium Price"</span>,</span>
<span id="cb6-24">        <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Manual Transmission"</span></span>
<span id="cb6-25">    ])</span>
<span id="cb6-26">    .head(<span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">10</span>)</span>
<span id="cb6-27">)</span>
<span id="cb6-28"></span>
<span id="cb6-29">(</span>
<span id="cb6-30">    GT(gtcars_mini)</span>
<span id="cb6-31">    .fmt_tf(</span>
<span id="cb6-32">        columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>cs.by_dtype(pl.Boolean),</span>
<span id="cb6-33">        tf_style<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"check-mark"</span>,</span>
<span id="cb6-34">        colors<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>[<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"#2E8B57"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"#DC143C"</span>]</span>
<span id="cb6-35">    )</span>
<span id="cb6-36">    .cols_label_rotate(</span>
<span id="cb6-37">        columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>cs.by_dtype(pl.Boolean),</span>
<span id="cb6-38">        <span class="bu" style="color: null;
background-color: null;
font-style: inherit;">dir</span><span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"sideways-lr"</span></span>
<span id="cb6-39">    )</span>
<span id="cb6-40">    .tab_header(</span>
<span id="cb6-41">        title<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"European Luxury Cars Feature Matrix"</span>,</span>
<span id="cb6-42">        subtitle<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"2017 Models with Performance &amp; Luxury Features"</span></span>
<span id="cb6-43">    )</span>
<span id="cb6-44">    .opt_stylize(style<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">1</span>)</span>
<span id="cb6-45">    .tab_style(</span>
<span id="cb6-46">        style<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>style.text(size<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"11px"</span>),</span>
<span id="cb6-47">        locations<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>loc.body()</span>
<span id="cb6-48">    )</span>
<span id="cb6-49">)</span></code></pre></div></div>
<div class="cell-output cell-output-display" data-execution_count="5">
<div id="nfckgfulgq" style="padding-left:0px;padding-right:0px;padding-top:10px;padding-bottom:10px;overflow-x:auto;overflow-y:auto;width:auto;height:auto;">
<style>
#nfckgfulgq table {
          font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Helvetica Neue', 'Fira Sans', 'Droid Sans', Arial, sans-serif;
          -webkit-font-smoothing: antialiased;
          -moz-osx-font-smoothing: grayscale;
        }

#nfckgfulgq thead, tbody, tfoot, tr, td, th { border-style: none; }
 tr { background-color: transparent; }
#nfckgfulgq p { margin: 0; padding: 0; }
 #nfckgfulgq .gt_table { display: table; border-collapse: collapse; line-height: normal; margin-left: auto; margin-right: auto; color: #333333; font-size: 16px; font-weight: normal; font-style: normal; background-color: #FFFFFF; width: auto; border-top-style: solid; border-top-width: 2px; border-top-color: #004D80; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #004D80; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; }
 #nfckgfulgq .gt_caption { padding-top: 4px; padding-bottom: 4px; }
 #nfckgfulgq .gt_title { color: #333333; font-size: 125%; font-weight: initial; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; border-bottom-color: #FFFFFF; border-bottom-width: 0; }
 #nfckgfulgq .gt_subtitle { color: #333333; font-size: 85%; font-weight: initial; padding-top: 3px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; border-top-color: #FFFFFF; border-top-width: 0; }
 #nfckgfulgq .gt_heading { background-color: #FFFFFF; text-align: center; border-bottom-color: #FFFFFF; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #nfckgfulgq .gt_bottom_border { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #0076BA; }
 #nfckgfulgq .gt_col_headings { border-top-style: solid; border-top-width: 2px; border-top-color: #0076BA; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #0076BA; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #nfckgfulgq .gt_col_heading { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; overflow-x: hidden; }
 #nfckgfulgq .gt_column_spanner_outer { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; padding-top: 0; padding-bottom: 0; padding-left: 4px; padding-right: 4px; }
 #nfckgfulgq .gt_column_spanner_outer:first-child { padding-left: 0; }
 #nfckgfulgq .gt_column_spanner_outer:last-child { padding-right: 0; }
 #nfckgfulgq .gt_column_spanner { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #0076BA; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; overflow-x: hidden; display: inline-block; width: 100%; }
 #nfckgfulgq .gt_spanner_row { border-bottom-style: hidden; }
 #nfckgfulgq .gt_group_heading { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-top-style: solid; border-top-width: 2px; border-top-color: #0076BA; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #0076BA; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; text-align: left; }
 #nfckgfulgq .gt_empty_group_heading { padding: 0.5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; border-top-style: solid; border-top-width: 2px; border-top-color: #0076BA; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #0076BA; vertical-align: middle; }
 #nfckgfulgq .gt_from_md> :first-child { margin-top: 0; }
 #nfckgfulgq .gt_from_md> :last-child { margin-bottom: 0; }
 #nfckgfulgq .gt_row { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; margin: 10px; border-top-style: none; border-top-width: 1px; border-top-color: #89D3FE; border-left-style: none; border-left-width: 1px; border-left-color: #89D3FE; border-right-style: none; border-right-width: 1px; border-right-color: #89D3FE; vertical-align: middle; overflow-x: hidden; }
 #nfckgfulgq .gt_stub { color: #FFFFFF; background-color: #0076BA; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #0076BA; padding-left: 5px; padding-right: 5px; }
 #nfckgfulgq .gt_stub_row_group { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; vertical-align: top; }
 #nfckgfulgq .gt_row_group_first td { border-top-width: 2px; }
 #nfckgfulgq .gt_row_group_first th { border-top-width: 2px; }
 #nfckgfulgq .gt_striped { color: #333333; background-color: #F4F4F4; }
 #nfckgfulgq .gt_table_body { border-top-style: solid; border-top-width: 2px; border-top-color: #0076BA; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #0076BA; }
 #nfckgfulgq .gt_grand_summary_row { color: #333333; background-color: #89D3FE; text-transform: inherit; padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; }
 #nfckgfulgq .gt_first_grand_summary_row_bottom { border-top-style: double; border-top-width: 6px; border-top-color: #D3D3D3; }
 #nfckgfulgq .gt_last_grand_summary_row_top { border-bottom-style: double; border-bottom-width: 6px; border-bottom-color: #D3D3D3; }
 #nfckgfulgq .gt_sourcenotes { color: #333333; background-color: #FFFFFF; border-bottom-style: none; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; }
 #nfckgfulgq .gt_sourcenote { font-size: 90%; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; text-align: left; }
 #nfckgfulgq .gt_left { text-align: left; }
 #nfckgfulgq .gt_center { text-align: center; }
 #nfckgfulgq .gt_right { text-align: right; font-variant-numeric: tabular-nums; }
 #nfckgfulgq .gt_font_normal { font-weight: normal; }
 #nfckgfulgq .gt_font_bold { font-weight: bold; }
 #nfckgfulgq .gt_font_italic { font-style: italic; }
 #nfckgfulgq .gt_super { font-size: 65%; }
 #nfckgfulgq .gt_footnote_marks { font-size: 75%; vertical-align: 0.4em; position: initial; }
 #nfckgfulgq .gt_asterisk { font-size: 100%; vertical-align: 0; }
 
</style>
<table class="gt_table" data-quarto-disable-processing="false" data-quarto-bootstrap="false">
<thead>

  <tr class="gt_heading">
    <td colspan="8" class="gt_heading gt_title gt_font_normal">European Luxury Cars Feature Matrix</td>
  </tr>
  <tr class="gt_heading">
    <td colspan="8" class="gt_heading gt_subtitle gt_font_normal gt_bottom_border">2017 Models with Performance &amp; Luxury Features</td>
  </tr>
<tr class="gt_col_headings">
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="1" colspan="1" scope="col" id="mfr">mfr</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="1" colspan="1" scope="col" id="model">model</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="1" colspan="1" scope="col" id="trim">trim</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_center" rowspan="1" colspan="1" style="writing-mode: sideways-lr; vertical-align: middle; text-align: left; padding: 8px 0px;" scope="col" id="High-Power">High Power</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_center" rowspan="1" colspan="1" style="writing-mode: sideways-lr; vertical-align: middle; text-align: left; padding: 8px 0px;" scope="col" id="Fuel-Efficient">Fuel Efficient</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_center" rowspan="1" colspan="1" style="writing-mode: sideways-lr; vertical-align: middle; text-align: left; padding: 8px 0px;" scope="col" id="All-Wheel-Drive">All Wheel Drive</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_center" rowspan="1" colspan="1" style="writing-mode: sideways-lr; vertical-align: middle; text-align: left; padding: 8px 0px;" scope="col" id="Premium-Price">Premium Price</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_center" rowspan="1" colspan="1" style="writing-mode: sideways-lr; vertical-align: middle; text-align: left; padding: 8px 0px;" scope="col" id="Manual-Transmission">Manual Transmission</th>
</tr>
</thead>
<tbody class="gt_table_body">
  <tr>
    <td style="font-size: 11px;" class="gt_row gt_left">Ferrari</td>
    <td style="font-size: 11px;" class="gt_row gt_left">GTC4Lusso</td>
    <td style="font-size: 11px;" class="gt_row gt_left">Base Coupe</td>
    <td style="font-size: 11px;" class="gt_row gt_center"><span style="color:#2E8B57">✔</span></td>
    <td style="font-size: 11px;" class="gt_row gt_center"><span style="color:#DC143C">✘</span></td>
    <td style="font-size: 11px;" class="gt_row gt_center"><span style="color:#2E8B57">✔</span></td>
    <td style="font-size: 11px;" class="gt_row gt_center"><span style="color:#2E8B57">✔</span></td>
    <td style="font-size: 11px;" class="gt_row gt_center"><span style="color:#DC143C">✘</span></td>
  </tr>
  <tr>
    <td style="font-size: 11px;" class="gt_row gt_left gt_striped">Aston Martin</td>
    <td style="font-size: 11px;" class="gt_row gt_left gt_striped">DB11</td>
    <td style="font-size: 11px;" class="gt_row gt_left gt_striped">Base Coupe</td>
    <td style="font-size: 11px;" class="gt_row gt_center gt_striped"><span style="color:#2E8B57">✔</span></td>
    <td style="font-size: 11px;" class="gt_row gt_center gt_striped"><span style="color:#DC143C">✘</span></td>
    <td style="font-size: 11px;" class="gt_row gt_center gt_striped"><span style="color:#DC143C">✘</span></td>
    <td style="font-size: 11px;" class="gt_row gt_center gt_striped"><span style="color:#2E8B57">✔</span></td>
    <td style="font-size: 11px;" class="gt_row gt_center gt_striped"><span style="color:#DC143C">✘</span></td>
  </tr>
  <tr>
    <td style="font-size: 11px;" class="gt_row gt_left">Lotus</td>
    <td style="font-size: 11px;" class="gt_row gt_left">Evora</td>
    <td style="font-size: 11px;" class="gt_row gt_left">2+2 Coupe</td>
    <td style="font-size: 11px;" class="gt_row gt_center"><span style="color:#DC143C">✘</span></td>
    <td style="font-size: 11px;" class="gt_row gt_center"><span style="color:#DC143C">✘</span></td>
    <td style="font-size: 11px;" class="gt_row gt_center"><span style="color:#DC143C">✘</span></td>
    <td style="font-size: 11px;" class="gt_row gt_center"><span style="color:#DC143C">✘</span></td>
    <td style="font-size: 11px;" class="gt_row gt_center"><span style="color:#DC143C">✘</span></td>
  </tr>
  <tr>
    <td style="font-size: 11px;" class="gt_row gt_left gt_striped">Porsche</td>
    <td style="font-size: 11px;" class="gt_row gt_left gt_striped">718 Boxster</td>
    <td style="font-size: 11px;" class="gt_row gt_left gt_striped">Base Convertible</td>
    <td style="font-size: 11px;" class="gt_row gt_center gt_striped"><span style="color:#DC143C">✘</span></td>
    <td style="font-size: 11px;" class="gt_row gt_center gt_striped"><span style="color:#2E8B57">✔</span></td>
    <td style="font-size: 11px;" class="gt_row gt_center gt_striped"><span style="color:#DC143C">✘</span></td>
    <td style="font-size: 11px;" class="gt_row gt_center gt_striped"><span style="color:#DC143C">✘</span></td>
    <td style="font-size: 11px;" class="gt_row gt_center gt_striped"><span style="color:#DC143C">✘</span></td>
  </tr>
  <tr>
    <td style="font-size: 11px;" class="gt_row gt_left">Porsche</td>
    <td style="font-size: 11px;" class="gt_row gt_left">718 Cayman</td>
    <td style="font-size: 11px;" class="gt_row gt_left">Base Coupe</td>
    <td style="font-size: 11px;" class="gt_row gt_center"><span style="color:#DC143C">✘</span></td>
    <td style="font-size: 11px;" class="gt_row gt_center"><span style="color:#2E8B57">✔</span></td>
    <td style="font-size: 11px;" class="gt_row gt_center"><span style="color:#DC143C">✘</span></td>
    <td style="font-size: 11px;" class="gt_row gt_center"><span style="color:#DC143C">✘</span></td>
    <td style="font-size: 11px;" class="gt_row gt_center"><span style="color:#DC143C">✘</span></td>
  </tr>
</tbody>


</table>

</div>
</div>
</div>
<p>This example demonstrates how both the <a href="../../reference/GT.fmt_tf.html#great_tables.GT.fmt_tf" title="0"><code>.fmt_tf()</code></a> and <a href="../../reference/GT.cols_label_rotate.html#great_tables.GT.cols_label_rotate" title="0"><code>.cols_label_rotate()</code></a> methods can work well together. The boolean columns use checkmarks (✓/✗) with custom <code>colors=</code>, while the rotated labels save horizontal space in this dense feature matrix. The combination allows you to put more information into a compact and still readable format.</p>
</section>
<section id="enhanced-datetime-formatting-with-fmt_datetime" class="level3">
<h3 class="anchored" data-anchor-id="enhanced-datetime-formatting-with-fmt_datetime">Enhanced datetime formatting with <code>fmt_datetime()</code></h3>
<p>The <a href="../../reference/GT.fmt_datetime.html#great_tables.GT.fmt_datetime" title="0"><code>.fmt_datetime()</code></a> method now supports custom format strings through the new <code>format_str=</code> parameter, giving you complete control over how datetime values appear in your tables.</p>
<p>Here’s an example using the included <code>gibraltar</code> weather dataset:</p>
<div id="1d8a9731" class="cell" data-execution_count="6">
<div class="code-copy-outer-scaffold"><div class="sourceCode cell-code" id="cb7" style="background: #f1f3f5;"><pre class="sourceCode python code-with-copy"><code class="sourceCode python"><span id="cb7-1"><span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">from</span> great_tables <span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">import</span> GT</span>
<span id="cb7-2"><span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">from</span> great_tables.data <span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">import</span> gibraltar</span>
<span id="cb7-3"><span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">import</span> polars <span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">as</span> pl</span>
<span id="cb7-4"></span>
<span id="cb7-5"><span class="co" style="color: #5E5E5E;
background-color: null;
font-style: inherit;"># Prepare the meteorological data</span></span>
<span id="cb7-6">gibraltar_mini <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> (</span>
<span id="cb7-7">    pl.from_pandas(gibraltar)</span>
<span id="cb7-8">    .with_columns(</span>
<span id="cb7-9">        [</span>
<span id="cb7-10">            pl.concat_str([pl.col(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"date"</span>), pl.lit(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">" "</span>), pl.col(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"time"</span>)])</span>
<span id="cb7-11">            .<span class="bu" style="color: null;
background-color: null;
font-style: inherit;">str</span>.strptime(pl.Datetime, <span class="bu" style="color: null;
background-color: null;
font-style: inherit;">format</span><span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"%Y-%m-</span><span class="sc" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">%d</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;"> %H:%M"</span>)</span>
<span id="cb7-12">            .alias(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"datetime"</span>)</span>
<span id="cb7-13">        ]</span>
<span id="cb7-14">    )</span>
<span id="cb7-15">    .<span class="bu" style="color: null;
background-color: null;
font-style: inherit;">filter</span>(pl.col(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"datetime"</span>).dt.hour().is_in([<span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">6</span>, <span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">12</span>, <span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">18</span>]))</span>
<span id="cb7-16">    .select([<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"datetime"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"temp"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"humidity"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"condition"</span>])</span>
<span id="cb7-17">    .sort(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"datetime"</span>)</span>
<span id="cb7-18">    .head(<span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">10</span>)</span>
<span id="cb7-19">)</span>
<span id="cb7-20"></span>
<span id="cb7-21">(</span>
<span id="cb7-22">    GT(gibraltar_mini)</span>
<span id="cb7-23">    .fmt_datetime(</span>
<span id="cb7-24">        columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"datetime"</span>,</span>
<span id="cb7-25">        format_str<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"%b </span><span class="sc" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">%d</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;"> %Y (%a) - %I:%M %p"</span>,</span>
<span id="cb7-26">    )</span>
<span id="cb7-27">    .fmt_number(columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"temp"</span>, decimals<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">1</span>, pattern<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"</span><span class="sc" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">{x}</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">°C"</span>)</span>
<span id="cb7-28">    .fmt_percent(columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"humidity"</span>, scale_values<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="va" style="color: #111111;
background-color: null;
font-style: inherit;">False</span>, decimals<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">0</span>)</span>
<span id="cb7-29">    .cols_label(</span>
<span id="cb7-30">        datetime<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Time"</span>,</span>
<span id="cb7-31">        temp<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Temperature"</span>,</span>
<span id="cb7-32">        humidity<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Humidity"</span>,</span>
<span id="cb7-33">        condition<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Conditions"</span>,</span>
<span id="cb7-34">    )</span>
<span id="cb7-35">    .tab_header(</span>
<span id="cb7-36">        title<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Gibraltar Temperature and Humidity Conditions"</span>,</span>
<span id="cb7-37">        subtitle<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Morning, Noon, and Evening Readings"</span></span>
<span id="cb7-38">    )</span>
<span id="cb7-39">    .opt_stylize(style<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">1</span>, color<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"cyan"</span>)</span>
<span id="cb7-40">)</span></code></pre></div></div>
<div class="cell-output cell-output-display" data-execution_count="6">
<div id="cjqrlkwehg" style="padding-left:0px;padding-right:0px;padding-top:10px;padding-bottom:10px;overflow-x:auto;overflow-y:auto;width:auto;height:auto;">
<style>
#cjqrlkwehg table {
          font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Helvetica Neue', 'Fira Sans', 'Droid Sans', Arial, sans-serif;
          -webkit-font-smoothing: antialiased;
          -moz-osx-font-smoothing: grayscale;
        }

#cjqrlkwehg thead, tbody, tfoot, tr, td, th { border-style: none; }
 tr { background-color: transparent; }
#cjqrlkwehg p { margin: 0; padding: 0; }
 #cjqrlkwehg .gt_table { display: table; border-collapse: collapse; line-height: normal; margin-left: auto; margin-right: auto; color: #333333; font-size: 16px; font-weight: normal; font-style: normal; background-color: #FFFFFF; width: auto; border-top-style: solid; border-top-width: 2px; border-top-color: #016763; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #016763; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; }
 #cjqrlkwehg .gt_caption { padding-top: 4px; padding-bottom: 4px; }
 #cjqrlkwehg .gt_title { color: #333333; font-size: 125%; font-weight: initial; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; border-bottom-color: #FFFFFF; border-bottom-width: 0; }
 #cjqrlkwehg .gt_subtitle { color: #333333; font-size: 85%; font-weight: initial; padding-top: 3px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; border-top-color: #FFFFFF; border-top-width: 0; }
 #cjqrlkwehg .gt_heading { background-color: #FFFFFF; text-align: center; border-bottom-color: #FFFFFF; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #cjqrlkwehg .gt_bottom_border { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #01837B; }
 #cjqrlkwehg .gt_col_headings { border-top-style: solid; border-top-width: 2px; border-top-color: #01837B; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #01837B; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #cjqrlkwehg .gt_col_heading { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; overflow-x: hidden; }
 #cjqrlkwehg .gt_column_spanner_outer { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; padding-top: 0; padding-bottom: 0; padding-left: 4px; padding-right: 4px; }
 #cjqrlkwehg .gt_column_spanner_outer:first-child { padding-left: 0; }
 #cjqrlkwehg .gt_column_spanner_outer:last-child { padding-right: 0; }
 #cjqrlkwehg .gt_column_spanner { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #01837B; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; overflow-x: hidden; display: inline-block; width: 100%; }
 #cjqrlkwehg .gt_spanner_row { border-bottom-style: hidden; }
 #cjqrlkwehg .gt_group_heading { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-top-style: solid; border-top-width: 2px; border-top-color: #01837B; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #01837B; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; text-align: left; }
 #cjqrlkwehg .gt_empty_group_heading { padding: 0.5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; border-top-style: solid; border-top-width: 2px; border-top-color: #01837B; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #01837B; vertical-align: middle; }
 #cjqrlkwehg .gt_from_md> :first-child { margin-top: 0; }
 #cjqrlkwehg .gt_from_md> :last-child { margin-bottom: 0; }
 #cjqrlkwehg .gt_row { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; margin: 10px; border-top-style: none; border-top-width: 1px; border-top-color: #A5FEF2; border-left-style: none; border-left-width: 1px; border-left-color: #A5FEF2; border-right-style: none; border-right-width: 1px; border-right-color: #A5FEF2; vertical-align: middle; overflow-x: hidden; }
 #cjqrlkwehg .gt_stub { color: #FFFFFF; background-color: #01837B; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #01837B; padding-left: 5px; padding-right: 5px; }
 #cjqrlkwehg .gt_stub_row_group { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; vertical-align: top; }
 #cjqrlkwehg .gt_row_group_first td { border-top-width: 2px; }
 #cjqrlkwehg .gt_row_group_first th { border-top-width: 2px; }
 #cjqrlkwehg .gt_striped { color: #333333; background-color: #F4F4F4; }
 #cjqrlkwehg .gt_table_body { border-top-style: solid; border-top-width: 2px; border-top-color: #01837B; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #01837B; }
 #cjqrlkwehg .gt_grand_summary_row { color: #333333; background-color: #A5FEF2; text-transform: inherit; padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; }
 #cjqrlkwehg .gt_first_grand_summary_row_bottom { border-top-style: double; border-top-width: 6px; border-top-color: #D3D3D3; }
 #cjqrlkwehg .gt_last_grand_summary_row_top { border-bottom-style: double; border-bottom-width: 6px; border-bottom-color: #D3D3D3; }
 #cjqrlkwehg .gt_sourcenotes { color: #333333; background-color: #FFFFFF; border-bottom-style: none; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; }
 #cjqrlkwehg .gt_sourcenote { font-size: 90%; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; text-align: left; }
 #cjqrlkwehg .gt_left { text-align: left; }
 #cjqrlkwehg .gt_center { text-align: center; }
 #cjqrlkwehg .gt_right { text-align: right; font-variant-numeric: tabular-nums; }
 #cjqrlkwehg .gt_font_normal { font-weight: normal; }
 #cjqrlkwehg .gt_font_bold { font-weight: bold; }
 #cjqrlkwehg .gt_font_italic { font-style: italic; }
 #cjqrlkwehg .gt_super { font-size: 65%; }
 #cjqrlkwehg .gt_footnote_marks { font-size: 75%; vertical-align: 0.4em; position: initial; }
 #cjqrlkwehg .gt_asterisk { font-size: 100%; vertical-align: 0; }
 
</style>
<table class="gt_table" data-quarto-disable-processing="false" data-quarto-bootstrap="false">
<thead>

  <tr class="gt_heading">
    <td colspan="4" class="gt_heading gt_title gt_font_normal">Gibraltar Temperature and Humidity Conditions</td>
  </tr>
  <tr class="gt_heading">
    <td colspan="4" class="gt_heading gt_subtitle gt_font_normal gt_bottom_border">Morning, Noon, and Evening Readings</td>
  </tr>
<tr class="gt_col_headings">
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="datetime">Time</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="temp">Temperature</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="humidity">Humidity</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="1" colspan="1" scope="col" id="condition">Conditions</th>
</tr>
</thead>
<tbody class="gt_table_body">
  <tr>
    <td class="gt_row gt_right">May 01 2023 (Mon) - 06:50 AM</td>
    <td class="gt_row gt_right">17.2°C</td>
    <td class="gt_row gt_right">1%</td>
    <td class="gt_row gt_left">Fair</td>
  </tr>
  <tr>
    <td class="gt_row gt_right gt_striped">May 01 2023 (Mon) - 12:20 PM</td>
    <td class="gt_row gt_right gt_striped">22.2°C</td>
    <td class="gt_row gt_right gt_striped">1%</td>
    <td class="gt_row gt_left gt_striped">Fair</td>
  </tr>
  <tr>
    <td class="gt_row gt_right">May 01 2023 (Mon) - 12:50 PM</td>
    <td class="gt_row gt_right">22.2°C</td>
    <td class="gt_row gt_right">1%</td>
    <td class="gt_row gt_left">Fair</td>
  </tr>
  <tr>
    <td class="gt_row gt_right gt_striped">May 01 2023 (Mon) - 06:20 PM</td>
    <td class="gt_row gt_right gt_striped">20.0°C</td>
    <td class="gt_row gt_right gt_striped">1%</td>
    <td class="gt_row gt_left gt_striped">Fair</td>
  </tr>
  <tr>
    <td class="gt_row gt_right">May 01 2023 (Mon) - 06:50 PM</td>
    <td class="gt_row gt_right">20.0°C</td>
    <td class="gt_row gt_right">1%</td>
    <td class="gt_row gt_left">Fair</td>
  </tr>
  <tr>
    <td class="gt_row gt_right gt_striped">May 02 2023 (Tue) - 06:50 AM</td>
    <td class="gt_row gt_right gt_striped">17.8°C</td>
    <td class="gt_row gt_right gt_striped">1%</td>
    <td class="gt_row gt_left gt_striped">Mostly Cloudy</td>
  </tr>
  <tr>
    <td class="gt_row gt_right">May 02 2023 (Tue) - 12:20 PM</td>
    <td class="gt_row gt_right">18.9°C</td>
    <td class="gt_row gt_right">1%</td>
    <td class="gt_row gt_left">Mostly Cloudy</td>
  </tr>
  <tr>
    <td class="gt_row gt_right gt_striped">May 02 2023 (Tue) - 12:50 PM</td>
    <td class="gt_row gt_right gt_striped">20.0°C</td>
    <td class="gt_row gt_right gt_striped">1%</td>
    <td class="gt_row gt_left gt_striped">Mostly Cloudy</td>
  </tr>
  <tr>
    <td class="gt_row gt_right">May 02 2023 (Tue) - 06:20 PM</td>
    <td class="gt_row gt_right">22.2°C</td>
    <td class="gt_row gt_right">1%</td>
    <td class="gt_row gt_left">Fair</td>
  </tr>
  <tr>
    <td class="gt_row gt_right gt_striped">May 02 2023 (Tue) - 06:50 PM</td>
    <td class="gt_row gt_right gt_striped">22.2°C</td>
    <td class="gt_row gt_right gt_striped">1%</td>
    <td class="gt_row gt_left gt_striped">Fair</td>
  </tr>
</tbody>


</table>

</div>
</div>
</div>
<p>The custom datetime formatting string in <code>format_str="%b %d %Y (%a) - %I:%M %p"</code> creates a readable datetime format that’s perfect for weather reporting, showing the day of week, month, day, year, and the time in 12-hour format.</p>
</section>
<section id="acknowledgements-and-whats-next" class="level3">
<h3 class="anchored" data-anchor-id="acknowledgements-and-whats-next">Acknowledgements and what’s next</h3>
<p>We’re grateful to all the contributors who made this release possible. These new features represent significant improvements for creating space-efficient tables while also maximizing visual appeal.</p>
<p>The combination of these features lets you now create complex, professional tables with hierarchical column structures, boolean indicators, space-saving labels, and nicely formatted datetime displays.</p>
<p>We’re always happy to get feedback and hear about how you’re using Great Tables:</p>
<ol type="1">
<li><a href="https://github.com/posit-dev/great-tables/issues">GitHub Issues</a></li>
<li><a href="https://github.com/posit-dev/great-tables/discussions">GitHub Discussions</a></li>
<li><a href="https://discord.com/invite/Ux7nrcXHVV">Discord</a></li>
</ol>
<p>Keep building those beautiful tables!</p>


</section>

 ]]></description>
  <guid>https://posit-dev.github.io/great-tables/blog/introduction-0.18.0/</guid>
  <pubDate>Fri, 18 Jul 2025 00:00:00 GMT</pubDate>
</item>
<item>
  <title>Adding Plots to Great Tables</title>
  <dc:creator>Jules Walzer-Goldfeld and Michael Chow</dc:creator>
  <link>https://posit-dev.github.io/great-tables/blog/plots-in-tables/</link>
  <description><![CDATA[ 




<p>While working on <a href="https://posit-dev.github.io/gt-extras/articles/intro.html"><strong>gt-extras</strong></a>, I’ve been exploring how to add small plots to Great Tables. These can go by many names, like spark lines, nanoplots, and so on. In this post, I’ll look at three approaches I tried: adding plots with <a href="https://plotnine.org/"><code>plotnine</code></a>, <a href="https://github.com/orsinium-labs/svg.py"><code>svg.py</code></a>, or adding HTML directly. In the first two cases, the plots are SVGs, while the latter entails a collection of composed HTML div elements.</p>
<p>Here are the pieces I’ll cover:</p>
<ul>
<li><strong>svg.py</strong>: creating your own tiny chart directly for a row.</li>
<li><strong>direct HTML</strong>: adding HTML divs directly.</li>
<li><strong>plotnine</strong>: adding a full, stripped-down chart to a row.</li>
</ul>
<p>In the end, it’s often simplest to use <code>svg.py</code>, since you can create basic charts with minimal overhead. Building elements with HTML has even <em>less</em> overhead, but it is also slightly less user-friendly. At the other end of the spectrum, as your charts become more complex, using existing packages like the more exhaustive <code>plotnine</code> is a good alternative.</p>
<div id="2a647ddd" class="cell" data-execution_count="1">
<div class="cell-output cell-output-display" data-execution_count="1">
<div id="kfhjuqdzhe" style="padding-left:0px;padding-right:0px;padding-top:10px;padding-bottom:10px;overflow-x:auto;overflow-y:auto;width:auto;height:auto;">
<style>
#kfhjuqdzhe table {
          font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Helvetica Neue', 'Fira Sans', 'Droid Sans', Arial, sans-serif;
          -webkit-font-smoothing: antialiased;
          -moz-osx-font-smoothing: grayscale;
        }

#kfhjuqdzhe thead, tbody, tfoot, tr, td, th { border-style: none; }
 tr { background-color: transparent; }
#kfhjuqdzhe p { margin: 0; padding: 0; }
 #kfhjuqdzhe .gt_table { display: table; border-collapse: collapse; line-height: normal; margin-left: auto; margin-right: auto; color: #333333; font-size: 16px; font-weight: normal; font-style: normal; background-color: #FFFFFF; width: auto; border-top-style: solid; border-top-width: 2px; border-top-color: #A8A8A8; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #A8A8A8; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; }
 #kfhjuqdzhe .gt_caption { padding-top: 4px; padding-bottom: 4px; }
 #kfhjuqdzhe .gt_title { color: #333333; font-size: 125%; font-weight: initial; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; border-bottom-color: #FFFFFF; border-bottom-width: 0; }
 #kfhjuqdzhe .gt_subtitle { color: #333333; font-size: 85%; font-weight: initial; padding-top: 3px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; border-top-color: #FFFFFF; border-top-width: 0; }
 #kfhjuqdzhe .gt_heading { background-color: #FFFFFF; text-align: center; border-bottom-color: #FFFFFF; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #kfhjuqdzhe .gt_bottom_border { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #kfhjuqdzhe .gt_col_headings { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #kfhjuqdzhe .gt_col_heading { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; overflow-x: hidden; }
 #kfhjuqdzhe .gt_column_spanner_outer { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; padding-top: 0; padding-bottom: 0; padding-left: 4px; padding-right: 4px; }
 #kfhjuqdzhe .gt_column_spanner_outer:first-child { padding-left: 0; }
 #kfhjuqdzhe .gt_column_spanner_outer:last-child { padding-right: 0; }
 #kfhjuqdzhe .gt_column_spanner { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; overflow-x: hidden; display: inline-block; width: 100%; }
 #kfhjuqdzhe .gt_spanner_row { border-bottom-style: hidden; }
 #kfhjuqdzhe .gt_group_heading { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; text-align: left; }
 #kfhjuqdzhe .gt_empty_group_heading { padding: 0.5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: middle; }
 #kfhjuqdzhe .gt_from_md> :first-child { margin-top: 0; }
 #kfhjuqdzhe .gt_from_md> :last-child { margin-bottom: 0; }
 #kfhjuqdzhe .gt_row { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; margin: 10px; border-top-style: solid; border-top-width: 1px; border-top-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; overflow-x: hidden; }
 #kfhjuqdzhe .gt_stub { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; }
 #kfhjuqdzhe .gt_stub_row_group { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; vertical-align: top; }
 #kfhjuqdzhe .gt_row_group_first td { border-top-width: 2px; }
 #kfhjuqdzhe .gt_row_group_first th { border-top-width: 2px; }
 #kfhjuqdzhe .gt_striped { background-color: rgba(128,128,128,0.05); }
 #kfhjuqdzhe .gt_table_body { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #kfhjuqdzhe .gt_sourcenotes { color: #333333; background-color: #FFFFFF; border-bottom-style: none; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; }
 #kfhjuqdzhe .gt_sourcenote { font-size: 90%; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; text-align: left; }
 #kfhjuqdzhe .gt_left { text-align: left; }
 #kfhjuqdzhe .gt_center { text-align: center; }
 #kfhjuqdzhe .gt_right { text-align: right; font-variant-numeric: tabular-nums; }
 #kfhjuqdzhe .gt_font_normal { font-weight: normal; }
 #kfhjuqdzhe .gt_font_bold { font-weight: bold; }
 #kfhjuqdzhe .gt_font_italic { font-style: italic; }
 #kfhjuqdzhe .gt_super { font-size: 65%; }
 #kfhjuqdzhe .gt_footnote_marks { font-size: 75%; vertical-align: 0.4em; position: initial; }
 #kfhjuqdzhe .gt_asterisk { font-size: 100%; vertical-align: 0; }
 
</style>
<table class="gt_table" data-quarto-disable-processing="false" data-quarto-bootstrap="false">
<thead>

<tr class="gt_col_headings">
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="1" colspan="1" scope="col" id="Animal">Animal</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="Legs">Legs</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="Plot">Plot</th>
</tr>
</thead>
<tbody class="gt_table_body">
  <tr>
    <td class="gt_row gt_left">Ostrich</td>
    <td class="gt_row gt_right">2</td>
    <td class="gt_row gt_right">2</td>
  </tr>
  <tr>
    <td class="gt_row gt_left">Spider</td>
    <td class="gt_row gt_right">8</td>
    <td class="gt_row gt_right">8</td>
  </tr>
  <tr>
    <td class="gt_row gt_left">Lion</td>
    <td class="gt_row gt_right">4</td>
    <td class="gt_row gt_right">4</td>
  </tr>
</tbody>


</table>

</div>
        
</div>
</div>
<p>Here is the final result:</p>
<div id="3cd364b6" class="cell" data-execution_count="2">
<details class="code-fold">
<summary>Code</summary>
<div class="code-copy-outer-scaffold"><div class="sourceCode cell-code" id="cb1" style="background: #f1f3f5;"><pre class="sourceCode python code-with-copy"><code class="sourceCode python"><span id="cb1-1"><span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">import</span> polars <span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">as</span> pl</span>
<span id="cb1-2"><span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">from</span> great_tables <span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">import</span> GT</span>
<span id="cb1-3"><span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">from</span> svg <span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">import</span> SVG, Rect, Line</span>
<span id="cb1-4"></span>
<span id="cb1-5">df <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> pl.DataFrame({<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Animal"</span>: [<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Ostrich"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Spider"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Lion"</span>], <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Legs"</span>: [<span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">2</span>, <span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">8</span>, <span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">4</span>], <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Plot"</span>: [<span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">2</span>, <span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">8</span>, <span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">4</span>]})</span>
<span id="cb1-6"></span>
<span id="cb1-7">width <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> <span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">50</span></span>
<span id="cb1-8">height <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> <span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">30</span></span>
<span id="cb1-9">max_legs_value <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> df[<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Legs"</span>].<span class="bu" style="color: null;
background-color: null;
font-style: inherit;">max</span>()</span>
<span id="cb1-10"></span>
<span id="cb1-11"></span>
<span id="cb1-12"><span class="kw" style="color: #003B4F;
background-color: null;
font-weight: bold;
font-style: inherit;">def</span> create_plot_svg_py(val: <span class="bu" style="color: null;
background-color: null;
font-style: inherit;">int</span>) <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">-&gt;</span> <span class="bu" style="color: null;
background-color: null;
font-style: inherit;">str</span>:</span>
<span id="cb1-13">    canvas <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> SVG(</span>
<span id="cb1-14">        width<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>width,</span>
<span id="cb1-15">        height<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>height,</span>
<span id="cb1-16">        elements<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>[</span>
<span id="cb1-17">            Rect(</span>
<span id="cb1-18">                x<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">0</span>,</span>
<span id="cb1-19">                y<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>height <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">/</span> <span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">4</span>,</span>
<span id="cb1-20">                width<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>width <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">*</span> (val <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">/</span> max_legs_value),</span>
<span id="cb1-21">                height<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>height <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">/</span> <span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">2</span>,</span>
<span id="cb1-22">                fill<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"blue"</span>,</span>
<span id="cb1-23">            ),</span>
<span id="cb1-24">            Line(x1<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">0</span>, x2<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">0</span>, y1<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">0</span>, y2<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>height, stroke<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"black"</span>),</span>
<span id="cb1-25">        ],</span>
<span id="cb1-26">    )</span>
<span id="cb1-27"></span>
<span id="cb1-28">    html <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> <span class="ss" style="color: #20794D;
background-color: null;
font-style: inherit;">f"&lt;div&gt;</span><span class="sc" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">{</span>canvas<span class="sc" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">}</span><span class="ss" style="color: #20794D;
background-color: null;
font-style: inherit;">&lt;/div&gt;"</span></span>
<span id="cb1-29">    <span class="cf" style="color: #003B4F;
background-color: null;
font-weight: bold;
font-style: inherit;">return</span> html</span>
<span id="cb1-30"></span>
<span id="cb1-31"></span>
<span id="cb1-32">GT(df).fmt(fns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>create_plot_svg_py, columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>[<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Plot"</span>])</span></code></pre></div></div>
</details>
<div class="cell-output cell-output-display" data-execution_count="2">
<div id="iavfvbhnau" style="padding-left:0px;padding-right:0px;padding-top:10px;padding-bottom:10px;overflow-x:auto;overflow-y:auto;width:auto;height:auto;">
<style>
#iavfvbhnau table {
          font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Helvetica Neue', 'Fira Sans', 'Droid Sans', Arial, sans-serif;
          -webkit-font-smoothing: antialiased;
          -moz-osx-font-smoothing: grayscale;
        }

#iavfvbhnau thead, tbody, tfoot, tr, td, th { border-style: none; }
 tr { background-color: transparent; }
#iavfvbhnau p { margin: 0; padding: 0; }
 #iavfvbhnau .gt_table { display: table; border-collapse: collapse; line-height: normal; margin-left: auto; margin-right: auto; color: #333333; font-size: 16px; font-weight: normal; font-style: normal; background-color: #FFFFFF; width: auto; border-top-style: solid; border-top-width: 2px; border-top-color: #A8A8A8; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #A8A8A8; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; }
 #iavfvbhnau .gt_caption { padding-top: 4px; padding-bottom: 4px; }
 #iavfvbhnau .gt_title { color: #333333; font-size: 125%; font-weight: initial; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; border-bottom-color: #FFFFFF; border-bottom-width: 0; }
 #iavfvbhnau .gt_subtitle { color: #333333; font-size: 85%; font-weight: initial; padding-top: 3px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; border-top-color: #FFFFFF; border-top-width: 0; }
 #iavfvbhnau .gt_heading { background-color: #FFFFFF; text-align: center; border-bottom-color: #FFFFFF; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #iavfvbhnau .gt_bottom_border { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #iavfvbhnau .gt_col_headings { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #iavfvbhnau .gt_col_heading { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; overflow-x: hidden; }
 #iavfvbhnau .gt_column_spanner_outer { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; padding-top: 0; padding-bottom: 0; padding-left: 4px; padding-right: 4px; }
 #iavfvbhnau .gt_column_spanner_outer:first-child { padding-left: 0; }
 #iavfvbhnau .gt_column_spanner_outer:last-child { padding-right: 0; }
 #iavfvbhnau .gt_column_spanner { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; overflow-x: hidden; display: inline-block; width: 100%; }
 #iavfvbhnau .gt_spanner_row { border-bottom-style: hidden; }
 #iavfvbhnau .gt_group_heading { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; text-align: left; }
 #iavfvbhnau .gt_empty_group_heading { padding: 0.5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: middle; }
 #iavfvbhnau .gt_from_md> :first-child { margin-top: 0; }
 #iavfvbhnau .gt_from_md> :last-child { margin-bottom: 0; }
 #iavfvbhnau .gt_row { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; margin: 10px; border-top-style: solid; border-top-width: 1px; border-top-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; overflow-x: hidden; }
 #iavfvbhnau .gt_stub { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; }
 #iavfvbhnau .gt_stub_row_group { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; vertical-align: top; }
 #iavfvbhnau .gt_row_group_first td { border-top-width: 2px; }
 #iavfvbhnau .gt_row_group_first th { border-top-width: 2px; }
 #iavfvbhnau .gt_striped { background-color: rgba(128,128,128,0.05); }
 #iavfvbhnau .gt_table_body { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #iavfvbhnau .gt_sourcenotes { color: #333333; background-color: #FFFFFF; border-bottom-style: none; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; }
 #iavfvbhnau .gt_sourcenote { font-size: 90%; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; text-align: left; }
 #iavfvbhnau .gt_left { text-align: left; }
 #iavfvbhnau .gt_center { text-align: center; }
 #iavfvbhnau .gt_right { text-align: right; font-variant-numeric: tabular-nums; }
 #iavfvbhnau .gt_font_normal { font-weight: normal; }
 #iavfvbhnau .gt_font_bold { font-weight: bold; }
 #iavfvbhnau .gt_font_italic { font-style: italic; }
 #iavfvbhnau .gt_super { font-size: 65%; }
 #iavfvbhnau .gt_footnote_marks { font-size: 75%; vertical-align: 0.4em; position: initial; }
 #iavfvbhnau .gt_asterisk { font-size: 100%; vertical-align: 0; }
 
</style>
<table class="gt_table" data-quarto-disable-processing="false" data-quarto-bootstrap="false">
<thead>

<tr class="gt_col_headings">
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="1" colspan="1" scope="col" id="Animal">Animal</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="Legs">Legs</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="Plot">Plot</th>
</tr>
</thead>
<tbody class="gt_table_body">
  <tr>
    <td class="gt_row gt_left">Ostrich</td>
    <td class="gt_row gt_right">2</td>
    <td class="gt_row gt_right"><div><svg xmlns="http://www.w3.org/2000/svg" width="50" height="30"><rect x="0" y="7.5" width="12.5" height="15.0" fill="blue"></rect><line stroke="black" x1="0" y1="0" x2="0" y2="30"></line></svg></div></td>
  </tr>
  <tr>
    <td class="gt_row gt_left">Spider</td>
    <td class="gt_row gt_right">8</td>
    <td class="gt_row gt_right"><div><svg xmlns="http://www.w3.org/2000/svg" width="50" height="30"><rect x="0" y="7.5" width="50.0" height="15.0" fill="blue"></rect><line stroke="black" x1="0" y1="0" x2="0" y2="30"></line></svg></div></td>
  </tr>
  <tr>
    <td class="gt_row gt_left">Lion</td>
    <td class="gt_row gt_right">4</td>
    <td class="gt_row gt_right"><div><svg xmlns="http://www.w3.org/2000/svg" width="50" height="30"><rect x="0" y="7.5" width="25.0" height="15.0" fill="blue"></rect><line stroke="black" x1="0" y1="0" x2="0" y2="30"></line></svg></div></td>
  </tr>
</tbody>


</table>

</div>
        
</div>
</div>
<section id="setup" class="level2">
<h2 class="anchored" data-anchor-id="setup">Setup</h2>
<p>Here is the code to start:</p>
<div id="51e70f52" class="cell" data-execution_count="3">
<div class="code-copy-outer-scaffold"><div class="sourceCode cell-code" id="cb2" style="background: #f1f3f5;"><pre class="sourceCode python code-with-copy"><code class="sourceCode python"><span id="cb2-1"><span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">import</span> polars <span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">as</span> pl</span>
<span id="cb2-2"><span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">from</span> great_tables <span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">import</span> GT</span>
<span id="cb2-3"></span>
<span id="cb2-4">df <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> pl.DataFrame(</span>
<span id="cb2-5">    {</span>
<span id="cb2-6">        <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Animal"</span>: [<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Ostrich"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Spider"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Lion"</span>],</span>
<span id="cb2-7">        <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Legs"</span>: [<span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">2</span>, <span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">8</span>, <span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">4</span>],</span>
<span id="cb2-8">        <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Plot"</span>: [<span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">2</span>, <span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">8</span>, <span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">4</span>],</span>
<span id="cb2-9">    }</span>
<span id="cb2-10">)</span>
<span id="cb2-11"></span>
<span id="cb2-12">gt <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> GT(df)</span></code></pre></div></div>
</div>
</section>
<section id="the-binding-component-gt.fmt" class="level2">
<h2 class="anchored" data-anchor-id="the-binding-component-gt.fmt">The Binding Component: GT.fmt()</h2>
<p>Let’s take advantage of the <a href="https://posit-dev.github.io/great-tables/reference/GT.fmt.html#great_tables.GT.fmt"><code>fmt()</code></a> method to apply a plotting function that formats our row values into plots. To see how we might use <code>fmt()</code>, we first need to define a formatting function to apply to each cell in a column. It will take as input the value in the cell, and should return whatever you want in that cell. Before plotting, let’s imagine we wanted to replace the number with a tally of the number of legs:</p>
<div id="0a33f43c" class="cell" data-execution_count="4">
<div class="code-copy-outer-scaffold"><div class="sourceCode cell-code" id="cb3" style="background: #f1f3f5;"><pre class="sourceCode python code-with-copy"><code class="sourceCode python"><span id="cb3-1"><span class="kw" style="color: #003B4F;
background-color: null;
font-weight: bold;
font-style: inherit;">def</span> create_leg_tally(value: <span class="bu" style="color: null;
background-color: null;
font-style: inherit;">int</span>) <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">-&gt;</span> <span class="bu" style="color: null;
background-color: null;
font-style: inherit;">str</span>:</span>
<span id="cb3-2">    <span class="cf" style="color: #003B4F;
background-color: null;
font-weight: bold;
font-style: inherit;">return</span> <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"|"</span> <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">*</span> value</span>
<span id="cb3-3"></span>
<span id="cb3-4"></span>
<span id="cb3-5">gt.fmt(fns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>create_leg_tally, columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Plot"</span>)</span></code></pre></div></div>
<div class="cell-output cell-output-display" data-execution_count="4">
<div id="kkkrpfztpm" style="padding-left:0px;padding-right:0px;padding-top:10px;padding-bottom:10px;overflow-x:auto;overflow-y:auto;width:auto;height:auto;">
<style>
#kkkrpfztpm table {
          font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Helvetica Neue', 'Fira Sans', 'Droid Sans', Arial, sans-serif;
          -webkit-font-smoothing: antialiased;
          -moz-osx-font-smoothing: grayscale;
        }

#kkkrpfztpm thead, tbody, tfoot, tr, td, th { border-style: none; }
 tr { background-color: transparent; }
#kkkrpfztpm p { margin: 0; padding: 0; }
 #kkkrpfztpm .gt_table { display: table; border-collapse: collapse; line-height: normal; margin-left: auto; margin-right: auto; color: #333333; font-size: 16px; font-weight: normal; font-style: normal; background-color: #FFFFFF; width: auto; border-top-style: solid; border-top-width: 2px; border-top-color: #A8A8A8; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #A8A8A8; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; }
 #kkkrpfztpm .gt_caption { padding-top: 4px; padding-bottom: 4px; }
 #kkkrpfztpm .gt_title { color: #333333; font-size: 125%; font-weight: initial; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; border-bottom-color: #FFFFFF; border-bottom-width: 0; }
 #kkkrpfztpm .gt_subtitle { color: #333333; font-size: 85%; font-weight: initial; padding-top: 3px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; border-top-color: #FFFFFF; border-top-width: 0; }
 #kkkrpfztpm .gt_heading { background-color: #FFFFFF; text-align: center; border-bottom-color: #FFFFFF; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #kkkrpfztpm .gt_bottom_border { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #kkkrpfztpm .gt_col_headings { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #kkkrpfztpm .gt_col_heading { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; overflow-x: hidden; }
 #kkkrpfztpm .gt_column_spanner_outer { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; padding-top: 0; padding-bottom: 0; padding-left: 4px; padding-right: 4px; }
 #kkkrpfztpm .gt_column_spanner_outer:first-child { padding-left: 0; }
 #kkkrpfztpm .gt_column_spanner_outer:last-child { padding-right: 0; }
 #kkkrpfztpm .gt_column_spanner { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; overflow-x: hidden; display: inline-block; width: 100%; }
 #kkkrpfztpm .gt_spanner_row { border-bottom-style: hidden; }
 #kkkrpfztpm .gt_group_heading { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; text-align: left; }
 #kkkrpfztpm .gt_empty_group_heading { padding: 0.5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: middle; }
 #kkkrpfztpm .gt_from_md> :first-child { margin-top: 0; }
 #kkkrpfztpm .gt_from_md> :last-child { margin-bottom: 0; }
 #kkkrpfztpm .gt_row { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; margin: 10px; border-top-style: solid; border-top-width: 1px; border-top-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; overflow-x: hidden; }
 #kkkrpfztpm .gt_stub { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; }
 #kkkrpfztpm .gt_stub_row_group { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; vertical-align: top; }
 #kkkrpfztpm .gt_row_group_first td { border-top-width: 2px; }
 #kkkrpfztpm .gt_row_group_first th { border-top-width: 2px; }
 #kkkrpfztpm .gt_striped { background-color: rgba(128,128,128,0.05); }
 #kkkrpfztpm .gt_table_body { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #kkkrpfztpm .gt_sourcenotes { color: #333333; background-color: #FFFFFF; border-bottom-style: none; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; }
 #kkkrpfztpm .gt_sourcenote { font-size: 90%; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; text-align: left; }
 #kkkrpfztpm .gt_left { text-align: left; }
 #kkkrpfztpm .gt_center { text-align: center; }
 #kkkrpfztpm .gt_right { text-align: right; font-variant-numeric: tabular-nums; }
 #kkkrpfztpm .gt_font_normal { font-weight: normal; }
 #kkkrpfztpm .gt_font_bold { font-weight: bold; }
 #kkkrpfztpm .gt_font_italic { font-style: italic; }
 #kkkrpfztpm .gt_super { font-size: 65%; }
 #kkkrpfztpm .gt_footnote_marks { font-size: 75%; vertical-align: 0.4em; position: initial; }
 #kkkrpfztpm .gt_asterisk { font-size: 100%; vertical-align: 0; }
 
</style>
<table class="gt_table" data-quarto-disable-processing="false" data-quarto-bootstrap="false">
<thead>

<tr class="gt_col_headings">
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="1" colspan="1" scope="col" id="Animal">Animal</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="Legs">Legs</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="Plot">Plot</th>
</tr>
</thead>
<tbody class="gt_table_body">
  <tr>
    <td class="gt_row gt_left">Ostrich</td>
    <td class="gt_row gt_right">2</td>
    <td class="gt_row gt_right">||</td>
  </tr>
  <tr>
    <td class="gt_row gt_left">Spider</td>
    <td class="gt_row gt_right">8</td>
    <td class="gt_row gt_right">||||||||</td>
  </tr>
  <tr>
    <td class="gt_row gt_left">Lion</td>
    <td class="gt_row gt_right">4</td>
    <td class="gt_row gt_right">||||</td>
  </tr>
</tbody>


</table>

</div>
        
</div>
</div>
</section>
<section id="a-lightweight-approach-svg.py" class="level2">
<h2 class="anchored" data-anchor-id="a-lightweight-approach-svg.py">A Lightweight Approach: Svg.py</h2>
<p>Now we can apply that same logic to making our plots. Let’s start with the function that will eventually be passed into <code>fmt()</code>:</p>
<div id="357edb19" class="cell" data-execution_count="5">
<div class="code-copy-outer-scaffold"><div class="sourceCode cell-code" id="cb4" style="background: #f1f3f5;"><pre class="sourceCode python code-with-copy"><code class="sourceCode python"><span id="cb4-1"><span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">from</span> svg <span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">import</span> SVG, Rect, Line</span>
<span id="cb4-2"></span>
<span id="cb4-3">height <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> <span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">30</span></span>
<span id="cb4-4">width <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> <span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">50</span></span>
<span id="cb4-5"></span>
<span id="cb4-6"></span>
<span id="cb4-7"><span class="kw" style="color: #003B4F;
background-color: null;
font-weight: bold;
font-style: inherit;">def</span> create_plot_svg_py(val: <span class="bu" style="color: null;
background-color: null;
font-style: inherit;">int</span>) <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">-&gt;</span> <span class="bu" style="color: null;
background-color: null;
font-style: inherit;">str</span>:</span>
<span id="cb4-8">    canvas <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> SVG(</span>
<span id="cb4-9">        width<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>width,</span>
<span id="cb4-10">        height<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>height,</span>
<span id="cb4-11">        elements<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>[</span>
<span id="cb4-12">            Rect(</span>
<span id="cb4-13">                x<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">0</span>,</span>
<span id="cb4-14">                y<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>height <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">/</span> <span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">4</span>,</span>
<span id="cb4-15">                width<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>width <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">*</span> (val <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">/</span> max_legs_value),</span>
<span id="cb4-16">                height<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>height <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">/</span> <span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">2</span>,</span>
<span id="cb4-17">                fill<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"blue"</span>,</span>
<span id="cb4-18">            ),</span>
<span id="cb4-19">            Line(x1<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">0</span>, x2<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">0</span>, y1<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">0</span>, y2<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>height, stroke<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"black"</span>),</span>
<span id="cb4-20">        ],</span>
<span id="cb4-21">    )</span>
<span id="cb4-22"></span>
<span id="cb4-23">    html <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> <span class="ss" style="color: #20794D;
background-color: null;
font-style: inherit;">f"&lt;div&gt;</span><span class="sc" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">{</span>canvas<span class="sc" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">}</span><span class="ss" style="color: #20794D;
background-color: null;
font-style: inherit;">&lt;/div&gt;"</span></span>
<span id="cb4-24">    <span class="cf" style="color: #003B4F;
background-color: null;
font-weight: bold;
font-style: inherit;">return</span> html</span></code></pre></div></div>
</div>
<p>Here you get to call <code>fmt()</code> to modify the column you want to apply the plotting function to.</p>
<div id="3448de12" class="cell" data-execution_count="6">
<div class="code-copy-outer-scaffold"><div class="sourceCode cell-code" id="cb5" style="background: #f1f3f5;"><pre class="sourceCode python code-with-copy"><code class="sourceCode python"><span id="cb5-1">gt.fmt(fns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>create_plot_svg_py, columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Plot"</span>)</span></code></pre></div></div>
<div class="cell-output cell-output-display" data-execution_count="6">
<div id="onvhrjzrnq" style="padding-left:0px;padding-right:0px;padding-top:10px;padding-bottom:10px;overflow-x:auto;overflow-y:auto;width:auto;height:auto;">
<style>
#onvhrjzrnq table {
          font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Helvetica Neue', 'Fira Sans', 'Droid Sans', Arial, sans-serif;
          -webkit-font-smoothing: antialiased;
          -moz-osx-font-smoothing: grayscale;
        }

#onvhrjzrnq thead, tbody, tfoot, tr, td, th { border-style: none; }
 tr { background-color: transparent; }
#onvhrjzrnq p { margin: 0; padding: 0; }
 #onvhrjzrnq .gt_table { display: table; border-collapse: collapse; line-height: normal; margin-left: auto; margin-right: auto; color: #333333; font-size: 16px; font-weight: normal; font-style: normal; background-color: #FFFFFF; width: auto; border-top-style: solid; border-top-width: 2px; border-top-color: #A8A8A8; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #A8A8A8; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; }
 #onvhrjzrnq .gt_caption { padding-top: 4px; padding-bottom: 4px; }
 #onvhrjzrnq .gt_title { color: #333333; font-size: 125%; font-weight: initial; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; border-bottom-color: #FFFFFF; border-bottom-width: 0; }
 #onvhrjzrnq .gt_subtitle { color: #333333; font-size: 85%; font-weight: initial; padding-top: 3px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; border-top-color: #FFFFFF; border-top-width: 0; }
 #onvhrjzrnq .gt_heading { background-color: #FFFFFF; text-align: center; border-bottom-color: #FFFFFF; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #onvhrjzrnq .gt_bottom_border { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #onvhrjzrnq .gt_col_headings { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #onvhrjzrnq .gt_col_heading { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; overflow-x: hidden; }
 #onvhrjzrnq .gt_column_spanner_outer { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; padding-top: 0; padding-bottom: 0; padding-left: 4px; padding-right: 4px; }
 #onvhrjzrnq .gt_column_spanner_outer:first-child { padding-left: 0; }
 #onvhrjzrnq .gt_column_spanner_outer:last-child { padding-right: 0; }
 #onvhrjzrnq .gt_column_spanner { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; overflow-x: hidden; display: inline-block; width: 100%; }
 #onvhrjzrnq .gt_spanner_row { border-bottom-style: hidden; }
 #onvhrjzrnq .gt_group_heading { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; text-align: left; }
 #onvhrjzrnq .gt_empty_group_heading { padding: 0.5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: middle; }
 #onvhrjzrnq .gt_from_md> :first-child { margin-top: 0; }
 #onvhrjzrnq .gt_from_md> :last-child { margin-bottom: 0; }
 #onvhrjzrnq .gt_row { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; margin: 10px; border-top-style: solid; border-top-width: 1px; border-top-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; overflow-x: hidden; }
 #onvhrjzrnq .gt_stub { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; }
 #onvhrjzrnq .gt_stub_row_group { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; vertical-align: top; }
 #onvhrjzrnq .gt_row_group_first td { border-top-width: 2px; }
 #onvhrjzrnq .gt_row_group_first th { border-top-width: 2px; }
 #onvhrjzrnq .gt_striped { background-color: rgba(128,128,128,0.05); }
 #onvhrjzrnq .gt_table_body { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #onvhrjzrnq .gt_sourcenotes { color: #333333; background-color: #FFFFFF; border-bottom-style: none; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; }
 #onvhrjzrnq .gt_sourcenote { font-size: 90%; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; text-align: left; }
 #onvhrjzrnq .gt_left { text-align: left; }
 #onvhrjzrnq .gt_center { text-align: center; }
 #onvhrjzrnq .gt_right { text-align: right; font-variant-numeric: tabular-nums; }
 #onvhrjzrnq .gt_font_normal { font-weight: normal; }
 #onvhrjzrnq .gt_font_bold { font-weight: bold; }
 #onvhrjzrnq .gt_font_italic { font-style: italic; }
 #onvhrjzrnq .gt_super { font-size: 65%; }
 #onvhrjzrnq .gt_footnote_marks { font-size: 75%; vertical-align: 0.4em; position: initial; }
 #onvhrjzrnq .gt_asterisk { font-size: 100%; vertical-align: 0; }
 
</style>
<table class="gt_table" data-quarto-disable-processing="false" data-quarto-bootstrap="false">
<thead>

<tr class="gt_col_headings">
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="1" colspan="1" scope="col" id="Animal">Animal</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="Legs">Legs</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="Plot">Plot</th>
</tr>
</thead>
<tbody class="gt_table_body">
  <tr>
    <td class="gt_row gt_left">Ostrich</td>
    <td class="gt_row gt_right">2</td>
    <td class="gt_row gt_right"><div><svg xmlns="http://www.w3.org/2000/svg" width="50" height="30"><rect x="0" y="7.5" width="12.5" height="15.0" fill="blue"></rect><line stroke="black" x1="0" y1="0" x2="0" y2="30"></line></svg></div></td>
  </tr>
  <tr>
    <td class="gt_row gt_left">Spider</td>
    <td class="gt_row gt_right">8</td>
    <td class="gt_row gt_right"><div><svg xmlns="http://www.w3.org/2000/svg" width="50" height="30"><rect x="0" y="7.5" width="50.0" height="15.0" fill="blue"></rect><line stroke="black" x1="0" y1="0" x2="0" y2="30"></line></svg></div></td>
  </tr>
  <tr>
    <td class="gt_row gt_left">Lion</td>
    <td class="gt_row gt_right">4</td>
    <td class="gt_row gt_right"><div><svg xmlns="http://www.w3.org/2000/svg" width="50" height="30"><rect x="0" y="7.5" width="25.0" height="15.0" fill="blue"></rect><line stroke="black" x1="0" y1="0" x2="0" y2="30"></line></svg></div></td>
  </tr>
</tbody>


</table>

</div>
        
</div>
</div>
<p>This was very direct, we didn’t have save to a buffer or import heavy duty plotting functions. We built the string with the help of <code>svg.py</code> and were able to insert into the table. See the string below:</p>
<!-- I would really like to wrap the output here, but nothing I've tried has worked -->
<!-- https://github.com/quarto-dev/quarto-cli/discussions/6017 -->
<div id="5fc2d059" class="cell" data-execution_count="7">
<div class="cell-output cell-output-display" data-execution_count="7">
<pre><code>'&lt;div&gt;&lt;svg xmlns="http://www.w3.org/2000/svg" width="50" height="30"&gt;&lt;rect x="0" y="7.5" width="25.0" height="15.0" fill="blue"/&gt;&lt;line stroke="black" x1="0" y1="0" x2="0" y2="30"/&gt;&lt;/svg&gt;&lt;/div&gt;'</code></pre>
</div>
</div>
<p>Even in its outputted form the string is still easily readable, which is another upside of using an SVG generation package.</p>
</section>
<section id="extreme-minimalism-adding-html-directly" class="level2">
<h2 class="anchored" data-anchor-id="extreme-minimalism-adding-html-directly">Extreme Minimalism: Adding HTML directly</h2>
<p>In the previous section, note that <code>svg.py</code> simply generated a string of HTML. You can do the same thing directly.</p>
<div id="3017b47b" class="cell" data-execution_count="8">
<div class="code-copy-outer-scaffold"><div class="sourceCode cell-code" id="cb7" style="background: #f1f3f5;"><pre class="sourceCode python code-with-copy"><code class="sourceCode python"><span id="cb7-1"><span class="kw" style="color: #003B4F;
background-color: null;
font-weight: bold;
font-style: inherit;">def</span> create_plot_html(val: <span class="bu" style="color: null;
background-color: null;
font-style: inherit;">int</span>) <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">-&gt;</span> <span class="bu" style="color: null;
background-color: null;
font-style: inherit;">str</span>:</span>
<span id="cb7-2">    bar_element <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> <span class="ss" style="color: #20794D;
background-color: null;
font-style: inherit;">f"""</span></span>
<span id="cb7-3"><span class="ss" style="color: #20794D;
background-color: null;
font-style: inherit;">    &lt;div style="position: absolute;</span></span>
<span id="cb7-4"><span class="ss" style="color: #20794D;
background-color: null;
font-style: inherit;">                width: </span><span class="sc" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">{</span>width <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">*</span> val <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">/</span> max_legs_value<span class="sc" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">}</span><span class="ss" style="color: #20794D;
background-color: null;
font-style: inherit;">px;</span></span>
<span id="cb7-5"><span class="ss" style="color: #20794D;
background-color: null;
font-style: inherit;">                height: </span><span class="sc" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">{</span>height <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">/</span> <span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">2</span><span class="sc" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">}</span><span class="ss" style="color: #20794D;
background-color: null;
font-style: inherit;">px;</span></span>
<span id="cb7-6"><span class="ss" style="color: #20794D;
background-color: null;
font-style: inherit;">                background-color: purple;</span></span>
<span id="cb7-7"><span class="ss" style="color: #20794D;
background-color: null;
font-style: inherit;">                margin-top: </span><span class="sc" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">{</span>height <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">/</span> <span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">4</span><span class="sc" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">}</span><span class="ss" style="color: #20794D;
background-color: null;
font-style: inherit;">px;</span></span>
<span id="cb7-8"><span class="ss" style="color: #20794D;
background-color: null;
font-style: inherit;">    "&gt;&lt;/div&gt;"""</span></span>
<span id="cb7-9"></span>
<span id="cb7-10">    line_element <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"""</span></span>
<span id="cb7-11"><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">    &lt;div style="position: absolute;</span></span>
<span id="cb7-12"><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">                top: 0;</span></span>
<span id="cb7-13"><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">                bottom: 0;</span></span>
<span id="cb7-14"><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">                width: 1px;</span></span>
<span id="cb7-15"><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">                background-color: black;</span></span>
<span id="cb7-16"><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">    "&gt;&lt;/div&gt;"""</span></span>
<span id="cb7-17"></span>
<span id="cb7-18">    html <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> <span class="ss" style="color: #20794D;
background-color: null;
font-style: inherit;">f"""</span></span>
<span id="cb7-19"><span class="ss" style="color: #20794D;
background-color: null;
font-style: inherit;">    &lt;div style="position: relative; width: </span><span class="sc" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">{</span>width<span class="sc" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">}</span><span class="ss" style="color: #20794D;
background-color: null;
font-style: inherit;">px; height: </span><span class="sc" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">{</span>height<span class="sc" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">}</span><span class="ss" style="color: #20794D;
background-color: null;
font-style: inherit;">px;"&gt;</span></span>
<span id="cb7-20"><span class="ss" style="color: #20794D;
background-color: null;
font-style: inherit;">        </span><span class="sc" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">{</span>bar_element<span class="sc" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">}</span></span>
<span id="cb7-21"><span class="ss" style="color: #20794D;
background-color: null;
font-style: inherit;">        </span><span class="sc" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">{</span>line_element<span class="sc" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">}</span></span>
<span id="cb7-22"><span class="ss" style="color: #20794D;
background-color: null;
font-style: inherit;">    &lt;/div&gt;</span></span>
<span id="cb7-23"><span class="ss" style="color: #20794D;
background-color: null;
font-style: inherit;">    """</span></span>
<span id="cb7-24"></span>
<span id="cb7-25">    <span class="cf" style="color: #003B4F;
background-color: null;
font-weight: bold;
font-style: inherit;">return</span> html</span></code></pre></div></div>
</div>
<p>Now that we’ve defined our <code>create_plot_*</code> formatting function, the call to <code>fmt()</code> is identical to the one above.</p>
<div id="4907e996" class="cell" data-execution_count="9">
<div class="code-copy-outer-scaffold"><div class="sourceCode cell-code" id="cb8" style="background: #f1f3f5;"><pre class="sourceCode python code-with-copy"><code class="sourceCode python"><span id="cb8-1">gt.fmt(fns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>create_plot_html, columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Plot"</span>)</span></code></pre></div></div>
<div class="cell-output cell-output-display" data-execution_count="9">
<div id="gzsdmvisbw" style="padding-left:0px;padding-right:0px;padding-top:10px;padding-bottom:10px;overflow-x:auto;overflow-y:auto;width:auto;height:auto;">
<style>
#gzsdmvisbw table {
          font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Helvetica Neue', 'Fira Sans', 'Droid Sans', Arial, sans-serif;
          -webkit-font-smoothing: antialiased;
          -moz-osx-font-smoothing: grayscale;
        }

#gzsdmvisbw thead, tbody, tfoot, tr, td, th { border-style: none; }
 tr { background-color: transparent; }
#gzsdmvisbw p { margin: 0; padding: 0; }
 #gzsdmvisbw .gt_table { display: table; border-collapse: collapse; line-height: normal; margin-left: auto; margin-right: auto; color: #333333; font-size: 16px; font-weight: normal; font-style: normal; background-color: #FFFFFF; width: auto; border-top-style: solid; border-top-width: 2px; border-top-color: #A8A8A8; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #A8A8A8; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; }
 #gzsdmvisbw .gt_caption { padding-top: 4px; padding-bottom: 4px; }
 #gzsdmvisbw .gt_title { color: #333333; font-size: 125%; font-weight: initial; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; border-bottom-color: #FFFFFF; border-bottom-width: 0; }
 #gzsdmvisbw .gt_subtitle { color: #333333; font-size: 85%; font-weight: initial; padding-top: 3px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; border-top-color: #FFFFFF; border-top-width: 0; }
 #gzsdmvisbw .gt_heading { background-color: #FFFFFF; text-align: center; border-bottom-color: #FFFFFF; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #gzsdmvisbw .gt_bottom_border { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #gzsdmvisbw .gt_col_headings { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #gzsdmvisbw .gt_col_heading { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; overflow-x: hidden; }
 #gzsdmvisbw .gt_column_spanner_outer { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; padding-top: 0; padding-bottom: 0; padding-left: 4px; padding-right: 4px; }
 #gzsdmvisbw .gt_column_spanner_outer:first-child { padding-left: 0; }
 #gzsdmvisbw .gt_column_spanner_outer:last-child { padding-right: 0; }
 #gzsdmvisbw .gt_column_spanner { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; overflow-x: hidden; display: inline-block; width: 100%; }
 #gzsdmvisbw .gt_spanner_row { border-bottom-style: hidden; }
 #gzsdmvisbw .gt_group_heading { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; text-align: left; }
 #gzsdmvisbw .gt_empty_group_heading { padding: 0.5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: middle; }
 #gzsdmvisbw .gt_from_md> :first-child { margin-top: 0; }
 #gzsdmvisbw .gt_from_md> :last-child { margin-bottom: 0; }
 #gzsdmvisbw .gt_row { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; margin: 10px; border-top-style: solid; border-top-width: 1px; border-top-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; overflow-x: hidden; }
 #gzsdmvisbw .gt_stub { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; }
 #gzsdmvisbw .gt_stub_row_group { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; vertical-align: top; }
 #gzsdmvisbw .gt_row_group_first td { border-top-width: 2px; }
 #gzsdmvisbw .gt_row_group_first th { border-top-width: 2px; }
 #gzsdmvisbw .gt_striped { background-color: rgba(128,128,128,0.05); }
 #gzsdmvisbw .gt_table_body { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #gzsdmvisbw .gt_sourcenotes { color: #333333; background-color: #FFFFFF; border-bottom-style: none; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; }
 #gzsdmvisbw .gt_sourcenote { font-size: 90%; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; text-align: left; }
 #gzsdmvisbw .gt_left { text-align: left; }
 #gzsdmvisbw .gt_center { text-align: center; }
 #gzsdmvisbw .gt_right { text-align: right; font-variant-numeric: tabular-nums; }
 #gzsdmvisbw .gt_font_normal { font-weight: normal; }
 #gzsdmvisbw .gt_font_bold { font-weight: bold; }
 #gzsdmvisbw .gt_font_italic { font-style: italic; }
 #gzsdmvisbw .gt_super { font-size: 65%; }
 #gzsdmvisbw .gt_footnote_marks { font-size: 75%; vertical-align: 0.4em; position: initial; }
 #gzsdmvisbw .gt_asterisk { font-size: 100%; vertical-align: 0; }
 
</style>
<table class="gt_table" data-quarto-disable-processing="false" data-quarto-bootstrap="false">
<thead>

<tr class="gt_col_headings">
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="1" colspan="1" scope="col" id="Animal">Animal</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="Legs">Legs</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="Plot">Plot</th>
</tr>
</thead>
<tbody class="gt_table_body">
  <tr>
    <td class="gt_row gt_left">Ostrich</td>
    <td class="gt_row gt_right">2</td>
    <td class="gt_row gt_right">
    <div style="position: relative; width: 50px; height: 30px;">
        
    <div style="position: absolute;
                width: 12.5px;
                height: 15.0px;
                background-color: purple;
                margin-top: 7.5px;
    "></div>
        
    <div style="position: absolute;
                top: 0;
                bottom: 0;
                width: 1px;
                background-color: black;
    "></div>
    </div>
    </td>
  </tr>
  <tr>
    <td class="gt_row gt_left">Spider</td>
    <td class="gt_row gt_right">8</td>
    <td class="gt_row gt_right">
    <div style="position: relative; width: 50px; height: 30px;">
        
    <div style="position: absolute;
                width: 50.0px;
                height: 15.0px;
                background-color: purple;
                margin-top: 7.5px;
    "></div>
        
    <div style="position: absolute;
                top: 0;
                bottom: 0;
                width: 1px;
                background-color: black;
    "></div>
    </div>
    </td>
  </tr>
  <tr>
    <td class="gt_row gt_left">Lion</td>
    <td class="gt_row gt_right">4</td>
    <td class="gt_row gt_right">
    <div style="position: relative; width: 50px; height: 30px;">
        
    <div style="position: absolute;
                width: 25.0px;
                height: 15.0px;
                background-color: purple;
                margin-top: 7.5px;
    "></div>
        
    <div style="position: absolute;
                top: 0;
                bottom: 0;
                width: 1px;
                background-color: black;
    "></div>
    </div>
    </td>
  </tr>
</tbody>


</table>

</div>
        
</div>
</div>
<p>At first glance, encoding HTML in multi-line strings may not be aesthetically pleasing, nor is it particularly more lightweight than <code>svg.py</code>. Still, it provides a good alternative if you are like me and insist on being as close to the output as possible. Separately, I have found the inclusion of text to be simpler with HTML on account of the default text handling behavior that comes along with it.</p>
</section>
<section id="a-comprehensive-package-plotnine" class="level2">
<h2 class="anchored" data-anchor-id="a-comprehensive-package-plotnine">A Comprehensive Package: Plotnine</h2>
<div id="1926c808" class="cell" data-execution_count="10">
<div class="code-copy-outer-scaffold"><div class="sourceCode cell-code" id="cb9" style="background: #f1f3f5;"><pre class="sourceCode python code-with-copy"><code class="sourceCode python"><span id="cb9-1"><span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">from</span> io <span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">import</span> StringIO</span>
<span id="cb9-2"><span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">from</span> plotnine <span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">import</span> (</span>
<span id="cb9-3">    ggplot,</span>
<span id="cb9-4">    aes,</span>
<span id="cb9-5">    coord_flip,</span>
<span id="cb9-6">    geom_col,</span>
<span id="cb9-7">    scale_y_continuous,</span>
<span id="cb9-8">    scale_x_continuous,</span>
<span id="cb9-9">    theme_void,</span>
<span id="cb9-10">    geom_hline,</span>
<span id="cb9-11">)</span>
<span id="cb9-12"></span>
<span id="cb9-13">max_legs_value <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> df[<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Legs"</span>].<span class="bu" style="color: null;
background-color: null;
font-style: inherit;">max</span>()</span>
<span id="cb9-14"></span>
<span id="cb9-15"></span>
<span id="cb9-16"><span class="kw" style="color: #003B4F;
background-color: null;
font-weight: bold;
font-style: inherit;">def</span> create_plot_plotnine(val: <span class="bu" style="color: null;
background-color: null;
font-style: inherit;">int</span>) <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">-&gt;</span> <span class="bu" style="color: null;
background-color: null;
font-style: inherit;">str</span>:</span>
<span id="cb9-17">    plot <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> (</span>
<span id="cb9-18">        ggplot()</span>
<span id="cb9-19">        <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">+</span> aes(x<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">1</span>, y<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>val)</span>
<span id="cb9-20">        <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">+</span> geom_col(width<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="fl" style="color: #AD0000;
background-color: null;
font-style: inherit;">0.5</span>, fill<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"green"</span>, show_legend<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="va" style="color: #111111;
background-color: null;
font-style: inherit;">False</span>)</span>
<span id="cb9-21">        <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">+</span> scale_y_continuous(limits<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>(<span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">0</span>, max_legs_value))</span>
<span id="cb9-22">        <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">+</span> scale_x_continuous(limits<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>(<span class="fl" style="color: #AD0000;
background-color: null;
font-style: inherit;">0.5</span>, <span class="fl" style="color: #AD0000;
background-color: null;
font-style: inherit;">1.5</span>))</span>
<span id="cb9-23">        <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">+</span> coord_flip()</span>
<span id="cb9-24">        <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">+</span> theme_void()</span>
<span id="cb9-25">        <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">+</span> geom_hline(yintercept<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">0</span>)</span>
<span id="cb9-26">    )</span>
<span id="cb9-27"></span>
<span id="cb9-28">    buf <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> StringIO()</span>
<span id="cb9-29">    plot.save(buf, <span class="bu" style="color: null;
background-color: null;
font-style: inherit;">format</span><span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"svg"</span>, width<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="fl" style="color: #AD0000;
background-color: null;
font-style: inherit;">0.5</span>, height<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="fl" style="color: #AD0000;
background-color: null;
font-style: inherit;">0.3</span>, verbose<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="va" style="color: #111111;
background-color: null;
font-style: inherit;">False</span>)</span>
<span id="cb9-30">    svg_content <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> buf.getvalue()</span>
<span id="cb9-31">    buf.close()</span>
<span id="cb9-32"></span>
<span id="cb9-33">    html <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> <span class="ss" style="color: #20794D;
background-color: null;
font-style: inherit;">f"&lt;div&gt;</span><span class="sc" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">{</span>svg_content<span class="sc" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">}</span><span class="ss" style="color: #20794D;
background-color: null;
font-style: inherit;">&lt;/div&gt;"</span></span>
<span id="cb9-34">    <span class="cf" style="color: #003B4F;
background-color: null;
font-weight: bold;
font-style: inherit;">return</span> html</span>
<span id="cb9-35"></span>
<span id="cb9-36"></span>
<span id="cb9-37"><span class="co" style="color: #5E5E5E;
background-color: null;
font-style: inherit;"># This might be familiar by now</span></span>
<span id="cb9-38">gt.fmt(fns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>create_plot_plotnine, columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Plot"</span>)</span></code></pre></div></div>
<div class="cell-output cell-output-display" data-execution_count="10">
<div id="xmzneigrnb" style="padding-left:0px;padding-right:0px;padding-top:10px;padding-bottom:10px;overflow-x:auto;overflow-y:auto;width:auto;height:auto;">
<style>
#xmzneigrnb table {
          font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Helvetica Neue', 'Fira Sans', 'Droid Sans', Arial, sans-serif;
          -webkit-font-smoothing: antialiased;
          -moz-osx-font-smoothing: grayscale;
        }

#xmzneigrnb thead, tbody, tfoot, tr, td, th { border-style: none; }
 tr { background-color: transparent; }
#xmzneigrnb p { margin: 0; padding: 0; }
 #xmzneigrnb .gt_table { display: table; border-collapse: collapse; line-height: normal; margin-left: auto; margin-right: auto; color: #333333; font-size: 16px; font-weight: normal; font-style: normal; background-color: #FFFFFF; width: auto; border-top-style: solid; border-top-width: 2px; border-top-color: #A8A8A8; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #A8A8A8; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; }
 #xmzneigrnb .gt_caption { padding-top: 4px; padding-bottom: 4px; }
 #xmzneigrnb .gt_title { color: #333333; font-size: 125%; font-weight: initial; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; border-bottom-color: #FFFFFF; border-bottom-width: 0; }
 #xmzneigrnb .gt_subtitle { color: #333333; font-size: 85%; font-weight: initial; padding-top: 3px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; border-top-color: #FFFFFF; border-top-width: 0; }
 #xmzneigrnb .gt_heading { background-color: #FFFFFF; text-align: center; border-bottom-color: #FFFFFF; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #xmzneigrnb .gt_bottom_border { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #xmzneigrnb .gt_col_headings { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #xmzneigrnb .gt_col_heading { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; overflow-x: hidden; }
 #xmzneigrnb .gt_column_spanner_outer { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; padding-top: 0; padding-bottom: 0; padding-left: 4px; padding-right: 4px; }
 #xmzneigrnb .gt_column_spanner_outer:first-child { padding-left: 0; }
 #xmzneigrnb .gt_column_spanner_outer:last-child { padding-right: 0; }
 #xmzneigrnb .gt_column_spanner { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; overflow-x: hidden; display: inline-block; width: 100%; }
 #xmzneigrnb .gt_spanner_row { border-bottom-style: hidden; }
 #xmzneigrnb .gt_group_heading { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; text-align: left; }
 #xmzneigrnb .gt_empty_group_heading { padding: 0.5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: middle; }
 #xmzneigrnb .gt_from_md> :first-child { margin-top: 0; }
 #xmzneigrnb .gt_from_md> :last-child { margin-bottom: 0; }
 #xmzneigrnb .gt_row { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; margin: 10px; border-top-style: solid; border-top-width: 1px; border-top-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; overflow-x: hidden; }
 #xmzneigrnb .gt_stub { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; }
 #xmzneigrnb .gt_stub_row_group { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; vertical-align: top; }
 #xmzneigrnb .gt_row_group_first td { border-top-width: 2px; }
 #xmzneigrnb .gt_row_group_first th { border-top-width: 2px; }
 #xmzneigrnb .gt_striped { background-color: rgba(128,128,128,0.05); }
 #xmzneigrnb .gt_table_body { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #xmzneigrnb .gt_sourcenotes { color: #333333; background-color: #FFFFFF; border-bottom-style: none; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; }
 #xmzneigrnb .gt_sourcenote { font-size: 90%; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; text-align: left; }
 #xmzneigrnb .gt_left { text-align: left; }
 #xmzneigrnb .gt_center { text-align: center; }
 #xmzneigrnb .gt_right { text-align: right; font-variant-numeric: tabular-nums; }
 #xmzneigrnb .gt_font_normal { font-weight: normal; }
 #xmzneigrnb .gt_font_bold { font-weight: bold; }
 #xmzneigrnb .gt_font_italic { font-style: italic; }
 #xmzneigrnb .gt_super { font-size: 65%; }
 #xmzneigrnb .gt_footnote_marks { font-size: 75%; vertical-align: 0.4em; position: initial; }
 #xmzneigrnb .gt_asterisk { font-size: 100%; vertical-align: 0; }
 
</style>
<table class="gt_table" data-quarto-disable-processing="false" data-quarto-bootstrap="false">
<thead>

<tr class="gt_col_headings">
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="1" colspan="1" scope="col" id="Animal">Animal</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="Legs">Legs</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="Plot">Plot</th>
</tr>
</thead>
<tbody class="gt_table_body">
  <tr>
    <td class="gt_row gt_left">Ostrich</td>
    <td class="gt_row gt_right">2</td>
    <td class="gt_row gt_right"><div><!--?xml version="1.0" encoding="utf-8" standalone="no"?-->

<svg xlink="http://www.w3.org/1999/xlink" width="36pt" height="21.6pt" viewbox="0 0 36 21.6" xmlns="http://www.w3.org/2000/svg" version="1.1">
 <metadata>
  <rdf:rdf xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:cc="http://creativecommons.org/ns#" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#">
   <cc:work>
    <dc:type rdf:resource="http://purl.org/dc/dcmitype/StillImage"></dc:type>
    <dc:date>2025-07-03T14:49:24.228128</dc:date>
    <dc:format>image/svg+xml</dc:format>
    <dc:creator>
     <cc:agent>
      <dc:title>Matplotlib v3.9.2, https://matplotlib.org/</dc:title>
     </cc:agent>
    </dc:creator>
   </cc:work>
  </rdf:rdf>
 </metadata>
 <defs>
  <style type="text/css">*{stroke-linejoin: round; stroke-linecap: butt}</style>
 </defs>
 <g id="figure_1">
  <g id="axes_1">
   <g id="matplotlib.axis_1">
    <g id="xtick_1"></g>
    <g id="xtick_2"></g>
    <g id="xtick_3"></g>
    <g id="xtick_4"></g>
    <g id="xtick_5"></g>
    <g id="xtick_6"></g>
    <g id="xtick_7"></g>
    <g id="xtick_8"></g>
    <g id="xtick_9"></g>
   </g>
   <g id="matplotlib.axis_2">
    <g id="ytick_1"></g>
    <g id="ytick_2"></g>
    <g id="ytick_3"></g>
    <g id="ytick_4"></g>
    <g id="ytick_5"></g>
    <g id="ytick_6"></g>
    <g id="ytick_7"></g>
    <g id="ytick_8"></g>
    <g id="ytick_9"></g>
   </g>
   <g id="PolyCollection_1">
    <path d="M 1.636364 15.709091 
L 1.636364 5.890909 
L 9.818182 5.890909 
L 9.818182 15.709091 
z
" clip-path="url(#p2fed83ef4c)" style="fill: #008000"></path>
   </g>
   <g id="LineCollection_1">
    <path d="M 1.636364 21.6 
L 1.636364 -0 
" clip-path="url(#p2fed83ef4c)" style="fill: none; stroke: #000000; stroke-width: 0.886227"></path>
   </g>
  </g>
 </g>
 <defs>
  <clippath id="p2fed83ef4c">
   <rect x="0" y="0" width="36" height="21.6"></rect>
  </clippath>
 </defs>
</svg>
</div></td>
  </tr>
  <tr>
    <td class="gt_row gt_left">Spider</td>
    <td class="gt_row gt_right">8</td>
    <td class="gt_row gt_right"><div><!--?xml version="1.0" encoding="utf-8" standalone="no"?-->

<svg xlink="http://www.w3.org/1999/xlink" width="36pt" height="21.6pt" viewbox="0 0 36 21.6" xmlns="http://www.w3.org/2000/svg" version="1.1">
 <metadata>
  <rdf:rdf xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:cc="http://creativecommons.org/ns#" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#">
   <cc:work>
    <dc:type rdf:resource="http://purl.org/dc/dcmitype/StillImage"></dc:type>
    <dc:date>2025-07-03T14:49:24.276152</dc:date>
    <dc:format>image/svg+xml</dc:format>
    <dc:creator>
     <cc:agent>
      <dc:title>Matplotlib v3.9.2, https://matplotlib.org/</dc:title>
     </cc:agent>
    </dc:creator>
   </cc:work>
  </rdf:rdf>
 </metadata>
 <defs>
  <style type="text/css">*{stroke-linejoin: round; stroke-linecap: butt}</style>
 </defs>
 <g id="figure_1">
  <g id="axes_1">
   <g id="matplotlib.axis_1">
    <g id="xtick_1"></g>
    <g id="xtick_2"></g>
    <g id="xtick_3"></g>
    <g id="xtick_4"></g>
    <g id="xtick_5"></g>
    <g id="xtick_6"></g>
    <g id="xtick_7"></g>
    <g id="xtick_8"></g>
    <g id="xtick_9"></g>
   </g>
   <g id="matplotlib.axis_2">
    <g id="ytick_1"></g>
    <g id="ytick_2"></g>
    <g id="ytick_3"></g>
    <g id="ytick_4"></g>
    <g id="ytick_5"></g>
    <g id="ytick_6"></g>
    <g id="ytick_7"></g>
    <g id="ytick_8"></g>
    <g id="ytick_9"></g>
   </g>
   <g id="PolyCollection_1">
    <path d="M 1.636364 15.709091 
L 1.636364 5.890909 
L 34.363636 5.890909 
L 34.363636 15.709091 
z
" clip-path="url(#p161195c259)" style="fill: #008000"></path>
   </g>
   <g id="LineCollection_1">
    <path d="M 1.636364 21.6 
L 1.636364 -0 
" clip-path="url(#p161195c259)" style="fill: none; stroke: #000000; stroke-width: 0.886227"></path>
   </g>
  </g>
 </g>
 <defs>
  <clippath id="p161195c259">
   <rect x="0" y="0" width="36" height="21.6"></rect>
  </clippath>
 </defs>
</svg>
</div></td>
  </tr>
  <tr>
    <td class="gt_row gt_left">Lion</td>
    <td class="gt_row gt_right">4</td>
    <td class="gt_row gt_right"><div><!--?xml version="1.0" encoding="utf-8" standalone="no"?-->

<svg xlink="http://www.w3.org/1999/xlink" width="36pt" height="21.6pt" viewbox="0 0 36 21.6" xmlns="http://www.w3.org/2000/svg" version="1.1">
 <metadata>
  <rdf:rdf xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:cc="http://creativecommons.org/ns#" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#">
   <cc:work>
    <dc:type rdf:resource="http://purl.org/dc/dcmitype/StillImage"></dc:type>
    <dc:date>2025-07-03T14:49:24.323284</dc:date>
    <dc:format>image/svg+xml</dc:format>
    <dc:creator>
     <cc:agent>
      <dc:title>Matplotlib v3.9.2, https://matplotlib.org/</dc:title>
     </cc:agent>
    </dc:creator>
   </cc:work>
  </rdf:rdf>
 </metadata>
 <defs>
  <style type="text/css">*{stroke-linejoin: round; stroke-linecap: butt}</style>
 </defs>
 <g id="figure_1">
  <g id="axes_1">
   <g id="matplotlib.axis_1">
    <g id="xtick_1"></g>
    <g id="xtick_2"></g>
    <g id="xtick_3"></g>
    <g id="xtick_4"></g>
    <g id="xtick_5"></g>
    <g id="xtick_6"></g>
    <g id="xtick_7"></g>
    <g id="xtick_8"></g>
    <g id="xtick_9"></g>
   </g>
   <g id="matplotlib.axis_2">
    <g id="ytick_1"></g>
    <g id="ytick_2"></g>
    <g id="ytick_3"></g>
    <g id="ytick_4"></g>
    <g id="ytick_5"></g>
    <g id="ytick_6"></g>
    <g id="ytick_7"></g>
    <g id="ytick_8"></g>
    <g id="ytick_9"></g>
   </g>
   <g id="PolyCollection_1">
    <path d="M 1.636364 15.709091 
L 1.636364 5.890909 
L 18 5.890909 
L 18 15.709091 
z
" clip-path="url(#p37ea60893d)" style="fill: #008000"></path>
   </g>
   <g id="LineCollection_1">
    <path d="M 1.636364 21.6 
L 1.636364 -0 
" clip-path="url(#p37ea60893d)" style="fill: none; stroke: #000000; stroke-width: 0.886227"></path>
   </g>
  </g>
 </g>
 <defs>
  <clippath id="p37ea60893d">
   <rect x="0" y="0" width="36" height="21.6"></rect>
  </clippath>
 </defs>
</svg>
</div></td>
  </tr>
</tbody>


</table>

</div>
        
</div>
</div>
<p>Nice! But that was a sizable chunk of code just to create plots comprised of one bar each. If you’re like me, you’ll find it’s not at all trivial to do, especially without experience using the plotting package.</p>
<p>However, this isn’t the only graphic you might want to have on display – when you come across a use case that necessitates more detailed plots, a comprehensive plotting package like <code>plotnine</code> could very well be your best bet. Imagine we are passing in a list of tuples and want to generate a scatterplot, writing all of those as <code>svg.py</code> elements or direct HTML would be quite cumbersome.</p>
</section>
<section id="conclusion" class="level2">
<h2 class="anchored" data-anchor-id="conclusion">Conclusion</h2>
<p>How you choose to add plots to Great Tables is up to you. In writing graphical plotting functions for <a href="https://posit-dev.github.io/gt-extras/articles/intro.html"><strong>gt-extras</strong></a>, I’ve personally turned towards an HTML-only approach that I’ve felt comfortable with in other settings. With that said, I do believe converting table values to graphic output is a task best done with a little bit of help (whether it be <code>svg-py</code> or another plotting package will depend on how detailed your plots are).</p>
<p>The choice ultimately depends on your specific needs: simplicity and directness, versus abstraction and power. By understanding the trade-offs, you will be able to tailor your approach to the needs of your project.</p>


</section>

 ]]></description>
  <guid>https://posit-dev.github.io/great-tables/blog/plots-in-tables/</guid>
  <pubDate>Thu, 03 Jul 2025 00:00:00 GMT</pubDate>
</item>
<item>
  <title>Great Tables + marimo = Interactive Tables</title>
  <dc:creator>Rich Iannone and Jerry Wu</dc:creator>
  <link>https://posit-dev.github.io/great-tables/blog/marimo-and-great-tables/</link>
  <description><![CDATA[ 




<p>Jerry Wu’s <a href="https://tech.ycwu.space/posts/gt-marimo-in-quarto/20250612.html">recent post</a> demonstrates how Great Tables can be made reactive in a marimo notebook. The post showcases a really nice integration where marimo’s reactive widgets can be embedded directly into Great Tables using the <a href="https://posit-dev.github.io/great-tables/reference/html.html"><span><code>html()</code></span></a> helper function. This effectively creates an interactive table that updates in real-time whenever users interact with the controls.</p>
<section id="interactive-table-demo" class="level2">
<h2 class="anchored" data-anchor-id="interactive-table-demo">Interactive Table Demo</h2>
<p>Here’s a screencast (based on the <a href="https://tech.ycwu.space/posts/gt-marimo-in-quarto/20250612.html">aforementioned post</a>) showing Jerry’s GT table in marimo. It demonstrates how the embedded marimo widgets create reactive effects, allowing you to directly modify the table in real-time.</p>
<div class="quarto-figure quarto-figure-center">
<figure class="figure">
<p><img src="https://posit-dev.github.io/great-tables/blog/marimo-and-great-tables/gt_marimo.gif" class="img-fluid figure-img"></p>
<figcaption>Interactive Great Tables with marimo widgets</figcaption>
</figure>
</div>
<p>The marimo reactive widgets can be embedded into a GT table through the <a href="https://posit-dev.github.io/great-tables/reference/html.html"><span><code>html()</code></span></a> helper function. In Jerry’s example, the table responds to widget changes in the <a href="https://posit-dev.github.io/great-tables/reference/GT.opt_stylize.html"><code>opt_stylize()</code></a> method call, where the <code>.value</code> attributes for all of the widgets are passed in as arguments.</p>
<div class="code-copy-outer-scaffold"><div class="sourceCode" id="cb1" style="background: #f1f3f5;"><pre class="sourceCode python code-with-copy"><code class="sourceCode python"><span id="cb1-1">gt.opt_stylize(</span>
<span id="cb1-2">    style<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>style_widget.value,</span>
<span id="cb1-3">    color<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>color_widget.value,</span>
<span id="cb1-4">    add_row_striping<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>row_striping_widget.value,</span>
<span id="cb1-5">)</span></code></pre></div></div>
</section>
<section id="marimo-showcases-the-integration" class="level2">
<h2 class="anchored" data-anchor-id="marimo-showcases-the-integration">marimo Showcases the Integration</h2>
<p>The marimo team must have seen that post and liked what they saw! They recently released a video showcasing how marimo widgets work with Great Tables to create reactive tables.</p>
<div class="quarto-video ratio ratio-16x9"><iframe data-external="1" src="https://www.youtube.com/embed/09ByveIiXGY" title="" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen=""></iframe></div>
<p>For more details on marimo’s widget system, check out their <a href="https://docs.marimo.io/api/inputs/">UI elements documentation</a> and <a href="https://docs.marimo.io/guides/reactivity/">reactivity guide</a>.</p>
</section>
<section id="marimo-quarto-integration" class="level2">
<h2 class="anchored" data-anchor-id="marimo-quarto-integration">marimo + Quarto Integration</h2>
<p>For those interested in embedding marimo notebooks directly in Quarto documents, the marimo team has also created a <a href="https://github.com/marimo-team/quarto-marimo">quarto-marimo plugin</a>. This extension allows you to run marimo code blocks natively within Quarto documents, making it easy to create interactive content that combines the best of both tools. It’s a very exciting development since we use Quarto extensively (our docs and this very blog post were authored through Quarto!). And naturally there’s a video for this as well.</p>
<div class="quarto-video ratio ratio-16x9"><iframe data-external="1" src="https://www.youtube.com/embed/scuGmtv81S0" title="" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen=""></iframe></div>
</section>
<section id="wrapping-up" class="level2">
<h2 class="anchored" data-anchor-id="wrapping-up">Wrapping Up</h2>
<p>We’re excited by how the marimo team is committed to creating seamless integrations with popular tools like Great Tables and Quarto. We’re also excited to see what new features and integrations they’ll develop next!</p>
<p>Be sure to check out the <a href="https://www.youtube.com/@marimo-team">marimo YouTube channel</a> as they consistently produce high-quality videos that demonstrate the power of reactive notebooks in action.</p>


</section>

 ]]></description>
  <guid>https://posit-dev.github.io/great-tables/blog/marimo-and-great-tables/</guid>
  <pubDate>Tue, 24 Jun 2025 00:00:00 GMT</pubDate>
</item>
<item>
  <title>Great Tables: Becoming the Polars .style Property</title>
  <dc:creator>Michael Chow</dc:creator>
  <link>https://posit-dev.github.io/great-tables/blog/polars-dot-style/</link>
  <description><![CDATA[ 




<p>Roughly a year ago, the DataFrame library Polars made its v1.0.0 release. One neat feature included in the release was a <a href="https://docs.pola.rs/user-guide/misc/styling/"><code>DataFrame.style</code></a> property—which returns a Great Tables object, so you can add things like titles, column labels, and highlighting for reporting.</p>
<p>When talking about the Polars integration, people are often surprised to hear it happened when Great Tables was only 8 months old. Moreover, the whole process of how open source maintainers chat and discuss teaming up can feel shrouded in mystery.</p>
<p>In this post, I want to take some time to discuss how folks in the Polars and Great Tables communities got to <code>DataFrame.style</code>. There are three big pieces:</p>
<ul>
<li><strong>How we got there</strong>: the magic of the Polars discord.</li>
<li><strong>Making <code>.style</code> work</strong>: enabling Great Tables to work as a property.</li>
<li><strong>What’s next?</strong></li>
</ul>
<section id="how-we-got-there" class="level2">
<h2 class="anchored" data-anchor-id="how-we-got-there">How we got there</h2>
<section id="first-contact-polars-discord" class="level3">
<h3 class="anchored" data-anchor-id="first-contact-polars-discord">First contact: Polars discord</h3>
<p>Roughly a year ago, Rich Iannone and I (Michael Chow) started working together on Great Tables—a Python library for creating display tables. Initially, Great Tables only supported Pandas, but this made a few things difficult. For example, selecting columns and applying conditional styles took a surprising amount of code.</p>
<p>As an experiment, we added support for Polars, and wrote a post called <a href="../../blog/polars-styling/index.html">Great Tables: The Polars DataFrame Styler of Your Dreams</a>.</p>
<p>Curious in what folks thought, we dropped it in the Polars discord, and got some Great Feedback:</p>
<p><img src="https://posit-dev.github.io/great-tables/blog/polars-dot-style/discord-feedback.jpg" class="img-fluid" width="500"></p>
<p>But Ritchie Vink, the creator of Polars, knew we were harboring a shameful Pandas dependency secret:</p>
<p><img src="https://posit-dev.github.io/great-tables/blog/polars-dot-style/discord-why-pandas.jpg" class="img-fluid" width="500"></p>
<p>It’s true, we had baked Pandas in as a dependency. We were just kids back then when starting Great Tables. We didn’t realize that the world was moving to DataFrame agnostic support 😓.</p>
<p>But the more we used Polars with Great Tables, the happier we were. So we made some architectural tweaks to make Great Tables <a href="../../blog/bring-your-own-df/index.html">BYODF (Bring Your Own DataFrame)</a>. With these changes, Polars users could install and use Great Tables without pulling in an unnecessary dependency on another DataFrame library (Pandas).</p>
<p>These interactions were critical early on for co-designing Great Tables with Polars in mind. But the real magic for us was when Polars users started opening PRs on Great Tables, to make sure we got things right. Chief among them, Jerry Wu!</p>
</section>
<section id="jerry-wu-power-contributor" class="level3">
<h3 class="anchored" data-anchor-id="jerry-wu-power-contributor">Jerry Wu: power contributor</h3>
<p>Luckily, members of the Polars community, like Jerry Wu <a href="https://github.com/jrycw">(jrycw)</a>, showed up to make sure we wired up to Polars correctly, and to weigh in on how Polars should be used.</p>
<p>For example, Jerry’s first PR was ensuring we handled a Polars deprecation correctly.</p>
<p><img src="https://posit-dev.github.io/great-tables/blog/polars-dot-style/pr-jerry.jpg" class="img-fluid"></p>
<p>I really can’t overstate how much we appreciate his help, and how critical it has been in ensuring we get the details right.</p>
<p>In addition to his PRs, Jerry has done really Great Work sharing about table display. The most interesting example of this to me is that he discovered that Polars, Great Tables, and FastHTML work well together.</p>
<p><img src="https://posit-dev.github.io/great-tables/blog/polars-dot-style/linkedin-jerry.jpg" class="img-fluid" width="500"></p>
<p>Rich and I had no idea that was possible, and the FastHTML folks ended up adapting his example into an <a href="https://fastht.ml/gallery/split_view?category=visualizations&amp;project=great_tables_tables">entry on their gallery</a>. Jerry is constantly teaching us about what Great Tables can do.</p>
</section>
<section id="growing-up-making-the-case-for-.style" class="level3">
<h3 class="anchored" data-anchor-id="growing-up-making-the-case-for-.style">Growing up: making the case for <code>.style</code></h3>
<p>With so much joy coming out of the Polars integration, and support from folks in the Polars community, we started to wonder: how could Great Tables make Polars a first-class citizen?</p>
<p>This ultimately boiled down to asking: what would it take for the <code>polars.DataFrame.style</code> property to return a Great Tables object?</p>
<p>After some discussion on discord, the big pieces folks needed were some sense that Great Tables used a reasonable approach to table styling, carried few dependencies, and was engineered such that it could be returned from a <code>DataFrame.style</code> property. Ultimately, the next few months were spent getting Great Tables up to snuff, and the Polars PR merged.</p>
</section>
</section>
<section id="making-.style-work" class="level2">
<h2 class="anchored" data-anchor-id="making-.style-work">Making <code>.style</code> work</h2>
<p>The <a href="https://github.com/pola-rs/polars/pull/16809">PR to implement <code>.style</code> in Polars</a> went super quick, from advice on discord April to merged by June. A huge force behind the PR was <a href="https://github.com/MarcoGorelli">Marco Gorelli</a>, who encouraged us through the process!</p>
<p>In this section I’ll look at how we addressed the 3 big requirements behind making a strong case for <code>.DataFrame.style</code> returning a Great Tables object:</p>
<ul>
<li><strong>Design Credibility</strong>: It’s clear Great Tables is reasonably thought out.</li>
<li><strong>Working with Polars selectors</strong>: It integrates well with pieces like Polars selectors.</li>
<li><strong>Technical</strong>: Great Tables can be returned from a <code>DataFrame.style</code> property.</li>
</ul>
<section id="design-credibility" class="level3">
<h3 class="anchored" data-anchor-id="design-credibility">Design credibility</h3>
<p>Our biggest hurdle was that the Great Tables library was less than a year old. However, this youthful appearance is a bit misleading, because Great Tables builds on decades of table design and tooling. For example, Rich’s version of Great Tables in R, called <code>gt</code>, has been around since 2019 (see <a href="https://youtu.be/h1KAjSfSbmk">his rstudio::conf() talk</a>).</p>
<p>My favorite aspect of <code>gt</code> is that the community ran <strong>table contests</strong> every year. The contests don’t even require the use of <code>gt</code> or Great Tables, just a zest for the art of table styling. The <a href="https://posit.co/blog/2024-table-contest-winners/">2024 Table Contest</a> had around <strong>60 submissions</strong>, and is something we often draw on for inspiration.</p>
<p>For more on the long history of table design, see <a href="https://posit-dev.github.io/great-tables/blog/design-philosophy/">The Design Philosophy of Great Tables</a>, or this <a href="https://hutchdatascience.org/better_tables/">Fred Hutch better tables workshop</a>.</p>
</section>
<section id="working-with-polars-selectors" class="level3">
<h3 class="anchored" data-anchor-id="working-with-polars-selectors">Working with Polars selectors</h3>
<p>One important task was <strong>sorting out how we use Polars selectors</strong>, to ensure they didn’t break down the road.</p>
<p>For example, Great Tables allows Polars selectors to set styles on specific columns data. However, one challenge we ran into was figuring out what Polars considers an expression versus a selector. Essentially, selectors choose columns, but expressions represent operations on the data itself.</p>
<p>The code below shows cases where the <code>.exclude()</code> results in expressions or selectors.</p>
<div id="574a224d" class="cell" data-execution_count="1">
<div class="code-copy-outer-scaffold"><div class="sourceCode cell-code" id="cb1" style="background: #f1f3f5;"><pre class="sourceCode python code-with-copy"><code class="sourceCode python"><span id="cb1-1"><span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">import</span> polars <span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">as</span> pl</span>
<span id="cb1-2"><span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">import</span> polars.selectors <span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">as</span> cs</span>
<span id="cb1-3"></span>
<span id="cb1-4"><span class="co" style="color: #5E5E5E;
background-color: null;
font-style: inherit;"># selector: all columns except "a"</span></span>
<span id="cb1-5">cs.exclude(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"a"</span>)</span>
<span id="cb1-6"></span>
<span id="cb1-7"><span class="co" style="color: #5E5E5E;
background-color: null;
font-style: inherit;"># expression: same columns as above ¯\_(ツ)_/¯</span></span>
<span id="cb1-8">cs.<span class="bu" style="color: null;
background-color: null;
font-style: inherit;">all</span>().exclude(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"a"</span>)</span></code></pre></div></div>
</div>
<p>After discussing with Polars folks <a href="https://github.com/pola-rs/polars/issues/16448">in this Polars issue</a>, we landed on <strong>4 rules for selectors</strong>:</p>
<table class="caption-top table">
<colgroup>
<col style="width: 23%">
<col style="width: 46%">
<col style="width: 30%">
</colgroup>
<thead>
<tr class="header">
<th>rule</th>
<th>description</th>
<th>example</th>
</tr>
</thead>
<tbody>
<tr class="odd">
<td><code>cs</code> functions</td>
<td>top-level <code>cs</code> selection functions -&gt; <strong>selector</strong></td>
<td><code>cs.starts_with("a")</code></td>
</tr>
<tr class="even">
<td>infix selectors</td>
<td>infix operators over all selectors -&gt; <strong>selector</strong></td>
<td><code>cs.starts_with("a") - cs.by_name("abc")</code></td>
</tr>
<tr class="odd">
<td>infix expressions</td>
<td>infix operators over any non-selectors -&gt; <strong>expression</strong></td>
<td><code>cs.starts_with("a") - "abc"</code></td>
</tr>
<tr class="even">
<td>method expressions</td>
<td>method calls off selectors -&gt; <strong>expression</strong></td>
<td><code>cs.all().exclude("a")</code></td>
</tr>
</tbody>
</table>
<p>Clarifying this was critical in Great Tables, because in some place we only accept selectors, so we needed to be able to articulate to users how to produce them.</p>
</section>
<section id="technical-wiring-work" class="level3">
<h3 class="anchored" data-anchor-id="technical-wiring-work">Technical wiring work</h3>
<p>The last hurdle was tweaking the <a href="../../reference/GT.html#great_tables.GT" title="0"><code>great_tables.GT</code></a> class to fit the flow of <code>DataFrame.style</code>. For example, here is what creating a <a href="../../reference/GT.html#great_tables.GT" title="0"><code>GT()</code></a> object looked like before and after <code>.style</code>:</p>
<ul>
<li>Before: <code>GT(my_data, id="my-table")</code></li>
<li>After: <code>my_data.style.with_id("my-table")</code></li>
</ul>
<p>Notice that before, the <code>GT(id=...)</code> argument could set the html id for a table. However, <code>DataFrame.style</code> is a property that can’t take arguments, so we needed methods like <code>with_id()</code> to set these kinds of options.</p>
<p>Here’s a full code example, in case you want to see it in action.</p>
<div id="85cfa76b" class="cell" data-execution_count="2">
<div class="code-copy-outer-scaffold"><div class="sourceCode cell-code" id="cb2" style="background: #f1f3f5;"><pre class="sourceCode python code-with-copy"><code class="sourceCode python"><span id="cb2-1"><span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">import</span> polars <span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">as</span> pl</span>
<span id="cb2-2"><span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">from</span> great_tables <span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">import</span> GT</span>
<span id="cb2-3"><span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">from</span> great_tables <span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">import</span> exibble</span>
<span id="cb2-4"></span>
<span id="cb2-5"><span class="co" style="color: #5E5E5E;
background-color: null;
font-style: inherit;"># create a GT object ----</span></span>
<span id="cb2-6">GT(exibble, <span class="bu" style="color: null;
background-color: null;
font-style: inherit;">id</span><span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"my-table"</span>)</span>
<span id="cb2-7"></span>
<span id="cb2-8"><span class="co" style="color: #5E5E5E;
background-color: null;
font-style: inherit;"># create GT object via .style property ----</span></span>
<span id="cb2-9">pl.DataFrame(exibble).style</span></code></pre></div></div>
<div class="cell-output cell-output-display" data-execution_count="2">
<div id="lanxnpktup" style="padding-left:0px;padding-right:0px;padding-top:10px;padding-bottom:10px;overflow-x:auto;overflow-y:auto;width:auto;height:auto;">
<style>
#lanxnpktup table {
          font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Helvetica Neue', 'Fira Sans', 'Droid Sans', Arial, sans-serif;
          -webkit-font-smoothing: antialiased;
          -moz-osx-font-smoothing: grayscale;
        }

#lanxnpktup thead, tbody, tfoot, tr, td, th { border-style: none; }
 tr { background-color: transparent; }
#lanxnpktup p { margin: 0; padding: 0; }
 #lanxnpktup .gt_table { display: table; border-collapse: collapse; line-height: normal; margin-left: auto; margin-right: auto; color: #333333; font-size: 16px; font-weight: normal; font-style: normal; background-color: #FFFFFF; width: auto; border-top-style: solid; border-top-width: 2px; border-top-color: #A8A8A8; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #A8A8A8; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; }
 #lanxnpktup .gt_caption { padding-top: 4px; padding-bottom: 4px; }
 #lanxnpktup .gt_title { color: #333333; font-size: 125%; font-weight: initial; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; border-bottom-color: #FFFFFF; border-bottom-width: 0; }
 #lanxnpktup .gt_subtitle { color: #333333; font-size: 85%; font-weight: initial; padding-top: 3px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; border-top-color: #FFFFFF; border-top-width: 0; }
 #lanxnpktup .gt_heading { background-color: #FFFFFF; text-align: center; border-bottom-color: #FFFFFF; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #lanxnpktup .gt_bottom_border { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #lanxnpktup .gt_col_headings { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #lanxnpktup .gt_col_heading { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; overflow-x: hidden; }
 #lanxnpktup .gt_column_spanner_outer { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; padding-top: 0; padding-bottom: 0; padding-left: 4px; padding-right: 4px; }
 #lanxnpktup .gt_column_spanner_outer:first-child { padding-left: 0; }
 #lanxnpktup .gt_column_spanner_outer:last-child { padding-right: 0; }
 #lanxnpktup .gt_column_spanner { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; overflow-x: hidden; display: inline-block; width: 100%; }
 #lanxnpktup .gt_spanner_row { border-bottom-style: hidden; }
 #lanxnpktup .gt_group_heading { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; text-align: left; }
 #lanxnpktup .gt_empty_group_heading { padding: 0.5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: middle; }
 #lanxnpktup .gt_from_md> :first-child { margin-top: 0; }
 #lanxnpktup .gt_from_md> :last-child { margin-bottom: 0; }
 #lanxnpktup .gt_row { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; margin: 10px; border-top-style: solid; border-top-width: 1px; border-top-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; overflow-x: hidden; }
 #lanxnpktup .gt_stub { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; }
 #lanxnpktup .gt_stub_row_group { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; vertical-align: top; }
 #lanxnpktup .gt_row_group_first td { border-top-width: 2px; }
 #lanxnpktup .gt_row_group_first th { border-top-width: 2px; }
 #lanxnpktup .gt_striped { color: #333333; background-color: #F4F4F4; }
 #lanxnpktup .gt_table_body { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #lanxnpktup .gt_grand_summary_row { color: #333333; background-color: #FFFFFF; text-transform: inherit; padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; }
 #lanxnpktup .gt_first_grand_summary_row_bottom { border-top-style: double; border-top-width: 6px; border-top-color: #D3D3D3; }
 #lanxnpktup .gt_last_grand_summary_row_top { border-bottom-style: double; border-bottom-width: 6px; border-bottom-color: #D3D3D3; }
 #lanxnpktup .gt_sourcenotes { color: #333333; background-color: #FFFFFF; border-bottom-style: none; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; }
 #lanxnpktup .gt_sourcenote { font-size: 90%; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; text-align: left; }
 #lanxnpktup .gt_left { text-align: left; }
 #lanxnpktup .gt_center { text-align: center; }
 #lanxnpktup .gt_right { text-align: right; font-variant-numeric: tabular-nums; }
 #lanxnpktup .gt_font_normal { font-weight: normal; }
 #lanxnpktup .gt_font_bold { font-weight: bold; }
 #lanxnpktup .gt_font_italic { font-style: italic; }
 #lanxnpktup .gt_super { font-size: 65%; }
 #lanxnpktup .gt_footnote_marks { font-size: 75%; vertical-align: 0.4em; position: initial; }
 #lanxnpktup .gt_asterisk { font-size: 100%; vertical-align: 0; }
 
</style>
<table class="gt_table" data-quarto-disable-processing="false" data-quarto-bootstrap="false">
<thead>

<tr class="gt_col_headings">
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="num">num</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="1" colspan="1" scope="col" id="char">char</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="1" colspan="1" scope="col" id="fctr">fctr</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="1" colspan="1" scope="col" id="date">date</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="1" colspan="1" scope="col" id="time">time</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="1" colspan="1" scope="col" id="datetime">datetime</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="currency">currency</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="1" colspan="1" scope="col" id="row">row</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="1" colspan="1" scope="col" id="group">group</th>
</tr>
</thead>
<tbody class="gt_table_body">
  <tr>
    <td class="gt_row gt_right">0.1111</td>
    <td class="gt_row gt_left">apricot</td>
    <td class="gt_row gt_left">one</td>
    <td class="gt_row gt_left">2015-01-15</td>
    <td class="gt_row gt_left">13:35</td>
    <td class="gt_row gt_left">2018-01-01 02:22</td>
    <td class="gt_row gt_right">49.95</td>
    <td class="gt_row gt_left">row_1</td>
    <td class="gt_row gt_left">grp_a</td>
  </tr>
  <tr>
    <td class="gt_row gt_right">2.222</td>
    <td class="gt_row gt_left">banana</td>
    <td class="gt_row gt_left">two</td>
    <td class="gt_row gt_left">2015-02-15</td>
    <td class="gt_row gt_left">14:40</td>
    <td class="gt_row gt_left">2018-02-02 14:33</td>
    <td class="gt_row gt_right">17.95</td>
    <td class="gt_row gt_left">row_2</td>
    <td class="gt_row gt_left">grp_a</td>
  </tr>
  <tr>
    <td class="gt_row gt_right">33.33</td>
    <td class="gt_row gt_left">coconut</td>
    <td class="gt_row gt_left">three</td>
    <td class="gt_row gt_left">2015-03-15</td>
    <td class="gt_row gt_left">15:45</td>
    <td class="gt_row gt_left">2018-03-03 03:44</td>
    <td class="gt_row gt_right">1.39</td>
    <td class="gt_row gt_left">row_3</td>
    <td class="gt_row gt_left">grp_a</td>
  </tr>
  <tr>
    <td class="gt_row gt_right">444.4</td>
    <td class="gt_row gt_left">durian</td>
    <td class="gt_row gt_left">four</td>
    <td class="gt_row gt_left">2015-04-15</td>
    <td class="gt_row gt_left">16:50</td>
    <td class="gt_row gt_left">2018-04-04 15:55</td>
    <td class="gt_row gt_right">65100.0</td>
    <td class="gt_row gt_left">row_4</td>
    <td class="gt_row gt_left">grp_a</td>
  </tr>
  <tr>
    <td class="gt_row gt_right">5550.0</td>
    <td class="gt_row gt_left">None</td>
    <td class="gt_row gt_left">five</td>
    <td class="gt_row gt_left">2015-05-15</td>
    <td class="gt_row gt_left">17:55</td>
    <td class="gt_row gt_left">2018-05-05 04:00</td>
    <td class="gt_row gt_right">1325.81</td>
    <td class="gt_row gt_left">row_5</td>
    <td class="gt_row gt_left">grp_b</td>
  </tr>
  <tr>
    <td class="gt_row gt_right">None</td>
    <td class="gt_row gt_left">fig</td>
    <td class="gt_row gt_left">six</td>
    <td class="gt_row gt_left">2015-06-15</td>
    <td class="gt_row gt_left">None</td>
    <td class="gt_row gt_left">2018-06-06 16:11</td>
    <td class="gt_row gt_right">13.255</td>
    <td class="gt_row gt_left">row_6</td>
    <td class="gt_row gt_left">grp_b</td>
  </tr>
  <tr>
    <td class="gt_row gt_right">777000.0</td>
    <td class="gt_row gt_left">grapefruit</td>
    <td class="gt_row gt_left">seven</td>
    <td class="gt_row gt_left">None</td>
    <td class="gt_row gt_left">19:10</td>
    <td class="gt_row gt_left">2018-07-07 05:22</td>
    <td class="gt_row gt_right">None</td>
    <td class="gt_row gt_left">row_7</td>
    <td class="gt_row gt_left">grp_b</td>
  </tr>
  <tr>
    <td class="gt_row gt_right">8880000.0</td>
    <td class="gt_row gt_left">honeydew</td>
    <td class="gt_row gt_left">eight</td>
    <td class="gt_row gt_left">2015-08-15</td>
    <td class="gt_row gt_left">20:20</td>
    <td class="gt_row gt_left">None</td>
    <td class="gt_row gt_right">0.44</td>
    <td class="gt_row gt_left">row_8</td>
    <td class="gt_row gt_left">grp_b</td>
  </tr>
</tbody>


</table>

</div>
</div>
</div>
<p>The <code>DataFrame.style</code> property is special, in that you don’t pass any parameters to it. The motivation for this in Polars is that it matches the Pandas <code>pandas.DataFrame.style</code> approach, so provides a familiar interface for users coming from that package. It also matches the <code>DataFrame.plot</code> flow of both packages.</p>
<p>As it turns out, allowing every options settable in the <a href="../../reference/GT.html#great_tables.GT" title="0"><code>GT()</code></a> constructor to be set somewhere else was not something anticipated in the design of Great Tables. But after some light architectural wrestling, we introduced <code>.tab_stub()</code>, <code>.with_id()</code>, and <code>.with_locale()</code> to capture arguments you might pass to <a href="../../reference/GT.html#great_tables.GT" title="0"><code>GT()</code></a>.</p>
</section>
</section>
<section id="whats-next" class="level2">
<h2 class="anchored" data-anchor-id="whats-next">What’s next?</h2>
<p>Currently, we’re really excited about using Great Tables in different ways!</p>
<ul>
<li><a href="https://github.com/posit-dev/pointblank">Pointblank</a>: validate your DataFrames and database tables. Pointblank is quick to fire up and produces delightfully styled reports (using Great Tables 😎).</li>
<li><a href="https://github.com/machow/reactable-py">reactable</a>: create interactive tables. We want to use reactable to render a Great Tables object interactively.</li>
</ul>
<p>We’re also focused on keeping bug fixes and features cooking in Great Tables. If there’s anything in particular you’re looking for, definitely reach out on the <a href="https://github.com/posit-dev/great-tables/discussions">Great Tables discussion page</a>.</p>
</section>
<section id="in-conclusion" class="level2">
<h2 class="anchored" data-anchor-id="in-conclusion">In conclusion</h2>
<p>This post looked at how interacting with the Polars community discord shaped Great Tables development early on, and how community members like Jerry ended up ensuring Great Tables and Polars played well together. We ended up putting a ring on it, and ensuring Great Tables design, dependencies, and architecture worked well enough to justify returning via <code>polars.DataFrame.style</code>. (Though this is still marked unstable in Polars!)</p>
<p>We’re excited to look at different use cases for Great Tables (and table styling in general) over the next year!</p>


</section>

 ]]></description>
  <guid>https://posit-dev.github.io/great-tables/blog/polars-dot-style/</guid>
  <pubDate>Wed, 16 Apr 2025 00:00:00 GMT</pubDate>
</item>
<item>
  <title>How We Used Great Tables to Supercharge Reporting in Pointblank</title>
  <dc:creator>Rich Iannone</dc:creator>
  <link>https://posit-dev.github.io/great-tables/blog/pointblank-intro/</link>
  <description><![CDATA[ 




<p>The Great Tables package allows you to make tables, and they’re really great when part of a report, a book, or a web page. The API is meant to be easy to work with so DataFrames could be made into publication-quality tables without a lot of hassle. And having nice-looking tables in the mix elevates the quality of the medium you’re working in.</p>
<p>We were inspired by this and decided to explore what it could mean to introduce a package where reporting is largely in the form of beautiful tables. To this end, we started work on a new Python package that generates tables (c/o Great Tables) as reporting objects. This package is called <a href="https://github.com/posit-dev/pointblank">Pointblank</a>, its focus is that of data validation, and the reporting tables it can produce informs users on the results of a data validation workflow. In this post we’ll go through how Pointblank:</p>
<ul>
<li>enables you to validate many types of DataFrames and SQL databases</li>
<li>provides easy-to-understand validation result tables and thorough drilldowns</li>
<li>gives you nice previews of data tables across a range of backends</li>
</ul>
<section id="validating-data-with-pointblank" class="level3">
<h3 class="anchored" data-anchor-id="validating-data-with-pointblank">Validating data with Pointblank</h3>
<p>Just like Great Tables, Pointblank’s primary input is a table and the goal of that library is to perform checks of the tabular data. Other libraries in this domain include <a href="https://github.com/great-expectations/great_expectations">Great Expectations</a>, <a href="https://github.com/unionai-oss/pandera">pandera</a>, <a href="https://github.com/sodadata/soda-core?tab=readme-ov-file">Soda</a>, and <a href="https://github.com/awslabs/python-deequ">PyDeequ</a>.</p>
<p>Below is the main validation report table that users are likely to see quite often. Each row is a validation step, with columns reporting details about each step and their results.</p>
<div id="efbea43e" class="cell" data-execution_count="1">
<details class="code-fold">
<summary>Show the code</summary>
<div class="code-copy-outer-scaffold"><div class="sourceCode cell-code" id="cb1" style="background: #f1f3f5;"><pre class="sourceCode python code-with-copy"><code class="sourceCode python"><span id="cb1-1"><span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">import</span> pointblank <span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">as</span> pb</span>
<span id="cb1-2"></span>
<span id="cb1-3">validation <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> (</span>
<span id="cb1-4">    pb.Validate(</span>
<span id="cb1-5">        data<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>pb.load_dataset(dataset<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"small_table"</span>, tbl_type<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"polars"</span>),</span>
<span id="cb1-6">        label<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"An example validation"</span>,</span>
<span id="cb1-7">        thresholds<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>(<span class="fl" style="color: #AD0000;
background-color: null;
font-style: inherit;">0.1</span>, <span class="fl" style="color: #AD0000;
background-color: null;
font-style: inherit;">0.2</span>, <span class="fl" style="color: #AD0000;
background-color: null;
font-style: inherit;">0.5</span>),</span>
<span id="cb1-8">    )</span>
<span id="cb1-9">    .col_vals_gt(columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"d"</span>, value<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">1000</span>)</span>
<span id="cb1-10">    .col_vals_le(columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"c"</span>, value<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">5</span>)</span>
<span id="cb1-11">    .col_exists(columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>[<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"date"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"date_time"</span>])</span>
<span id="cb1-12">    .interrogate()</span>
<span id="cb1-13">)</span>
<span id="cb1-14"></span>
<span id="cb1-15">validation</span></code></pre></div></div>
</details>
<div class="cell-output cell-output-display" data-execution_count="25">
<div id="pb_tbl" style="padding-left:0px;padding-right:0px;padding-top:10px;padding-bottom:10px;overflow-x:auto;overflow-y:auto;width:auto;height:auto;">
<style>
@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans&display=swap');
@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Mono&display=swap');
#pb_tbl table {
          font-family: 'IBM Plex Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Helvetica Neue', 'Fira Sans', 'Droid Sans', Arial, sans-serif;
          -webkit-font-smoothing: antialiased;
          -moz-osx-font-smoothing: grayscale;
        }

#pb_tbl thead, tbody, tfoot, tr, td, th { border-style: none; }
 tr { background-color: transparent; }
#pb_tbl p { margin: 0; padding: 0; }
 #pb_tbl .gt_table { display: table; border-collapse: collapse; line-height: normal; margin-left: auto; margin-right: auto; color: #333333; font-size: 90%; font-weight: normal; font-style: normal; background-color: #FFFFFF; width: auto; border-top-style: solid; border-top-width: 2px; border-top-color: #A8A8A8; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #A8A8A8; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; }
 #pb_tbl .gt_caption { padding-top: 4px; padding-bottom: 4px; }
 #pb_tbl .gt_title { color: #333333; font-size: 125%; font-weight: initial; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; border-bottom-color: #FFFFFF; border-bottom-width: 0; }
 #pb_tbl .gt_subtitle { color: #333333; font-size: 85%; font-weight: initial; padding-top: 3px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; border-top-color: #FFFFFF; border-top-width: 0; }
 #pb_tbl .gt_heading { background-color: #FFFFFF; text-align: left; border-bottom-color: #FFFFFF; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #pb_tbl .gt_bottom_border { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #pb_tbl .gt_col_headings { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #pb_tbl .gt_col_heading { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; overflow-x: hidden; }
 #pb_tbl .gt_column_spanner_outer { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; padding-top: 0; padding-bottom: 0; padding-left: 4px; padding-right: 4px; }
 #pb_tbl .gt_column_spanner_outer:first-child { padding-left: 0; }
 #pb_tbl .gt_column_spanner_outer:last-child { padding-right: 0; }
 #pb_tbl .gt_column_spanner { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; overflow-x: hidden; display: inline-block; width: 100%; }
 #pb_tbl .gt_spanner_row { border-bottom-style: hidden; }
 #pb_tbl .gt_group_heading { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; text-align: left; }
 #pb_tbl .gt_empty_group_heading { padding: 0.5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: middle; }
 #pb_tbl .gt_from_md> :first-child { margin-top: 0; }
 #pb_tbl .gt_from_md> :last-child { margin-bottom: 0; }
 #pb_tbl .gt_row { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; margin: 10px; border-top-style: solid; border-top-width: 1px; border-top-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; overflow-x: hidden; }
 #pb_tbl .gt_stub { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; }
 #pb_tbl .gt_stub_row_group { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; vertical-align: top; }
 #pb_tbl .gt_row_group_first td { border-top-width: 2px; }
 #pb_tbl .gt_row_group_first th { border-top-width: 2px; }
 #pb_tbl .gt_striped { background-color: rgba(128,128,128,0.05); }
 #pb_tbl .gt_table_body { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #pb_tbl .gt_sourcenotes { color: #333333; background-color: #FFFFFF; border-bottom-style: none; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; }
 #pb_tbl .gt_sourcenote { font-size: 90%; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; text-align: left; }
 #pb_tbl .gt_left { text-align: left; }
 #pb_tbl .gt_center { text-align: center; }
 #pb_tbl .gt_right { text-align: right; font-variant-numeric: tabular-nums; }
 #pb_tbl .gt_font_normal { font-weight: normal; }
 #pb_tbl .gt_font_bold { font-weight: bold; }
 #pb_tbl .gt_font_italic { font-style: italic; }
 #pb_tbl .gt_super { font-size: 65%; }
 #pb_tbl .gt_footnote_marks { font-size: 75%; vertical-align: 0.4em; position: initial; }
 #pb_tbl .gt_asterisk { font-size: 100%; vertical-align: 0; }
 
</style>
<table style="table-layout: fixed;; width: 0px" class="gt_table" data-quarto-disable-processing="false" data-quarto-bootstrap="false">
<colgroup>
  <col style="width:4px;">
  <col style="width:35px;">
  <col style="width:190px;">
  <col style="width:120px;">
  <col style="width:120px;">
  <col style="width:50px;">
  <col style="width:50px;">
  <col style="width:60px;">
  <col style="width:60px;">
  <col style="width:60px;">
  <col style="width:30px;">
  <col style="width:30px;">
  <col style="width:30px;">
  <col style="width:65px;">
</colgroup>

<thead>

  <tr class="gt_heading">
    <td colspan="14" class="gt_heading gt_title gt_font_normal" style="color: #444444;font-size: 28px;text-align: left;font-weight: bold;">Pointblank Validation</td>
  </tr>
  <tr class="gt_heading">
    <td colspan="14" class="gt_heading gt_subtitle gt_font_normal gt_bottom_border"><div><span style="text-decoration-style: solid; text-decoration-color: #ADD8E6; text-decoration-line: underline; text-underline-position: under; color: #333333; font-variant-numeric: tabular-nums; padding-left: 4px; margin-right: 5px; padding-right: 2px;">An example validation</span><div style="padding-top: 10px; padding-bottom: 5px;"><span style="background-color: #0075FF; color: #FFFFFF; padding: 0.5em 0.5em; position: inherit; text-transform: uppercase; margin: 5px 10px 5px 0px; border: solid 1px #0075FF; font-weight: bold; padding: 2px 10px 2px 10px; font-size: smaller;">Polars</span><span><span style="background-color: #E5AB00; color: white; padding: 0.5em 0.5em; position: inherit; text-transform: uppercase; margin: 5px 0px 5px 5px; border: solid 1px #E5AB00; font-weight: bold; padding: 2px 15px 2px 15px; font-size: smaller;">WARN</span><span style="background-color: none; color: #333333; padding: 0.5em 0.5em; position: inherit; margin: 5px 0px 5px -4px; font-weight: bold; border: solid 1px #E5AB00; padding: 2px 15px 2px 15px; font-size: smaller; margin-right: 5px;">0.1</span><span style="background-color: #D0182F; color: white; padding: 0.5em 0.5em; position: inherit; text-transform: uppercase; margin: 5px 0px 5px 1px; border: solid 1px #D0182F; font-weight: bold; padding: 2px 15px 2px 15px; font-size: smaller;">STOP</span><span style="background-color: none; color: #333333; padding: 0.5em 0.5em; position: inherit; margin: 5px 0px 5px -4px; font-weight: bold; border: solid 1px #D0182F; padding: 2px 15px 2px 15px; font-size: smaller; margin-right: 5px;">0.2</span><span style="background-color: #499FFE; color: white; padding: 0.5em 0.5em; position: inherit; text-transform: uppercase; margin: 5px 0px 5px 1px; border: solid 1px #499FFE; font-weight: bold; padding: 2px 15px 2px 15px; font-size: smaller;">NOTIFY</span><span style="background-color: none; color: #333333; padding: 0.5em 0.5em; position: inherit; margin: 5px 0px 5px -4px; font-weight: bold; border: solid 1px #499FFE; padding: 2px 15px 2px 15px; font-size: smaller;">0.5</span></span></div></div></td>
  </tr>
<tr class="gt_col_headings">
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="1" colspan="1" style="color: #666666;font-weight: bold;" scope="col" id=""></th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" style="color: #666666;font-weight: bold;" scope="col" id=""></th>
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="1" colspan="1" style="color: #666666;font-weight: bold;" scope="col" id="STEP">STEP</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="1" colspan="1" style="color: #666666;font-weight: bold;" scope="col" id="COLUMNS">COLUMNS</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="1" colspan="1" style="color: #666666;font-weight: bold;" scope="col" id="VALUES">VALUES</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_center" rowspan="1" colspan="1" style="color: #666666;font-weight: bold;" scope="col" id="TBL">TBL</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_center" rowspan="1" colspan="1" style="color: #666666;font-weight: bold;" scope="col" id="EVAL">EVAL</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" style="color: #666666;font-weight: bold;" scope="col" id="UNITS">UNITS</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" style="color: #666666;font-weight: bold;" scope="col" id="PASS">PASS</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" style="color: #666666;font-weight: bold;" scope="col" id="FAIL">FAIL</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_center" rowspan="1" colspan="1" style="color: #666666;font-weight: bold;" scope="col" id="W">W</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_center" rowspan="1" colspan="1" style="color: #666666;font-weight: bold;" scope="col" id="S">S</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_center" rowspan="1" colspan="1" style="color: #666666;font-weight: bold;" scope="col" id="N">N</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_center" rowspan="1" colspan="1" style="color: #666666;font-weight: bold;" scope="col" id="EXT">EXT</th>
</tr>
</thead>
<tbody class="gt_table_body">
  <tr>
    <td style="height: 40px; background-color: #CF142B; color: transparent;font-size: 0px;" class="gt_row gt_left">#CF142B</td>
    <td style="height: 40px; color: #666666;font-size: 13px;font-weight: bold;" class="gt_row gt_right">1</td>
    <td style="height: 40px; color: black;font-family: IBM Plex Mono;font-size: 11px;" class="gt_row gt_left">
        <div style="margin:0;padding:0;display:inline-block;height:30px;vertical-align:middle;">
        <!--?xml version="1.0" encoding="UTF-8"?--><!--?xml version="1.0" encoding="UTF-8"?-->
<svg width="30px" height="30px" viewbox="0 0 67 67" version="1.1" xmlns="http://www.w3.org/2000/svg" xlink="http://www.w3.org/1999/xlink">
    <title>col_vals_gt</title>
    <g id="All-Icons" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
        <g id="col_vals_gt" transform="translate(0.000000, 0.724138)">
            <path d="M56.712234,1 C59.1975153,1 61.4475153,2.00735931 63.076195,3.63603897 C64.7048747,5.26471863 65.712234,7.51471863 65.712234,10 L65.712234,10 L65.712234,65 L10.712234,65 C8.22695259,65 5.97695259,63.9926407 4.34827294,62.363961 C2.71959328,60.7352814 1.71223397,58.4852814 1.71223397,56 L1.71223397,56 L1.71223397,10 C1.71223397,7.51471863 2.71959328,5.26471863 4.34827294,3.63603897 C5.97695259,2.00735931 8.22695259,1 10.712234,1 L10.712234,1 Z" id="rectangle" stroke="#000000" stroke-width="2" fill="#FFFFFF"></path>
            <path d="M49.7099609,12 L17.7099609,12 C14.9499609,12 12.7099609,14.24 12.7099609,17 L12.7099609,49 C12.7099609,51.76 14.9499609,54 17.7099609,54 L49.7099609,54 C52.4699609,54 54.7099609,51.76 54.7099609,49 L54.7099609,17 C54.7099609,14.24 52.4699609,12 49.7099609,12 Z M27.2799609,44.82 L26.1399609,43.18 L40.9499609,33 L26.1399609,22.82 L27.2799609,21.18 L44.4799609,33 L27.2799609,44.82 Z" id="greater_than" fill="#000000" fill-rule="nonzero"></path>
        </g>
    </g>
</svg>
        </div>
        <span style="font-family: 'IBM Plex Mono', monospace, courier; color: black; font-size:11px;"> col_vals_gt()</span>
        </td>
    <td style="height: 40px; color: black;font-family: IBM Plex Mono;font-size: 11px; border-left: 1px dashed #E5E5E5; white-space: nowrap; text-overflow: ellipsis; overflow: hidden;" class="gt_row gt_left">d</td>
    <td style="height: 40px; color: black;font-family: IBM Plex Mono;font-size: 11px; border-left: 1px dashed #E5E5E5; white-space: nowrap; text-overflow: ellipsis; overflow: hidden;" class="gt_row gt_left">1000</td>
    <td style="height: 40px; background-color: #FCFCFC; border-left: 1px solid #D3D3D3;" class="gt_row gt_center"><svg width="25px" height="25px" viewbox="0 0 25 25" version="1.1" xmlns="http://www.w3.org/2000/svg" xlink="http://www.w3.org/1999/xlink" style="vertical-align: middle;">
    <g id="unchanged" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
        <g id="unchanged" transform="translate(0.500000, 0.570147)">
            <rect id="Rectangle" x="0.125132506" y="0" width="23.749735" height="23.7894737"></rect>
            <path d="M5.80375046,8.18194736 C3.77191832,8.18194736 2.11875046,9.83495328 2.11875046,11.8669474 C2.11875046,13.8989414 3.77191832,15.5519474 5.80375046,15.5519474 C7.8355826,15.5519474 9.48875046,13.8989414 9.48875046,11.8669474 C9.48875046,9.83495328 7.83552863,8.18194736 5.80375046,8.18194736 Z M5.80375046,14.814915 C4.17821997,14.814915 2.85578285,13.4924778 2.85578285,11.8669474 C2.85578285,10.2414169 4.17821997,8.91897975 5.80375046,8.91897975 C7.42928095,8.91897975 8.75171807,10.2414169 8.75171807,11.8669474 C8.75171807,13.4924778 7.42928095,14.814915 5.80375046,14.814915 Z" id="Shape" fill="#000000" fill-rule="nonzero"></path>
            <path d="M13.9638189,8.699335 C13.9364621,8.70430925 13.9091059,8.71176968 13.8842359,8.71923074 C13.7822704,8.73663967 13.6877654,8.77643115 13.6056956,8.83860518 L10.2433156,11.3852598 C10.0766886,11.5046343 9.97720993,11.6986181 9.97720993,11.9025491 C9.97720993,12.1064807 10.0766886,12.3004639 10.2433156,12.4198383 L13.6056956,14.966493 C13.891697,15.1803725 14.2970729,15.1231721 14.5109517,14.8371707 C14.7248313,14.5511692 14.6676309,14.145794 14.3816294,13.9319145 L12.5313257,12.5392127 L21.8812495,12.5392127 L21.8812495,11.2658854 L12.5313257,11.2658854 L14.3816294,9.87318364 C14.6377872,9.71650453 14.7497006,9.40066014 14.6477351,9.11714553 C14.5482564,8.83363156 14.262255,8.65954352 13.9638189,8.699335 Z" id="arrow" fill="#000000" transform="translate(15.929230, 11.894737) rotate(-180.000000) translate(-15.929230, -11.894737) "></path>
        </g>
    </g>
</svg></td>
    <td style="height: 40px; background-color: #FCFCFC; border-right: 1px solid #D3D3D3;" class="gt_row gt_center"><span style="color:#4CA64C;">✓</span></td>
    <td style="height: 40px; color: black;font-family: IBM Plex Mono;font-size: 11px;" class="gt_row gt_right">13</td>
    <td style="height: 40px; color: black;font-family: IBM Plex Mono;font-size: 11px; border-left: 1px dashed #E5E5E5;" class="gt_row gt_right">7<br>0.54</td>
    <td style="height: 40px; color: black;font-family: IBM Plex Mono;font-size: 11px; border-left: 1px dashed #E5E5E5;" class="gt_row gt_right">6<br>0.46</td>
    <td style="height: 40px; background-color: #FCFCFC; border-left: 1px solid #D3D3D3;" class="gt_row gt_center"><span style="color: #E5AB00;">●</span></td>
    <td style="height: 40px; background-color: #FCFCFC;" class="gt_row gt_center"><span style="color: #CF142B;">●</span></td>
    <td style="height: 40px; background-color: #FCFCFC; border-right: 1px solid #D3D3D3;" class="gt_row gt_center"><span style="color: #439CFE;">○</span></td>
    <td style="height: 40px;" class="gt_row gt_center"><a href="data:text/csv;base64,X3Jvd19udW1fLGRhdGVfdGltZSxkYXRlLGEsYixjLGQsZSxmCjUsMjAxNi0wMS0wOVQxMjozNjowMC4wMDAwMDAsMjAxNi0wMS0wOSw4LDMtbGRtLTAzOCw3LDI4My45NCx0cnVlLGxvdwo3LDIwMTYtMDEtMTVUMTg6NDY6MDAuMDAwMDAwLDIwMTYtMDEtMTUsNywxLWtudy0wOTMsMyw4NDMuMzQsdHJ1ZSxoaWdoCjksMjAxNi0wMS0yMFQwNDozMDowMC4wMDAwMDAsMjAxNi0wMS0yMCwzLDUtYmNlLTY0Miw5LDgzNy45MyxmYWxzZSxoaWdoCjEwLDIwMTYtMDEtMjBUMDQ6MzA6MDAuMDAwMDAwLDIwMTYtMDEtMjAsMyw1LWJjZS02NDIsOSw4MzcuOTMsZmFsc2UsaGlnaAoxMSwyMDE2LTAxLTI2VDIwOjA3OjAwLjAwMDAwMCwyMDE2LTAxLTI2LDQsMi1kbXgtMDEwLDcsODMzLjk4LHRydWUsbG93CjEyLDIwMTYtMDEtMjhUMDI6NTE6MDAuMDAwMDAwLDIwMTYtMDEtMjgsMiw3LWRteC0wMTAsOCwxMDguMzQsZmFsc2UsbG93Cg==" download="extract_0001.csv"><button style="background-color: #67C2DC; color: #FFFFFF; border: none; padding: 5px; font-weight: bold; cursor: pointer; border-radius: 4px;">CSV</button></a></td>
  </tr>
  <tr>
    <td style="height: 40px; background-color: #CF142B; color: transparent;font-size: 0px;" class="gt_row gt_left">#CF142B</td>
    <td style="height: 40px; color: #666666;font-size: 13px;font-weight: bold;" class="gt_row gt_right">2</td>
    <td style="height: 40px; color: black;font-family: IBM Plex Mono;font-size: 11px;" class="gt_row gt_left">
        <div style="margin:0;padding:0;display:inline-block;height:30px;vertical-align:middle;">
        <!--?xml version="1.0" encoding="UTF-8"?--><!--?xml version="1.0" encoding="UTF-8"?-->
<svg width="30px" height="30px" viewbox="0 0 67 67" version="1.1" xmlns="http://www.w3.org/2000/svg" xlink="http://www.w3.org/1999/xlink">
    <title>col_vals_lte</title>
    <g id="All-Icons" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
        <g id="col_vals_lte" transform="translate(0.000000, 0.793103)">
            <path d="M56.712234,1 C59.1975153,1 61.4475153,2.00735931 63.076195,3.63603897 C64.7048747,5.26471863 65.712234,7.51471863 65.712234,10 L65.712234,10 L65.712234,65 L10.712234,65 C8.22695259,65 5.97695259,63.9926407 4.34827294,62.363961 C2.71959328,60.7352814 1.71223397,58.4852814 1.71223397,56 L1.71223397,56 L1.71223397,10 C1.71223397,7.51471863 2.71959328,5.26471863 4.34827294,3.63603897 C5.97695259,2.00735931 8.22695259,1 10.712234,1 L10.712234,1 Z" id="rectangle" stroke="#000000" stroke-width="2" fill="#FFFFFF"></path>
            <path d="M53.712234,12 L13.712234,12 C13.157547,12 12.712234,12.449219 12.712234,13 L12.712234,53 C12.712234,53.550781 13.157547,54 13.712234,54 L53.712234,54 C54.266922,54 54.712234,53.550781 54.712234,53 L54.712234,13 C54.712234,12.449219 54.266922,12 53.712234,12 Z M42.227859,19.125 L43.196609,20.875 L26.770828,30 L43.196609,39.125 L42.227859,40.875 L22.65364,30 L42.227859,19.125 Z M44.712234,47 L22.712234,47 L22.712234,45 L44.712234,45 L44.712234,47 Z" id="less_than_equal" fill="#000000" fill-rule="nonzero"></path>
        </g>
    </g>
</svg>
        </div>
        <span style="font-family: 'IBM Plex Mono', monospace, courier; color: black; font-size:11px;"> col_vals_le()</span>
        </td>
    <td style="height: 40px; color: black;font-family: IBM Plex Mono;font-size: 11px; border-left: 1px dashed #E5E5E5; white-space: nowrap; text-overflow: ellipsis; overflow: hidden;" class="gt_row gt_left">c</td>
    <td style="height: 40px; color: black;font-family: IBM Plex Mono;font-size: 11px; border-left: 1px dashed #E5E5E5; white-space: nowrap; text-overflow: ellipsis; overflow: hidden;" class="gt_row gt_left">5</td>
    <td style="height: 40px; background-color: #FCFCFC; border-left: 1px solid #D3D3D3;" class="gt_row gt_center"><svg width="25px" height="25px" viewbox="0 0 25 25" version="1.1" xmlns="http://www.w3.org/2000/svg" xlink="http://www.w3.org/1999/xlink" style="vertical-align: middle;">
    <g id="unchanged" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
        <g id="unchanged" transform="translate(0.500000, 0.570147)">
            <rect id="Rectangle" x="0.125132506" y="0" width="23.749735" height="23.7894737"></rect>
            <path d="M5.80375046,8.18194736 C3.77191832,8.18194736 2.11875046,9.83495328 2.11875046,11.8669474 C2.11875046,13.8989414 3.77191832,15.5519474 5.80375046,15.5519474 C7.8355826,15.5519474 9.48875046,13.8989414 9.48875046,11.8669474 C9.48875046,9.83495328 7.83552863,8.18194736 5.80375046,8.18194736 Z M5.80375046,14.814915 C4.17821997,14.814915 2.85578285,13.4924778 2.85578285,11.8669474 C2.85578285,10.2414169 4.17821997,8.91897975 5.80375046,8.91897975 C7.42928095,8.91897975 8.75171807,10.2414169 8.75171807,11.8669474 C8.75171807,13.4924778 7.42928095,14.814915 5.80375046,14.814915 Z" id="Shape" fill="#000000" fill-rule="nonzero"></path>
            <path d="M13.9638189,8.699335 C13.9364621,8.70430925 13.9091059,8.71176968 13.8842359,8.71923074 C13.7822704,8.73663967 13.6877654,8.77643115 13.6056956,8.83860518 L10.2433156,11.3852598 C10.0766886,11.5046343 9.97720993,11.6986181 9.97720993,11.9025491 C9.97720993,12.1064807 10.0766886,12.3004639 10.2433156,12.4198383 L13.6056956,14.966493 C13.891697,15.1803725 14.2970729,15.1231721 14.5109517,14.8371707 C14.7248313,14.5511692 14.6676309,14.145794 14.3816294,13.9319145 L12.5313257,12.5392127 L21.8812495,12.5392127 L21.8812495,11.2658854 L12.5313257,11.2658854 L14.3816294,9.87318364 C14.6377872,9.71650453 14.7497006,9.40066014 14.6477351,9.11714553 C14.5482564,8.83363156 14.262255,8.65954352 13.9638189,8.699335 Z" id="arrow" fill="#000000" transform="translate(15.929230, 11.894737) rotate(-180.000000) translate(-15.929230, -11.894737) "></path>
        </g>
    </g>
</svg></td>
    <td style="height: 40px; background-color: #FCFCFC; border-right: 1px solid #D3D3D3;" class="gt_row gt_center"><span style="color:#4CA64C;">✓</span></td>
    <td style="height: 40px; color: black;font-family: IBM Plex Mono;font-size: 11px;" class="gt_row gt_right">13</td>
    <td style="height: 40px; color: black;font-family: IBM Plex Mono;font-size: 11px; border-left: 1px dashed #E5E5E5;" class="gt_row gt_right">5<br>0.38</td>
    <td style="height: 40px; color: black;font-family: IBM Plex Mono;font-size: 11px; border-left: 1px dashed #E5E5E5;" class="gt_row gt_right">8<br>0.62</td>
    <td style="height: 40px; background-color: #FCFCFC; border-left: 1px solid #D3D3D3;" class="gt_row gt_center"><span style="color: #E5AB00;">●</span></td>
    <td style="height: 40px; background-color: #FCFCFC;" class="gt_row gt_center"><span style="color: #CF142B;">●</span></td>
    <td style="height: 40px; background-color: #FCFCFC; border-right: 1px solid #D3D3D3;" class="gt_row gt_center"><span style="color: #439CFE;">●</span></td>
    <td style="height: 40px;" class="gt_row gt_center"><a href="data:text/csv;base64,X3Jvd19udW1fLGRhdGVfdGltZSxkYXRlLGEsYixjLGQsZSxmCjIsMjAxNi0wMS0wNFQwMDozMjowMC4wMDAwMDAsMjAxNi0wMS0wNCwzLDUtZWdoLTE2Myw4LDk5OTkuOTksdHJ1ZSxsb3cKNCwyMDE2LTAxLTA2VDE3OjIzOjAwLjAwMDAwMCwyMDE2LTAxLTA2LDIsNS1qZG8tOTAzLCwzODkyLjQsZmFsc2UsbWlkCjUsMjAxNi0wMS0wOVQxMjozNjowMC4wMDAwMDAsMjAxNi0wMS0wOSw4LDMtbGRtLTAzOCw3LDI4My45NCx0cnVlLGxvdwo5LDIwMTYtMDEtMjBUMDQ6MzA6MDAuMDAwMDAwLDIwMTYtMDEtMjAsMyw1LWJjZS02NDIsOSw4MzcuOTMsZmFsc2UsaGlnaAoxMCwyMDE2LTAxLTIwVDA0OjMwOjAwLjAwMDAwMCwyMDE2LTAxLTIwLDMsNS1iY2UtNjQyLDksODM3LjkzLGZhbHNlLGhpZ2gKMTEsMjAxNi0wMS0yNlQyMDowNzowMC4wMDAwMDAsMjAxNi0wMS0yNiw0LDItZG14LTAxMCw3LDgzMy45OCx0cnVlLGxvdwoxMiwyMDE2LTAxLTI4VDAyOjUxOjAwLjAwMDAwMCwyMDE2LTAxLTI4LDIsNy1kbXgtMDEwLDgsMTA4LjM0LGZhbHNlLGxvdwoxMywyMDE2LTAxLTMwVDExOjIzOjAwLjAwMDAwMCwyMDE2LTAxLTMwLDEsMy1ka2EtMzAzLCwyMjMwLjA5LHRydWUsaGlnaAo=" download="extract_0002.csv"><button style="background-color: #67C2DC; color: #FFFFFF; border: none; padding: 5px; font-weight: bold; cursor: pointer; border-radius: 4px;">CSV</button></a></td>
  </tr>
  <tr>
    <td style="height: 40px; background-color: #4CA64C; color: transparent;font-size: 0px;" class="gt_row gt_left">#4CA64C</td>
    <td style="height: 40px; color: #666666;font-size: 13px;font-weight: bold;" class="gt_row gt_right">3</td>
    <td style="height: 40px; color: black;font-family: IBM Plex Mono;font-size: 11px;" class="gt_row gt_left">
        <div style="margin:0;padding:0;display:inline-block;height:30px;vertical-align:middle;">
        <!--?xml version="1.0" encoding="UTF-8"?--><!--?xml version="1.0" encoding="UTF-8"?-->
<svg width="30px" height="30px" viewbox="0 0 67 67" version="1.1" xmlns="http://www.w3.org/2000/svg" xlink="http://www.w3.org/1999/xlink">
    <title>col_exists</title>
    <g id="All-Icons" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
        <g id="col_exists" transform="translate(0.000000, 0.827586)">
            <path d="M56.712234,1.01466935 C59.1975153,1.01466935 61.4475153,2.02202867 63.076195,3.65070832 C64.7048747,5.27938798 65.712234,7.52938798 65.712234,10.0146694 L65.712234,10.0146694 L65.712234,65.0146694 L10.712234,65.0146694 C8.22695259,65.0146694 5.97695259,64.00731 4.34827294,62.3786304 C2.71959328,60.7499507 1.71223397,58.4999507 1.71223397,56.0146694 L1.71223397,56.0146694 L1.71223397,10.0146694 C1.71223397,7.52938798 2.71959328,5.27938798 4.34827294,3.65070832 C5.97695259,2.02202867 8.22695259,1.01466935 10.712234,1.01466935 L10.712234,1.01466935 Z" id="rectangle" stroke="#000000" stroke-width="2" fill="#FFFFFF"></path>
            <rect id="column" fill="#000000" x="12.2117153" y="12.0146694" width="20" height="42" rx="1"></rect>
            <path d="M44.3177114,43.0146694 L44.3177114,40.5136928 L46.818688,40.5136928 L46.818688,43.0146694 L44.3177114,43.0146694 Z M44.3177114,38.0000209 L44.3177114,37.314474 C44.3177114,35.6979295 44.9397755,34.178739 46.1839224,32.7568569 L46.9837271,31.830099 C48.3125097,30.3066539 48.9768911,29.058294 48.9768911,28.0849819 C48.9768911,27.3317229 48.6849019,26.7350492 48.1009146,26.2949428 C47.5169273,25.8548364 46.7298258,25.6347865 45.7395864,25.6347865 C44.4446581,25.6347865 43.0693463,25.9479345 41.6136099,26.5742397 L41.6136099,24.4541225 C43.1793729,23.9801618 44.643551,23.743185 46.006188,23.743185 C47.7327591,23.743185 49.1038392,24.1303881 50.1194692,24.9048061 C51.1350993,25.679224 51.6429067,26.7265768 51.6429067,28.0468959 C51.6429067,28.7916913 51.4969121,29.4327982 51.2049185,29.9702358 C50.9129248,30.5076733 50.3522208,31.1699389 49.5227896,31.9570522 L48.7356802,32.6933803 C47.9485669,33.4381757 47.432296,34.0623556 47.1868521,34.5659389 C46.9414081,35.0695221 46.818688,35.7487146 46.818688,36.6035365 L46.818688,38.0000209 L44.3177114,38.0000209 Z" id="?" fill="#000000"></path>
        </g>
    </g>
</svg>
        </div>
        <span style="font-family: 'IBM Plex Mono', monospace, courier; color: black; font-size:11px;"> col_exists()</span>
        </td>
    <td style="height: 40px; color: black;font-family: IBM Plex Mono;font-size: 11px; border-left: 1px dashed #E5E5E5; white-space: nowrap; text-overflow: ellipsis; overflow: hidden;" class="gt_row gt_left">date</td>
    <td style="height: 40px; color: black;font-family: IBM Plex Mono;font-size: 11px; border-left: 1px dashed #E5E5E5; white-space: nowrap; text-overflow: ellipsis; overflow: hidden;" class="gt_row gt_left">—</td>
    <td style="height: 40px; background-color: #FCFCFC; border-left: 1px solid #D3D3D3;" class="gt_row gt_center"><svg width="25px" height="25px" viewbox="0 0 25 25" version="1.1" xmlns="http://www.w3.org/2000/svg" xlink="http://www.w3.org/1999/xlink" style="vertical-align: middle;">
    <g id="unchanged" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
        <g id="unchanged" transform="translate(0.500000, 0.570147)">
            <rect id="Rectangle" x="0.125132506" y="0" width="23.749735" height="23.7894737"></rect>
            <path d="M5.80375046,8.18194736 C3.77191832,8.18194736 2.11875046,9.83495328 2.11875046,11.8669474 C2.11875046,13.8989414 3.77191832,15.5519474 5.80375046,15.5519474 C7.8355826,15.5519474 9.48875046,13.8989414 9.48875046,11.8669474 C9.48875046,9.83495328 7.83552863,8.18194736 5.80375046,8.18194736 Z M5.80375046,14.814915 C4.17821997,14.814915 2.85578285,13.4924778 2.85578285,11.8669474 C2.85578285,10.2414169 4.17821997,8.91897975 5.80375046,8.91897975 C7.42928095,8.91897975 8.75171807,10.2414169 8.75171807,11.8669474 C8.75171807,13.4924778 7.42928095,14.814915 5.80375046,14.814915 Z" id="Shape" fill="#000000" fill-rule="nonzero"></path>
            <path d="M13.9638189,8.699335 C13.9364621,8.70430925 13.9091059,8.71176968 13.8842359,8.71923074 C13.7822704,8.73663967 13.6877654,8.77643115 13.6056956,8.83860518 L10.2433156,11.3852598 C10.0766886,11.5046343 9.97720993,11.6986181 9.97720993,11.9025491 C9.97720993,12.1064807 10.0766886,12.3004639 10.2433156,12.4198383 L13.6056956,14.966493 C13.891697,15.1803725 14.2970729,15.1231721 14.5109517,14.8371707 C14.7248313,14.5511692 14.6676309,14.145794 14.3816294,13.9319145 L12.5313257,12.5392127 L21.8812495,12.5392127 L21.8812495,11.2658854 L12.5313257,11.2658854 L14.3816294,9.87318364 C14.6377872,9.71650453 14.7497006,9.40066014 14.6477351,9.11714553 C14.5482564,8.83363156 14.262255,8.65954352 13.9638189,8.699335 Z" id="arrow" fill="#000000" transform="translate(15.929230, 11.894737) rotate(-180.000000) translate(-15.929230, -11.894737) "></path>
        </g>
    </g>
</svg></td>
    <td style="height: 40px; background-color: #FCFCFC; border-right: 1px solid #D3D3D3;" class="gt_row gt_center"><span style="color:#4CA64C;">✓</span></td>
    <td style="height: 40px; color: black;font-family: IBM Plex Mono;font-size: 11px;" class="gt_row gt_right">1</td>
    <td style="height: 40px; color: black;font-family: IBM Plex Mono;font-size: 11px; border-left: 1px dashed #E5E5E5;" class="gt_row gt_right">1<br>1.00</td>
    <td style="height: 40px; color: black;font-family: IBM Plex Mono;font-size: 11px; border-left: 1px dashed #E5E5E5;" class="gt_row gt_right">0<br>0.00</td>
    <td style="height: 40px; background-color: #FCFCFC; border-left: 1px solid #D3D3D3;" class="gt_row gt_center"><span style="color: #E5AB00;">○</span></td>
    <td style="height: 40px; background-color: #FCFCFC;" class="gt_row gt_center"><span style="color: #CF142B;">○</span></td>
    <td style="height: 40px; background-color: #FCFCFC; border-right: 1px solid #D3D3D3;" class="gt_row gt_center"><span style="color: #439CFE;">○</span></td>
    <td style="height: 40px;" class="gt_row gt_center">—</td>
  </tr>
  <tr>
    <td style="height: 40px; background-color: #4CA64C; color: transparent;font-size: 0px;" class="gt_row gt_left">#4CA64C</td>
    <td style="height: 40px; color: #666666;font-size: 13px;font-weight: bold;" class="gt_row gt_right">4</td>
    <td style="height: 40px; color: black;font-family: IBM Plex Mono;font-size: 11px;" class="gt_row gt_left">
        <div style="margin:0;padding:0;display:inline-block;height:30px;vertical-align:middle;">
        <!--?xml version="1.0" encoding="UTF-8"?--><!--?xml version="1.0" encoding="UTF-8"?-->
<svg width="30px" height="30px" viewbox="0 0 67 67" version="1.1" xmlns="http://www.w3.org/2000/svg" xlink="http://www.w3.org/1999/xlink">
    <title>col_exists</title>
    <g id="All-Icons" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
        <g id="col_exists" transform="translate(0.000000, 0.827586)">
            <path d="M56.712234,1.01466935 C59.1975153,1.01466935 61.4475153,2.02202867 63.076195,3.65070832 C64.7048747,5.27938798 65.712234,7.52938798 65.712234,10.0146694 L65.712234,10.0146694 L65.712234,65.0146694 L10.712234,65.0146694 C8.22695259,65.0146694 5.97695259,64.00731 4.34827294,62.3786304 C2.71959328,60.7499507 1.71223397,58.4999507 1.71223397,56.0146694 L1.71223397,56.0146694 L1.71223397,10.0146694 C1.71223397,7.52938798 2.71959328,5.27938798 4.34827294,3.65070832 C5.97695259,2.02202867 8.22695259,1.01466935 10.712234,1.01466935 L10.712234,1.01466935 Z" id="rectangle" stroke="#000000" stroke-width="2" fill="#FFFFFF"></path>
            <rect id="column" fill="#000000" x="12.2117153" y="12.0146694" width="20" height="42" rx="1"></rect>
            <path d="M44.3177114,43.0146694 L44.3177114,40.5136928 L46.818688,40.5136928 L46.818688,43.0146694 L44.3177114,43.0146694 Z M44.3177114,38.0000209 L44.3177114,37.314474 C44.3177114,35.6979295 44.9397755,34.178739 46.1839224,32.7568569 L46.9837271,31.830099 C48.3125097,30.3066539 48.9768911,29.058294 48.9768911,28.0849819 C48.9768911,27.3317229 48.6849019,26.7350492 48.1009146,26.2949428 C47.5169273,25.8548364 46.7298258,25.6347865 45.7395864,25.6347865 C44.4446581,25.6347865 43.0693463,25.9479345 41.6136099,26.5742397 L41.6136099,24.4541225 C43.1793729,23.9801618 44.643551,23.743185 46.006188,23.743185 C47.7327591,23.743185 49.1038392,24.1303881 50.1194692,24.9048061 C51.1350993,25.679224 51.6429067,26.7265768 51.6429067,28.0468959 C51.6429067,28.7916913 51.4969121,29.4327982 51.2049185,29.9702358 C50.9129248,30.5076733 50.3522208,31.1699389 49.5227896,31.9570522 L48.7356802,32.6933803 C47.9485669,33.4381757 47.432296,34.0623556 47.1868521,34.5659389 C46.9414081,35.0695221 46.818688,35.7487146 46.818688,36.6035365 L46.818688,38.0000209 L44.3177114,38.0000209 Z" id="?" fill="#000000"></path>
        </g>
    </g>
</svg>
        </div>
        <span style="font-family: 'IBM Plex Mono', monospace, courier; color: black; font-size:11px;"> col_exists()</span>
        </td>
    <td style="height: 40px; color: black;font-family: IBM Plex Mono;font-size: 11px; border-left: 1px dashed #E5E5E5; white-space: nowrap; text-overflow: ellipsis; overflow: hidden;" class="gt_row gt_left">date_time</td>
    <td style="height: 40px; color: black;font-family: IBM Plex Mono;font-size: 11px; border-left: 1px dashed #E5E5E5; white-space: nowrap; text-overflow: ellipsis; overflow: hidden;" class="gt_row gt_left">—</td>
    <td style="height: 40px; background-color: #FCFCFC; border-left: 1px solid #D3D3D3;" class="gt_row gt_center"><svg width="25px" height="25px" viewbox="0 0 25 25" version="1.1" xmlns="http://www.w3.org/2000/svg" xlink="http://www.w3.org/1999/xlink" style="vertical-align: middle;">
    <g id="unchanged" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
        <g id="unchanged" transform="translate(0.500000, 0.570147)">
            <rect id="Rectangle" x="0.125132506" y="0" width="23.749735" height="23.7894737"></rect>
            <path d="M5.80375046,8.18194736 C3.77191832,8.18194736 2.11875046,9.83495328 2.11875046,11.8669474 C2.11875046,13.8989414 3.77191832,15.5519474 5.80375046,15.5519474 C7.8355826,15.5519474 9.48875046,13.8989414 9.48875046,11.8669474 C9.48875046,9.83495328 7.83552863,8.18194736 5.80375046,8.18194736 Z M5.80375046,14.814915 C4.17821997,14.814915 2.85578285,13.4924778 2.85578285,11.8669474 C2.85578285,10.2414169 4.17821997,8.91897975 5.80375046,8.91897975 C7.42928095,8.91897975 8.75171807,10.2414169 8.75171807,11.8669474 C8.75171807,13.4924778 7.42928095,14.814915 5.80375046,14.814915 Z" id="Shape" fill="#000000" fill-rule="nonzero"></path>
            <path d="M13.9638189,8.699335 C13.9364621,8.70430925 13.9091059,8.71176968 13.8842359,8.71923074 C13.7822704,8.73663967 13.6877654,8.77643115 13.6056956,8.83860518 L10.2433156,11.3852598 C10.0766886,11.5046343 9.97720993,11.6986181 9.97720993,11.9025491 C9.97720993,12.1064807 10.0766886,12.3004639 10.2433156,12.4198383 L13.6056956,14.966493 C13.891697,15.1803725 14.2970729,15.1231721 14.5109517,14.8371707 C14.7248313,14.5511692 14.6676309,14.145794 14.3816294,13.9319145 L12.5313257,12.5392127 L21.8812495,12.5392127 L21.8812495,11.2658854 L12.5313257,11.2658854 L14.3816294,9.87318364 C14.6377872,9.71650453 14.7497006,9.40066014 14.6477351,9.11714553 C14.5482564,8.83363156 14.262255,8.65954352 13.9638189,8.699335 Z" id="arrow" fill="#000000" transform="translate(15.929230, 11.894737) rotate(-180.000000) translate(-15.929230, -11.894737) "></path>
        </g>
    </g>
</svg></td>
    <td style="height: 40px; background-color: #FCFCFC; border-right: 1px solid #D3D3D3;" class="gt_row gt_center"><span style="color:#4CA64C;">✓</span></td>
    <td style="height: 40px; color: black;font-family: IBM Plex Mono;font-size: 11px;" class="gt_row gt_right">1</td>
    <td style="height: 40px; color: black;font-family: IBM Plex Mono;font-size: 11px; border-left: 1px dashed #E5E5E5;" class="gt_row gt_right">1<br>1.00</td>
    <td style="height: 40px; color: black;font-family: IBM Plex Mono;font-size: 11px; border-left: 1px dashed #E5E5E5;" class="gt_row gt_right">0<br>0.00</td>
    <td style="height: 40px; background-color: #FCFCFC; border-left: 1px solid #D3D3D3;" class="gt_row gt_center"><span style="color: #E5AB00;">○</span></td>
    <td style="height: 40px; background-color: #FCFCFC;" class="gt_row gt_center"><span style="color: #CF142B;">○</span></td>
    <td style="height: 40px; background-color: #FCFCFC; border-right: 1px solid #D3D3D3;" class="gt_row gt_center"><span style="color: #439CFE;">○</span></td>
    <td style="height: 40px;" class="gt_row gt_center">—</td>
  </tr>
</tbody>
  <tfoot class="gt_sourcenotes">
  
  <tr>
    <td class="gt_sourcenote" colspan="14"><div style="margin-top: 5px; margin-bottom: 5px;"><span style="background-color: #FFF; color: #444; padding: 0.5em 0.5em; position: inherit; text-transform: uppercase; margin-left: 10px; margin-right: 5px; border: solid 1px #999999; font-variant-numeric: tabular-nums; border-radius: 0; padding: 2px 10px 2px 10px;">2025-02-11 17:51:12 UTC</span><span style="background-color: #FFF; color: #444; padding: 0.5em 0.5em; position: inherit; margin-right: 5px; border: solid 1px #999999; font-variant-numeric: tabular-nums; border-radius: 0; padding: 2px 10px 2px 10px;">&lt; 1 s</span><span style="background-color: #FFF; color: #444; padding: 0.5em 0.5em; position: inherit; text-transform: uppercase; margin: 5px 1px 5px -1px; border: solid 1px #999999; font-variant-numeric: tabular-nums; border-radius: 0; padding: 2px 10px 2px 10px;">2025-02-11 17:51:12 UTC</span></div></td>
  </tr>

</tfoot>

</table>

</div>
        
</div>
</div>
<p>The first validation step (<code>cols_val_gt()</code>) checks the <code>d</code> column in the data, to ensure each value is greater than <code>1000</code>. Notice that the red bar on the left indicates it failed, and the <code>FAIL</code> column says it has 6 failing values out of 13 <code>UNITS</code>.</p>
<p>The table is chock full of the information you need when doing data validation tasks. And it’s also easy on the eyes. Some cool features include:</p>
<ol type="1">
<li>a header with information on the type of input table plus important validation options</li>
<li>vertical color strips on the left side to indicate overall status of the rows</li>
<li>icons in several columns (space saving and they let you know what’s up)</li>
<li>‘CSV’ buttons that, when clicked, provide you with a CSV file</li>
<li>a footer with timing information for the analysis</li>
</ol>
<p>It’s a nice table and it scales nicely to the large variety of validation types and options available in the Pointblank library. Viewing this table is a central part of using that library and the great thing about the reporting being a table like this is that it can be shared by placing it in a publication environment of your choosing (for example, it could be put in a Quarto document).</p>
<p>Here is the code that was used to generate the data validation above:</p>
<div id="953850a4" class="cell" data-execution_count="2">
<div class="code-copy-outer-scaffold"><div class="sourceCode cell-code" id="cb2" style="background: #f1f3f5;"><pre class="sourceCode python code-with-copy"><code class="sourceCode python"><span id="cb2-1"><span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">import</span> pointblank <span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">as</span> pb</span>
<span id="cb2-2"></span>
<span id="cb2-3">validation <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> (</span>
<span id="cb2-4">    pb.Validate(</span>
<span id="cb2-5">        data<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>pb.load_dataset(dataset<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"small_table"</span>, tbl_type<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"polars"</span>),</span>
<span id="cb2-6">        label<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"An example validation"</span>,</span>
<span id="cb2-7">        thresholds<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>(<span class="fl" style="color: #AD0000;
background-color: null;
font-style: inherit;">0.1</span>, <span class="fl" style="color: #AD0000;
background-color: null;
font-style: inherit;">0.2</span>, <span class="fl" style="color: #AD0000;
background-color: null;
font-style: inherit;">0.5</span>),</span>
<span id="cb2-8">    )</span>
<span id="cb2-9">    .col_vals_gt(columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"d"</span>, value<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">1000</span>)</span>
<span id="cb2-10">    .col_vals_le(columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"c"</span>, value<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">5</span>)</span>
<span id="cb2-11">    .col_exists(columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>[<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"date"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"date_time"</span>])</span>
<span id="cb2-12">    .interrogate()</span>
<span id="cb2-13">)</span>
<span id="cb2-14"></span>
<span id="cb2-15">validation</span></code></pre></div></div>
</div>
<p>Pointblank makes it easy to get started by giving you a simple entry point (<code>Validate()</code>), allowing you to define as many validation steps as needed. Each validation step is specified by calling methods like <code>.cols_vals_gt()</code>, which is short for checking that “column values are greater than” some specified value.</p>
<p>Pointblank enables you to validate many types of DataFrames and SQL databases. Pointblank supports Pandas and Polars through Narwhals, and numerous backends (like DuckDB and MySQL) are also supported though our Ibis integration.</p>
</section>
<section id="exploring-data-validation-failures" class="level3">
<h3 class="anchored" data-anchor-id="exploring-data-validation-failures">Exploring data validation failures</h3>
<p>Note that the above validation report table showed 6 failures in the first validation step. You might want to know exactly <em>what</em> failed, giving you a chance to fix the underlying data quality issues. To do that, you can use the <code>get_step_report()</code> method:</p>
<div id="a6a7598b" class="cell" data-execution_count="3">
<div class="code-copy-outer-scaffold"><div class="sourceCode cell-code" id="cb3" style="background: #f1f3f5;"><pre class="sourceCode python code-with-copy"><code class="sourceCode python"><span id="cb3-1">validation.get_step_report(i<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">1</span>)</span></code></pre></div></div>
<div class="cell-output cell-output-display" data-execution_count="26">
<div id="pb_preview_tbl" style="padding-left:0px;padding-right:0px;padding-top:10px;padding-bottom:10px;overflow-x:auto;overflow-y:auto;width:auto;height:auto;">
<style>
@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans&display=swap');
@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Mono&display=swap');
#pb_preview_tbl table {
          font-family: 'IBM Plex Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Helvetica Neue', 'Fira Sans', 'Droid Sans', Arial, sans-serif;
          -webkit-font-smoothing: antialiased;
          -moz-osx-font-smoothing: grayscale;
        }

#pb_preview_tbl thead, tbody, tfoot, tr, td, th { border-style: none; }
 tr { background-color: transparent; }
#pb_preview_tbl p { margin: 0; padding: 0; }
 #pb_preview_tbl .gt_table { display: table; border-collapse: collapse; line-height: normal; margin-left: auto; margin-right: auto; color: #333333; font-size: 16px; font-weight: normal; font-style: normal; background-color: #FFFFFF; width: auto; border-top-style: solid; border-top-width: 2px; border-top-color: #A8A8A8; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #A8A8A8; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; }
 #pb_preview_tbl .gt_caption { padding-top: 4px; padding-bottom: 4px; }
 #pb_preview_tbl .gt_title { color: #333333; font-size: 125%; font-weight: initial; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; border-bottom-color: #FFFFFF; border-bottom-width: 0; }
 #pb_preview_tbl .gt_subtitle { color: #333333; font-size: 85%; font-weight: initial; padding-top: 3px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; border-top-color: #FFFFFF; border-top-width: 0; }
 #pb_preview_tbl .gt_heading { background-color: #FFFFFF; text-align: left; border-bottom-color: #FFFFFF; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #pb_preview_tbl .gt_bottom_border { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #pb_preview_tbl .gt_col_headings { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #pb_preview_tbl .gt_col_heading { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; border-left-style: solid; border-left-width: 1px; border-left-color: #F2F2F2; border-right-style: solid; border-right-width: 1px; border-right-color: #F2F2F2; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; overflow-x: hidden; }
 #pb_preview_tbl .gt_column_spanner_outer { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; padding-top: 0; padding-bottom: 0; padding-left: 4px; padding-right: 4px; }
 #pb_preview_tbl .gt_column_spanner_outer:first-child { padding-left: 0; }
 #pb_preview_tbl .gt_column_spanner_outer:last-child { padding-right: 0; }
 #pb_preview_tbl .gt_column_spanner { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; overflow-x: hidden; display: inline-block; width: 100%; }
 #pb_preview_tbl .gt_spanner_row { border-bottom-style: hidden; }
 #pb_preview_tbl .gt_group_heading { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; text-align: left; }
 #pb_preview_tbl .gt_empty_group_heading { padding: 0.5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: middle; }
 #pb_preview_tbl .gt_from_md> :first-child { margin-top: 0; }
 #pb_preview_tbl .gt_from_md> :last-child { margin-bottom: 0; }
 #pb_preview_tbl .gt_row { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; margin: 10px; border-top-style: solid; border-top-width: 1px; border-top-color: #D3D3D3; border-left-style: solid; border-left-width: 1px; border-left-color: #E9E9E9; border-right-style: solid; border-right-width: 1px; border-right-color: #E9E9E9; vertical-align: middle; overflow-x: hidden; }
 #pb_preview_tbl .gt_stub { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; }
 #pb_preview_tbl .gt_stub_row_group { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; vertical-align: top; }
 #pb_preview_tbl .gt_row_group_first td { border-top-width: 2px; }
 #pb_preview_tbl .gt_row_group_first th { border-top-width: 2px; }
 #pb_preview_tbl .gt_striped { background-color: rgba(128,128,128,0.05); }
 #pb_preview_tbl .gt_table_body { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #pb_preview_tbl .gt_sourcenotes { color: #333333; background-color: #FFFFFF; border-bottom-style: none; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; }
 #pb_preview_tbl .gt_sourcenote { font-size: 90%; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; text-align: left; }
 #pb_preview_tbl .gt_left { text-align: left; }
 #pb_preview_tbl .gt_center { text-align: center; }
 #pb_preview_tbl .gt_right { text-align: right; font-variant-numeric: tabular-nums; }
 #pb_preview_tbl .gt_font_normal { font-weight: normal; }
 #pb_preview_tbl .gt_font_bold { font-weight: bold; }
 #pb_preview_tbl .gt_font_italic { font-style: italic; }
 #pb_preview_tbl .gt_super { font-size: 65%; }
 #pb_preview_tbl .gt_footnote_marks { font-size: 75%; vertical-align: 0.4em; position: initial; }
 #pb_preview_tbl .gt_asterisk { font-size: 100%; vertical-align: 0; }
 
</style>
<table style="table-layout: fixed;; width: 0px" class="gt_table" data-quarto-disable-processing="false" data-quarto-bootstrap="false">
<colgroup>
  <col style="width:25.6px;">
  <col style="width:158px;">
  <col style="width:88px;">
  <col style="width:49px;">
  <col style="width:80px;">
  <col style="width:49px;">
  <col style="width:65px;">
  <col style="width:65px;">
  <col style="width:57px;">
</colgroup>

<thead>

  <tr class="gt_heading">
    <td colspan="9" class="gt_heading gt_title gt_font_normal">Report for Validation Step 1</td>
  </tr>
  <tr class="gt_heading">
    <td colspan="9" class="gt_heading gt_subtitle gt_font_normal gt_bottom_border"><div>ASSERTION <span style="border-style: solid; border-width: thin; border-color: lightblue; padding-left: 2px; padding-right: 2px;"><code style="color: #303030;"><code style="color: #303030; font-family: monospace; font-size: smaller;">d &gt; 1000</code></code></span><br><div style="padding-top: 3px;"><strong>6</strong> / <strong>13</strong> TEST UNIT FAILURES IN COLUMN <strong>6</strong></div><div style="padding-top: 10px;">EXTRACT OF <strong>6</strong> ROWS WITH <span style="color: #B22222;">TEST UNIT FAILURES IN RED</span>:</div></div></td>
  </tr>
<tr class="gt_col_headings">
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" style="color: gray20;font-family: IBM Plex Mono;font-size: 12px;" scope="col" id=""></th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" style="color: gray20;font-family: IBM Plex Mono;font-size: 12px;" scope="col" id="<div><div style='white-space: nowrap; text-overflow: ellipsis; overflow: hidden; padding-bottom: 2px; margin-bottom: 2px;'>date_time</div><div style='white-space: nowrap; text-overflow: ellipsis; overflow: hidden; padding-top: 2px; margin-top: 2px;'><em>Datetime</em></div></div>"><div><div style="white-space: nowrap; text-overflow: ellipsis; overflow: hidden; padding-bottom: 2px; margin-bottom: 2px;">date_time</div><div style="white-space: nowrap; text-overflow: ellipsis; overflow: hidden; padding-top: 2px; margin-top: 2px;"><em>Datetime</em></div></div></th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" style="color: gray20;font-family: IBM Plex Mono;font-size: 12px;" scope="col" id="<div><div style='white-space: nowrap; text-overflow: ellipsis; overflow: hidden; padding-bottom: 2px; margin-bottom: 2px;'>date</div><div style='white-space: nowrap; text-overflow: ellipsis; overflow: hidden; padding-top: 2px; margin-top: 2px;'><em>Date</em></div></div>"><div><div style="white-space: nowrap; text-overflow: ellipsis; overflow: hidden; padding-bottom: 2px; margin-bottom: 2px;">date</div><div style="white-space: nowrap; text-overflow: ellipsis; overflow: hidden; padding-top: 2px; margin-top: 2px;"><em>Date</em></div></div></th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" style="color: gray20;font-family: IBM Plex Mono;font-size: 12px;" scope="col" id="<div><div style='white-space: nowrap; text-overflow: ellipsis; overflow: hidden; padding-bottom: 2px; margin-bottom: 2px;'>a</div><div style='white-space: nowrap; text-overflow: ellipsis; overflow: hidden; padding-top: 2px; margin-top: 2px;'><em>Int64</em></div></div>"><div><div style="white-space: nowrap; text-overflow: ellipsis; overflow: hidden; padding-bottom: 2px; margin-bottom: 2px;">a</div><div style="white-space: nowrap; text-overflow: ellipsis; overflow: hidden; padding-top: 2px; margin-top: 2px;"><em>Int64</em></div></div></th>
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="1" colspan="1" style="color: gray20;font-family: IBM Plex Mono;font-size: 12px;" scope="col" id="<div><div style='white-space: nowrap; text-overflow: ellipsis; overflow: hidden; padding-bottom: 2px; margin-bottom: 2px;'>b</div><div style='white-space: nowrap; text-overflow: ellipsis; overflow: hidden; padding-top: 2px; margin-top: 2px;'><em>String</em></div></div>"><div><div style="white-space: nowrap; text-overflow: ellipsis; overflow: hidden; padding-bottom: 2px; margin-bottom: 2px;">b</div><div style="white-space: nowrap; text-overflow: ellipsis; overflow: hidden; padding-top: 2px; margin-top: 2px;"><em>String</em></div></div></th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" style="color: gray20;font-family: IBM Plex Mono;font-size: 12px;" scope="col" id="<div><div style='white-space: nowrap; text-overflow: ellipsis; overflow: hidden; padding-bottom: 2px; margin-bottom: 2px;'>c</div><div style='white-space: nowrap; text-overflow: ellipsis; overflow: hidden; padding-top: 2px; margin-top: 2px;'><em>Int64</em></div></div>"><div><div style="white-space: nowrap; text-overflow: ellipsis; overflow: hidden; padding-bottom: 2px; margin-bottom: 2px;">c</div><div style="white-space: nowrap; text-overflow: ellipsis; overflow: hidden; padding-top: 2px; margin-top: 2px;"><em>Int64</em></div></div></th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" style="color: gray20;font-family: IBM Plex Mono;font-size: 12px; border-left: 2px solid black;border-right: 2px solid black;" scope="col" id="<div><div style='white-space: nowrap; text-overflow: ellipsis; overflow: hidden; padding-bottom: 2px; margin-bottom: 2px;'>d</div><div style='white-space: nowrap; text-overflow: ellipsis; overflow: hidden; padding-top: 2px; margin-top: 2px;'><em>Float64</em></div></div>"><div><div style="white-space: nowrap; text-overflow: ellipsis; overflow: hidden; padding-bottom: 2px; margin-bottom: 2px;">d</div><div style="white-space: nowrap; text-overflow: ellipsis; overflow: hidden; padding-top: 2px; margin-top: 2px;"><em>Float64</em></div></div></th>
  <th class="gt_col_heading gt_columns_bottom_border gt_center" rowspan="1" colspan="1" style="color: gray20;font-family: IBM Plex Mono;font-size: 12px;" scope="col" id="<div><div style='white-space: nowrap; text-overflow: ellipsis; overflow: hidden; padding-bottom: 2px; margin-bottom: 2px;'>e</div><div style='white-space: nowrap; text-overflow: ellipsis; overflow: hidden; padding-top: 2px; margin-top: 2px;'><em>Boolean</em></div></div>"><div><div style="white-space: nowrap; text-overflow: ellipsis; overflow: hidden; padding-bottom: 2px; margin-bottom: 2px;">e</div><div style="white-space: nowrap; text-overflow: ellipsis; overflow: hidden; padding-top: 2px; margin-top: 2px;"><em>Boolean</em></div></div></th>
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="1" colspan="1" style="color: gray20;font-family: IBM Plex Mono;font-size: 12px;" scope="col" id="<div><div style='white-space: nowrap; text-overflow: ellipsis; overflow: hidden; padding-bottom: 2px; margin-bottom: 2px;'>f</div><div style='white-space: nowrap; text-overflow: ellipsis; overflow: hidden; padding-top: 2px; margin-top: 2px;'><em>String</em></div></div>"><div><div style="white-space: nowrap; text-overflow: ellipsis; overflow: hidden; padding-bottom: 2px; margin-bottom: 2px;">f</div><div style="white-space: nowrap; text-overflow: ellipsis; overflow: hidden; padding-top: 2px; margin-top: 2px;"><em>String</em></div></div></th>
</tr>
</thead>
<tbody class="gt_table_body">
  <tr>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E; color: gray;font-family: IBM Plex Mono;font-size: 10px; border-right: 2px solid #6699CC80;" class="gt_row gt_right">5</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_right">2016-01-09 12:36:00</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_right">2016-01-09</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_right">8</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_left">3-ldm-038</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_right">7</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E; color: #B22222; background-color: #FFC1C159; border-left: 2px solid black;border-right: 2px solid black;" class="gt_row gt_right">283.94</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_center">True</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_left">low</td>
  </tr>
  <tr>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E; color: gray;font-family: IBM Plex Mono;font-size: 10px; border-right: 2px solid #6699CC80;" class="gt_row gt_right">7</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_right">2016-01-15 18:46:00</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_right">2016-01-15</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_right">7</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_left">1-knw-093</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_right">3</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E; color: #B22222; background-color: #FFC1C159; border-left: 2px solid black;border-right: 2px solid black;" class="gt_row gt_right">843.34</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_center">True</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_left">high</td>
  </tr>
  <tr>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E; color: gray;font-family: IBM Plex Mono;font-size: 10px; border-right: 2px solid #6699CC80;" class="gt_row gt_right">9</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_right">2016-01-20 04:30:00</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_right">2016-01-20</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_right">3</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_left">5-bce-642</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_right">9</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E; color: #B22222; background-color: #FFC1C159; border-left: 2px solid black;border-right: 2px solid black;" class="gt_row gt_right">837.93</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_center">False</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_left">high</td>
  </tr>
  <tr>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E; color: gray;font-family: IBM Plex Mono;font-size: 10px; border-right: 2px solid #6699CC80;" class="gt_row gt_right">10</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_right">2016-01-20 04:30:00</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_right">2016-01-20</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_right">3</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_left">5-bce-642</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_right">9</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E; color: #B22222; background-color: #FFC1C159; border-left: 2px solid black;border-right: 2px solid black;" class="gt_row gt_right">837.93</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_center">False</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_left">high</td>
  </tr>
  <tr>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E; color: gray;font-family: IBM Plex Mono;font-size: 10px; border-right: 2px solid #6699CC80;" class="gt_row gt_right">11</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_right">2016-01-26 20:07:00</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_right">2016-01-26</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_right">4</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_left">2-dmx-010</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_right">7</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E; color: #B22222; background-color: #FFC1C159; border-left: 2px solid black;border-right: 2px solid black;" class="gt_row gt_right">833.98</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_center">True</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_left">low</td>
  </tr>
  <tr>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E; color: gray;font-family: IBM Plex Mono;font-size: 10px; border-right: 2px solid #6699CC80;" class="gt_row gt_right">12</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_right">2016-01-28 02:51:00</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_right">2016-01-28</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_right">2</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_left">7-dmx-010</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_right">8</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E; color: #B22222; background-color: #FFC1C159; border-left: 2px solid black;border-right: 2px solid black;" class="gt_row gt_right">108.34</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_center">False</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_left">low</td>
  </tr>
</tbody>


</table>

</div>
        
</div>
</div>
<p>The use of a table for reporting is ideal here! The main features of this step report table include:</p>
<ol type="1">
<li>a header with summarized information</li>
<li>the selected rows that contain the failures</li>
<li>a highlighted column of interest</li>
</ol>
<p>Different types of validation methods will have step report tables that organize the pertinent information in a way that makes sense for the validation performed.</p>
</section>
<section id="previewing-datasets-across-backends" class="level3">
<h3 class="anchored" data-anchor-id="previewing-datasets-across-backends">Previewing datasets across backends</h3>
<p>Because many of the backends Pointblank supports have varying ways to view the underlying data, we provide a unified <code>preview()</code> function. It gives you a beautiful and consistent view of any data table. Here is how it looks against a 2,000 row DuckDB table that’s included in the package (<code>game_revenue</code>):</p>
<div id="0db7c1ea" class="cell" data-execution_count="4">
<details class="code-fold">
<summary>Show the code</summary>
<div class="code-copy-outer-scaffold"><div class="sourceCode cell-code" id="cb4" style="background: #f1f3f5;"><pre class="sourceCode python code-with-copy"><code class="sourceCode python"><span id="cb4-1">pb.preview(pb.load_dataset(dataset<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"game_revenue"</span>, tbl_type<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"duckdb"</span>))</span></code></pre></div></div>
</details>
<div class="cell-output cell-output-display" data-execution_count="27">
<div id="pb_preview_tbl" style="padding-left:0px;padding-right:0px;padding-top:10px;padding-bottom:10px;overflow-x:auto;overflow-y:auto;width:auto;height:auto;">
<style>
@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans&display=swap');
@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Mono&display=swap');
#pb_preview_tbl table {
          font-family: 'IBM Plex Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Helvetica Neue', 'Fira Sans', 'Droid Sans', Arial, sans-serif;
          -webkit-font-smoothing: antialiased;
          -moz-osx-font-smoothing: grayscale;
        }

#pb_preview_tbl thead, tbody, tfoot, tr, td, th { border-style: none; }
 tr { background-color: transparent; }
#pb_preview_tbl p { margin: 0; padding: 0; }
 #pb_preview_tbl .gt_table { display: table; border-collapse: collapse; line-height: normal; margin-left: auto; margin-right: auto; color: #333333; font-size: 16px; font-weight: normal; font-style: normal; background-color: #FFFFFF; width: auto; border-top-style: solid; border-top-width: 2px; border-top-color: #A8A8A8; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #A8A8A8; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; }
 #pb_preview_tbl .gt_caption { padding-top: 4px; padding-bottom: 4px; }
 #pb_preview_tbl .gt_title { color: #333333; font-size: 125%; font-weight: initial; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; border-bottom-color: #FFFFFF; border-bottom-width: 0; }
 #pb_preview_tbl .gt_subtitle { color: #333333; font-size: 12px; font-weight: initial; padding-top: 3px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; border-top-color: #FFFFFF; border-top-width: 0; }
 #pb_preview_tbl .gt_heading { background-color: #FFFFFF; text-align: left; border-bottom-color: #FFFFFF; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #pb_preview_tbl .gt_bottom_border { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #pb_preview_tbl .gt_col_headings { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #pb_preview_tbl .gt_col_heading { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; border-left-style: solid; border-left-width: 1px; border-left-color: #F2F2F2; border-right-style: solid; border-right-width: 1px; border-right-color: #F2F2F2; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; overflow-x: hidden; }
 #pb_preview_tbl .gt_column_spanner_outer { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; padding-top: 0; padding-bottom: 0; padding-left: 4px; padding-right: 4px; }
 #pb_preview_tbl .gt_column_spanner_outer:first-child { padding-left: 0; }
 #pb_preview_tbl .gt_column_spanner_outer:last-child { padding-right: 0; }
 #pb_preview_tbl .gt_column_spanner { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; overflow-x: hidden; display: inline-block; width: 100%; }
 #pb_preview_tbl .gt_spanner_row { border-bottom-style: hidden; }
 #pb_preview_tbl .gt_group_heading { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; text-align: left; }
 #pb_preview_tbl .gt_empty_group_heading { padding: 0.5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: middle; }
 #pb_preview_tbl .gt_from_md> :first-child { margin-top: 0; }
 #pb_preview_tbl .gt_from_md> :last-child { margin-bottom: 0; }
 #pb_preview_tbl .gt_row { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; margin: 10px; border-top-style: solid; border-top-width: 1px; border-top-color: #D3D3D3; border-left-style: solid; border-left-width: 1px; border-left-color: #E9E9E9; border-right-style: solid; border-right-width: 1px; border-right-color: #E9E9E9; vertical-align: middle; overflow-x: hidden; }
 #pb_preview_tbl .gt_stub { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; }
 #pb_preview_tbl .gt_stub_row_group { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; vertical-align: top; }
 #pb_preview_tbl .gt_row_group_first td { border-top-width: 2px; }
 #pb_preview_tbl .gt_row_group_first th { border-top-width: 2px; }
 #pb_preview_tbl .gt_striped { background-color: rgba(128,128,128,0.05); }
 #pb_preview_tbl .gt_table_body { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #pb_preview_tbl .gt_sourcenotes { color: #333333; background-color: #FFFFFF; border-bottom-style: none; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; }
 #pb_preview_tbl .gt_sourcenote { font-size: 90%; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; text-align: left; }
 #pb_preview_tbl .gt_left { text-align: left; }
 #pb_preview_tbl .gt_center { text-align: center; }
 #pb_preview_tbl .gt_right { text-align: right; font-variant-numeric: tabular-nums; }
 #pb_preview_tbl .gt_font_normal { font-weight: normal; }
 #pb_preview_tbl .gt_font_bold { font-weight: bold; }
 #pb_preview_tbl .gt_font_italic { font-style: italic; }
 #pb_preview_tbl .gt_super { font-size: 65%; }
 #pb_preview_tbl .gt_footnote_marks { font-size: 75%; vertical-align: 0.4em; position: initial; }
 #pb_preview_tbl .gt_asterisk { font-size: 100%; vertical-align: 0; }
 
</style>
<table style="table-layout: fixed;; width: 0px" class="gt_table" data-quarto-disable-processing="false" data-quarto-bootstrap="false">
<colgroup>
  <col style="width:41.2px;">
  <col style="width:127px;">
  <col style="width:197px;">
  <col style="width:205px;">
  <col style="width:205px;">
  <col style="width:80px;">
  <col style="width:80px;">
  <col style="width:104px;">
  <col style="width:135px;">
  <col style="width:88px;">
  <col style="width:119px;">
  <col style="width:111px;">
</colgroup>

<thead>

  <tr class="gt_heading">
    <td colspan="12" class="gt_heading gt_title gt_font_normal"><div><div style="padding-top: 0; padding-bottom: 7px;"><span style="background-color: #000000; color: #FFFFFF; padding: 0.5em 0.5em; position: inherit; text-transform: uppercase; margin: 5px 10px 5px 0px; border: solid 1px #000000; font-weight: bold; padding: 2px 10px 2px 10px; font-size: 10px;">DuckDB</span><span style="background-color: #eecbff; color: #333333; padding: 0.5em 0.5em; position: inherit; text-transform: uppercase; margin: 5px 0px 5px 5px; font-weight: bold; border: solid 1px #eecbff; padding: 2px 15px 2px 15px; font-size: 10px;">Rows</span><span style="background-color: none; color: #333333; padding: 0.5em 0.5em; position: inherit; margin: 5px 0px 5px -4px; font-weight: bold; border: solid 1px #eecbff; padding: 2px 15px 2px 15px; font-size: 10px;">2,000</span><span style="background-color: #BDE7B4; color: #333333; padding: 0.5em 0.5em; position: inherit; text-transform: uppercase; margin: 5px 0px 5px 3px; font-weight: bold; border: solid 1px #BDE7B4; padding: 2px 15px 2px 15px; font-size: 10px;">Columns</span><span style="background-color: none; color: #333333; padding: 0.5em 0.5em; position: inherit; margin: 5px 0px 5px -4px; font-weight: bold; border: solid 1px #BDE7B4; padding: 2px 15px 2px 15px; font-size: 10px;">11</span></div></div></td>
  </tr>
<tr class="gt_col_headings">
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" style="color: gray20;font-family: IBM Plex Mono;font-size: 12px;" scope="col" id=""></th>
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="1" colspan="1" style="color: gray20;font-family: IBM Plex Mono;font-size: 12px;" scope="col" id="<div><div style='white-space: nowrap; text-overflow: ellipsis; overflow: hidden; padding-bottom: 2px; margin-bottom: 2px;'>player_id</div><div style='white-space: nowrap; text-overflow: ellipsis; overflow: hidden; padding-top: 2px; margin-top: 2px;'><em>string</em></div></div>"><div><div style="white-space: nowrap; text-overflow: ellipsis; overflow: hidden; padding-bottom: 2px; margin-bottom: 2px;">player_id</div><div style="white-space: nowrap; text-overflow: ellipsis; overflow: hidden; padding-top: 2px; margin-top: 2px;"><em>string</em></div></div></th>
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="1" colspan="1" style="color: gray20;font-family: IBM Plex Mono;font-size: 12px;" scope="col" id="<div><div style='white-space: nowrap; text-overflow: ellipsis; overflow: hidden; padding-bottom: 2px; margin-bottom: 2px;'>session_id</div><div style='white-space: nowrap; text-overflow: ellipsis; overflow: hidden; padding-top: 2px; margin-top: 2px;'><em>string</em></div></div>"><div><div style="white-space: nowrap; text-overflow: ellipsis; overflow: hidden; padding-bottom: 2px; margin-bottom: 2px;">session_id</div><div style="white-space: nowrap; text-overflow: ellipsis; overflow: hidden; padding-top: 2px; margin-top: 2px;"><em>string</em></div></div></th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" style="color: gray20;font-family: IBM Plex Mono;font-size: 12px;" scope="col" id="<div><div style='white-space: nowrap; text-overflow: ellipsis; overflow: hidden; padding-bottom: 2px; margin-bottom: 2px;'>session_start</div><div style='white-space: nowrap; text-overflow: ellipsis; overflow: hidden; padding-top: 2px; margin-top: 2px;'><em>timestamp</em></div></div>"><div><div style="white-space: nowrap; text-overflow: ellipsis; overflow: hidden; padding-bottom: 2px; margin-bottom: 2px;">session_start</div><div style="white-space: nowrap; text-overflow: ellipsis; overflow: hidden; padding-top: 2px; margin-top: 2px;"><em>timestamp</em></div></div></th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" style="color: gray20;font-family: IBM Plex Mono;font-size: 12px;" scope="col" id="<div><div style='white-space: nowrap; text-overflow: ellipsis; overflow: hidden; padding-bottom: 2px; margin-bottom: 2px;'>time</div><div style='white-space: nowrap; text-overflow: ellipsis; overflow: hidden; padding-top: 2px; margin-top: 2px;'><em>timestamp</em></div></div>"><div><div style="white-space: nowrap; text-overflow: ellipsis; overflow: hidden; padding-bottom: 2px; margin-bottom: 2px;">time</div><div style="white-space: nowrap; text-overflow: ellipsis; overflow: hidden; padding-top: 2px; margin-top: 2px;"><em>timestamp</em></div></div></th>
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="1" colspan="1" style="color: gray20;font-family: IBM Plex Mono;font-size: 12px;" scope="col" id="<div><div style='white-space: nowrap; text-overflow: ellipsis; overflow: hidden; padding-bottom: 2px; margin-bottom: 2px;'>item_type</div><div style='white-space: nowrap; text-overflow: ellipsis; overflow: hidden; padding-top: 2px; margin-top: 2px;'><em>string</em></div></div>"><div><div style="white-space: nowrap; text-overflow: ellipsis; overflow: hidden; padding-bottom: 2px; margin-bottom: 2px;">item_type</div><div style="white-space: nowrap; text-overflow: ellipsis; overflow: hidden; padding-top: 2px; margin-top: 2px;"><em>string</em></div></div></th>
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="1" colspan="1" style="color: gray20;font-family: IBM Plex Mono;font-size: 12px;" scope="col" id="<div><div style='white-space: nowrap; text-overflow: ellipsis; overflow: hidden; padding-bottom: 2px; margin-bottom: 2px;'>item_name</div><div style='white-space: nowrap; text-overflow: ellipsis; overflow: hidden; padding-top: 2px; margin-top: 2px;'><em>string</em></div></div>"><div><div style="white-space: nowrap; text-overflow: ellipsis; overflow: hidden; padding-bottom: 2px; margin-bottom: 2px;">item_name</div><div style="white-space: nowrap; text-overflow: ellipsis; overflow: hidden; padding-top: 2px; margin-top: 2px;"><em>string</em></div></div></th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" style="color: gray20;font-family: IBM Plex Mono;font-size: 12px;" scope="col" id="<div><div style='white-space: nowrap; text-overflow: ellipsis; overflow: hidden; padding-bottom: 2px; margin-bottom: 2px;'>item_revenue</div><div style='white-space: nowrap; text-overflow: ellipsis; overflow: hidden; padding-top: 2px; margin-top: 2px;'><em>float64</em></div></div>"><div><div style="white-space: nowrap; text-overflow: ellipsis; overflow: hidden; padding-bottom: 2px; margin-bottom: 2px;">item_revenue</div><div style="white-space: nowrap; text-overflow: ellipsis; overflow: hidden; padding-top: 2px; margin-top: 2px;"><em>float64</em></div></div></th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" style="color: gray20;font-family: IBM Plex Mono;font-size: 12px;" scope="col" id="<div><div style='white-space: nowrap; text-overflow: ellipsis; overflow: hidden; padding-bottom: 2px; margin-bottom: 2px;'>session_duration</div><div style='white-space: nowrap; text-overflow: ellipsis; overflow: hidden; padding-top: 2px; margin-top: 2px;'><em>float64</em></div></div>"><div><div style="white-space: nowrap; text-overflow: ellipsis; overflow: hidden; padding-bottom: 2px; margin-bottom: 2px;">session_duration</div><div style="white-space: nowrap; text-overflow: ellipsis; overflow: hidden; padding-top: 2px; margin-top: 2px;"><em>float64</em></div></div></th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" style="color: gray20;font-family: IBM Plex Mono;font-size: 12px;" scope="col" id="<div><div style='white-space: nowrap; text-overflow: ellipsis; overflow: hidden; padding-bottom: 2px; margin-bottom: 2px;'>start_day</div><div style='white-space: nowrap; text-overflow: ellipsis; overflow: hidden; padding-top: 2px; margin-top: 2px;'><em>date</em></div></div>"><div><div style="white-space: nowrap; text-overflow: ellipsis; overflow: hidden; padding-bottom: 2px; margin-bottom: 2px;">start_day</div><div style="white-space: nowrap; text-overflow: ellipsis; overflow: hidden; padding-top: 2px; margin-top: 2px;"><em>date</em></div></div></th>
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="1" colspan="1" style="color: gray20;font-family: IBM Plex Mono;font-size: 12px;" scope="col" id="<div><div style='white-space: nowrap; text-overflow: ellipsis; overflow: hidden; padding-bottom: 2px; margin-bottom: 2px;'>acquisition</div><div style='white-space: nowrap; text-overflow: ellipsis; overflow: hidden; padding-top: 2px; margin-top: 2px;'><em>string</em></div></div>"><div><div style="white-space: nowrap; text-overflow: ellipsis; overflow: hidden; padding-bottom: 2px; margin-bottom: 2px;">acquisition</div><div style="white-space: nowrap; text-overflow: ellipsis; overflow: hidden; padding-top: 2px; margin-top: 2px;"><em>string</em></div></div></th>
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="1" colspan="1" style="color: gray20;font-family: IBM Plex Mono;font-size: 12px;" scope="col" id="<div><div style='white-space: nowrap; text-overflow: ellipsis; overflow: hidden; padding-bottom: 2px; margin-bottom: 2px;'>country</div><div style='white-space: nowrap; text-overflow: ellipsis; overflow: hidden; padding-top: 2px; margin-top: 2px;'><em>string</em></div></div>"><div><div style="white-space: nowrap; text-overflow: ellipsis; overflow: hidden; padding-bottom: 2px; margin-bottom: 2px;">country</div><div style="white-space: nowrap; text-overflow: ellipsis; overflow: hidden; padding-top: 2px; margin-top: 2px;"><em>string</em></div></div></th>
</tr>
</thead>
<tbody class="gt_table_body">
  <tr>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E; color: gray;font-family: IBM Plex Mono;font-size: 10px; border-right: 2px solid #6699CC80;" class="gt_row gt_right">1</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_left">ECPANOIXLZHF896</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_left">ECPANOIXLZHF896-eol2j8bs</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_right">2015-01-01 01:31:03+00:00</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_right">2015-01-01 01:31:27+00:00</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_left">iap</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_left">offer2</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_right">8.99</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_right">16.3</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_right">2015-01-01</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_left">google</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_left">Germany</td>
  </tr>
  <tr>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E; color: gray;font-family: IBM Plex Mono;font-size: 10px; border-right: 2px solid #6699CC80;" class="gt_row gt_right">2</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_left">ECPANOIXLZHF896</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_left">ECPANOIXLZHF896-eol2j8bs</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_right">2015-01-01 01:31:03+00:00</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_right">2015-01-01 01:36:57+00:00</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_left">iap</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_left">gems3</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_right">22.49</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_right">16.3</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_right">2015-01-01</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_left">google</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_left">Germany</td>
  </tr>
  <tr>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E; color: gray;font-family: IBM Plex Mono;font-size: 10px; border-right: 2px solid #6699CC80;" class="gt_row gt_right">3</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_left">ECPANOIXLZHF896</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_left">ECPANOIXLZHF896-eol2j8bs</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_right">2015-01-01 01:31:03+00:00</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_right">2015-01-01 01:37:45+00:00</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_left">iap</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_left">gold7</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_right">107.99</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_right">16.3</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_right">2015-01-01</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_left">google</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_left">Germany</td>
  </tr>
  <tr>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E; color: gray;font-family: IBM Plex Mono;font-size: 10px; border-right: 2px solid #6699CC80;" class="gt_row gt_right">4</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_left">ECPANOIXLZHF896</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_left">ECPANOIXLZHF896-eol2j8bs</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_right">2015-01-01 01:31:03+00:00</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_right">2015-01-01 01:42:33+00:00</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_left">ad</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_left">ad_20sec</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_right">0.76</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_right">16.3</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_right">2015-01-01</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_left">google</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_left">Germany</td>
  </tr>
  <tr>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E; border-bottom: 2px solid #6699CC80; color: gray;font-family: IBM Plex Mono;font-size: 10px; border-right: 2px solid #6699CC80;" class="gt_row gt_right">5</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E; border-bottom: 2px solid #6699CC80;" class="gt_row gt_left">ECPANOIXLZHF896</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E; border-bottom: 2px solid #6699CC80;" class="gt_row gt_left">ECPANOIXLZHF896-hdu9jkls</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E; border-bottom: 2px solid #6699CC80;" class="gt_row gt_right">2015-01-01 11:50:02+00:00</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E; border-bottom: 2px solid #6699CC80;" class="gt_row gt_right">2015-01-01 11:55:20+00:00</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E; border-bottom: 2px solid #6699CC80;" class="gt_row gt_left">ad</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E; border-bottom: 2px solid #6699CC80;" class="gt_row gt_left">ad_5sec</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E; border-bottom: 2px solid #6699CC80;" class="gt_row gt_right">0.03</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E; border-bottom: 2px solid #6699CC80;" class="gt_row gt_right">35.2</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E; border-bottom: 2px solid #6699CC80;" class="gt_row gt_right">2015-01-01</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E; border-bottom: 2px solid #6699CC80;" class="gt_row gt_left">google</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E; border-bottom: 2px solid #6699CC80;" class="gt_row gt_left">Germany</td>
  </tr>
  <tr>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E; color: gray;font-family: IBM Plex Mono;font-size: 10px; border-right: 2px solid #6699CC80;" class="gt_row gt_right">1996</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_left">NAOJRDMCSEBI281</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_left">NAOJRDMCSEBI281-j2vs9ilp</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_right">2015-01-21 01:57:50+00:00</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_right">2015-01-21 02:02:50+00:00</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_left">ad</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_left">ad_survey</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_right">1.332</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_right">25.8</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_right">2015-01-11</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_left">organic</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_left">Norway</td>
  </tr>
  <tr>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E; color: gray;font-family: IBM Plex Mono;font-size: 10px; border-right: 2px solid #6699CC80;" class="gt_row gt_right">1997</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_left">NAOJRDMCSEBI281</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_left">NAOJRDMCSEBI281-j2vs9ilp</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_right">2015-01-21 01:57:50+00:00</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_right">2015-01-21 02:22:14+00:00</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_left">ad</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_left">ad_survey</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_right">1.35</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_right">25.8</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_right">2015-01-11</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_left">organic</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_left">Norway</td>
  </tr>
  <tr>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E; color: gray;font-family: IBM Plex Mono;font-size: 10px; border-right: 2px solid #6699CC80;" class="gt_row gt_right">1998</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_left">RMOSWHJGELCI675</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_left">RMOSWHJGELCI675-vbhcsmtr</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_right">2015-01-21 02:39:48+00:00</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_right">2015-01-21 02:40:00+00:00</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_left">ad</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_left">ad_5sec</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_right">0.03</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_right">8.4</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_right">2015-01-10</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_left">other_campaign</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_left">France</td>
  </tr>
  <tr>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E; color: gray;font-family: IBM Plex Mono;font-size: 10px; border-right: 2px solid #6699CC80;" class="gt_row gt_right">1999</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_left">RMOSWHJGELCI675</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_left">RMOSWHJGELCI675-vbhcsmtr</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_right">2015-01-21 02:39:48+00:00</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_right">2015-01-21 02:47:12+00:00</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_left">iap</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_left">offer5</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_right">26.09</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_right">8.4</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_right">2015-01-10</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_left">other_campaign</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_left">France</td>
  </tr>
  <tr>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E; color: gray;font-family: IBM Plex Mono;font-size: 10px; border-right: 2px solid #6699CC80;" class="gt_row gt_right">2000</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_left">GJCXNTWEBIPQ369</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_left">GJCXNTWEBIPQ369-9elq67md</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_right">2015-01-21 03:59:23+00:00</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_right">2015-01-21 04:06:29+00:00</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_left">ad</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_left">ad_5sec</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_right">0.12</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_right">18.5</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_right">2015-01-14</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_left">organic</td>
    <td style="height: 14px; padding: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black;font-family: IBM Plex Mono;font-size: 12px; border-top: 1px solid #E9E9E;border-bottom: 1px solid #E9E9E;" class="gt_row gt_left">United States</td>
  </tr>
</tbody>


</table>

</div>
        
</div>
</div>
<p>Notice that the table displays only 10 rows by default, 5 from the top and 5 from the bottom. The grey text on the left of the table indicates the row number, and a blue line helps demarcate the top and bottom rows.</p>
<p>The <code>preview()</code> function had a few design goals in mind:</p>
<ul>
<li>get the dimensions of the table and display them prominently in the header</li>
<li>provide the column names and the column types</li>
<li>have a consistent line height along with a sensible limit to the column width</li>
<li>use a monospaced typeface having high legibility</li>
<li>should work for all sorts of tables!</li>
</ul>
<p>This is a nice drop-in replacement for looking at DataFrames or Ibis tables (the types of tables that Pointblank can work with). If you were to inspect the DuckDB table materialized by <code>pb.load_dataset(dataset="game_revenue", tbl_type="duckdb")</code> without <code>preview()</code> you’d get this:</p>
<div id="196049bd" class="cell" data-execution_count="5">
<details class="code-fold">
<summary>Show the code</summary>
<div class="code-copy-outer-scaffold"><div class="sourceCode cell-code" id="cb5" style="background: #f1f3f5;"><pre class="sourceCode python code-with-copy"><code class="sourceCode python"><span id="cb5-1">pb.load_dataset(dataset<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"game_revenue"</span>, tbl_type<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"duckdb"</span>)</span></code></pre></div></div>
</details>
<div class="cell-output cell-output-display" data-execution_count="28">
<pre style="white-space:pre;overflow-x:auto;line-height:normal;font-family:Menlo,'DejaVu Sans Mono',consolas,'Courier New',monospace">DatabaseTable: game_revenue
  player_id        string
  session_id       string
  session_start    timestamp('UTC', 6)
  time             timestamp('UTC', 6)
  item_type        string
  item_name        string
  item_revenue     float64
  session_duration float64
  start_day        date
  acquisition      string
  country          string
</pre>
</div>
</div>
<p>Which is not nearly as good.</p>
</section>
<section id="in-closing" class="level3">
<h3 class="anchored" data-anchor-id="in-closing">In closing</h3>
<p>We hope this post is a good introduction to Pointblank and that it provides some insight on how Great Tables makes sense for reporting in a different library. If you’d like to learn more about Pointblank, please visit the <a href="https://posit-dev.github.io/pointblank/">project website</a> and check out the many <a href="https://posit-dev.github.io/pointblank/demos/">examples</a>.</p>


</section>

 ]]></description>
  <guid>https://posit-dev.github.io/great-tables/blog/pointblank-intro/</guid>
  <pubDate>Tue, 11 Feb 2025 00:00:00 GMT</pubDate>
</item>
<item>
  <title>Style Table Body with mask= in loc.body()</title>
  <dc:creator>Jerry Wu</dc:creator>
  <link>https://posit-dev.github.io/great-tables/blog/locbody-mask/</link>
  <description><![CDATA[ 




<p>In Great Tables <code>0.16.0</code>, we introduced the <code>mask=</code> parameter in <a href="../../reference/loc.body.html#great_tables.loc.body" title="0"><code>loc.body()</code></a>, enabling users to apply conditional styling to rows on a per-column basis more efficiently when working with a Polars DataFrame. This post will demonstrate how it works and compare it with the “old-fashioned” approach:</p>
<ul>
<li><strong>Leveraging the <code>mask=</code> parameter in <a href="../../reference/loc.body.html#great_tables.loc.body" title="0"><code>loc.body()</code></a>:</strong> Use Polars expressions for streamlined styling.</li>
<li><strong>Utilizing the <code>locations=</code> parameter in <a href="../../reference/GT.tab_style.html#great_tables.GT.tab_style" title="0"><code>GT.tab_style()</code></a>:</strong> Pass a list of <a href="../../reference/loc.body.html#great_tables.loc.body" title="0"><code>loc.body()</code></a> objects.</li>
</ul>
<p>Let’s dive in.</p>
<section id="preparations" class="level3">
<h3 class="anchored" data-anchor-id="preparations">Preparations</h3>
<p>We’ll use the built-in dataset <code>gtcars</code> to create a Polars DataFrame. Next, we’ll select the columns <code>mfr</code>, <code>drivetrain</code>, <code>year</code>, and <code>hp</code> to create a small pivoted table named <code>df_mini</code>. Finally, we’ll pass <code>df_mini</code> to the <a href="../../reference/GT.html#great_tables.GT" title="0"><code>GT</code></a> object to create a table named <code>gt</code>, using <code>drivetrain</code> as the <code>rowname_col=</code> and <code>mfr</code> as the <code>groupname_col=</code>, as shown below:</p>
<div id="d9816406" class="cell" data-execution_count="1">
<details class="code-fold">
<summary>Show the Code</summary>
<div class="code-copy-outer-scaffold"><div class="sourceCode cell-code" id="cb1" style="background: #f1f3f5;"><pre class="sourceCode python code-with-copy"><code class="sourceCode python"><span id="cb1-1"><span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">import</span> polars <span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">as</span> pl</span>
<span id="cb1-2"><span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">from</span> great_tables <span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">import</span> GT, loc, style</span>
<span id="cb1-3"><span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">from</span> great_tables.data <span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">import</span> gtcars</span>
<span id="cb1-4"><span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">from</span> polars <span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">import</span> selectors <span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">as</span> cs</span>
<span id="cb1-5"></span>
<span id="cb1-6">year_cols <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> [<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"2014"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"2015"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"2016"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"2017"</span>]</span>
<span id="cb1-7">df_mini <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> (</span>
<span id="cb1-8">    pl.from_pandas(gtcars)</span>
<span id="cb1-9">    .<span class="bu" style="color: null;
background-color: null;
font-style: inherit;">filter</span>(pl.col(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"mfr"</span>).is_in([<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Ferrari"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Lamborghini"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"BMW"</span>]))</span>
<span id="cb1-10">    .sort(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"drivetrain"</span>)</span>
<span id="cb1-11">    .pivot(on<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"year"</span>, index<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>[<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"mfr"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"drivetrain"</span>], values<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"hp"</span>, aggregate_function<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"mean"</span>)</span>
<span id="cb1-12">    .select([<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"mfr"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"drivetrain"</span>, <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">*</span>year_cols])</span>
<span id="cb1-13">)</span>
<span id="cb1-14"></span>
<span id="cb1-15">gt <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> GT(df_mini).tab_stub(rowname_col<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"drivetrain"</span>, groupname_col<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"mfr"</span>).opt_stylize(color<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"cyan"</span>)</span>
<span id="cb1-16">gt</span></code></pre></div></div>
</details>
<div class="cell-output cell-output-display" data-execution_count="1">
<div id="bayjetsvyg" style="padding-left:0px;padding-right:0px;padding-top:10px;padding-bottom:10px;overflow-x:auto;overflow-y:auto;width:auto;height:auto;">
<style>
#bayjetsvyg table {
          font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Helvetica Neue', 'Fira Sans', 'Droid Sans', Arial, sans-serif;
          -webkit-font-smoothing: antialiased;
          -moz-osx-font-smoothing: grayscale;
        }

#bayjetsvyg thead, tbody, tfoot, tr, td, th { border-style: none; }
 tr { background-color: transparent; }
#bayjetsvyg p { margin: 0; padding: 0; }
 #bayjetsvyg .gt_table { display: table; border-collapse: collapse; line-height: normal; margin-left: auto; margin-right: auto; color: #333333; font-size: 16px; font-weight: normal; font-style: normal; background-color: #FFFFFF; width: auto; border-top-style: solid; border-top-width: 2px; border-top-color: #016763; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #016763; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; }
 #bayjetsvyg .gt_caption { padding-top: 4px; padding-bottom: 4px; }
 #bayjetsvyg .gt_title { color: #333333; font-size: 125%; font-weight: initial; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; border-bottom-color: #FFFFFF; border-bottom-width: 0; }
 #bayjetsvyg .gt_subtitle { color: #333333; font-size: 85%; font-weight: initial; padding-top: 3px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; border-top-color: #FFFFFF; border-top-width: 0; }
 #bayjetsvyg .gt_heading { background-color: #FFFFFF; text-align: center; border-bottom-color: #FFFFFF; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #bayjetsvyg .gt_bottom_border { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #01837B; }
 #bayjetsvyg .gt_col_headings { border-top-style: solid; border-top-width: 2px; border-top-color: #01837B; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #01837B; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #bayjetsvyg .gt_col_heading { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; overflow-x: hidden; }
 #bayjetsvyg .gt_column_spanner_outer { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; padding-top: 0; padding-bottom: 0; padding-left: 4px; padding-right: 4px; }
 #bayjetsvyg .gt_column_spanner_outer:first-child { padding-left: 0; }
 #bayjetsvyg .gt_column_spanner_outer:last-child { padding-right: 0; }
 #bayjetsvyg .gt_column_spanner { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #01837B; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; overflow-x: hidden; display: inline-block; width: 100%; }
 #bayjetsvyg .gt_spanner_row { border-bottom-style: hidden; }
 #bayjetsvyg .gt_group_heading { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-top-style: solid; border-top-width: 2px; border-top-color: #01837B; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #01837B; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; text-align: left; }
 #bayjetsvyg .gt_empty_group_heading { padding: 0.5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; border-top-style: solid; border-top-width: 2px; border-top-color: #01837B; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #01837B; vertical-align: middle; }
 #bayjetsvyg .gt_from_md> :first-child { margin-top: 0; }
 #bayjetsvyg .gt_from_md> :last-child { margin-bottom: 0; }
 #bayjetsvyg .gt_row { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; margin: 10px; border-top-style: none; border-top-width: 1px; border-top-color: #A5FEF2; border-left-style: none; border-left-width: 1px; border-left-color: #A5FEF2; border-right-style: none; border-right-width: 1px; border-right-color: #A5FEF2; vertical-align: middle; overflow-x: hidden; }
 #bayjetsvyg .gt_stub { color: #FFFFFF; background-color: #01837B; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #01837B; padding-left: 5px; padding-right: 5px; }
 #bayjetsvyg .gt_stub_row_group { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; vertical-align: top; }
 #bayjetsvyg .gt_row_group_first td { border-top-width: 2px; }
 #bayjetsvyg .gt_row_group_first th { border-top-width: 2px; }
 #bayjetsvyg .gt_striped { color: #333333; background-color: #F4F4F4; }
 #bayjetsvyg .gt_table_body { border-top-style: solid; border-top-width: 2px; border-top-color: #01837B; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #01837B; }
 #bayjetsvyg .gt_grand_summary_row { color: #333333; background-color: #A5FEF2; text-transform: inherit; padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; }
 #bayjetsvyg .gt_first_grand_summary_row_bottom { border-top-style: double; border-top-width: 6px; border-top-color: #D3D3D3; }
 #bayjetsvyg .gt_last_grand_summary_row_top { border-bottom-style: double; border-bottom-width: 6px; border-bottom-color: #D3D3D3; }
 #bayjetsvyg .gt_sourcenotes { color: #333333; background-color: #FFFFFF; border-bottom-style: none; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; }
 #bayjetsvyg .gt_sourcenote { font-size: 90%; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; text-align: left; }
 #bayjetsvyg .gt_left { text-align: left; }
 #bayjetsvyg .gt_center { text-align: center; }
 #bayjetsvyg .gt_right { text-align: right; font-variant-numeric: tabular-nums; }
 #bayjetsvyg .gt_font_normal { font-weight: normal; }
 #bayjetsvyg .gt_font_bold { font-weight: bold; }
 #bayjetsvyg .gt_font_italic { font-style: italic; }
 #bayjetsvyg .gt_super { font-size: 65%; }
 #bayjetsvyg .gt_footnote_marks { font-size: 75%; vertical-align: 0.4em; position: initial; }
 #bayjetsvyg .gt_asterisk { font-size: 100%; vertical-align: 0; }
 
</style>
<table class="gt_table" data-quarto-disable-processing="false" data-quarto-bootstrap="false">
<thead>

<tr class="gt_col_headings">
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="1" colspan="1" scope="col" id=""></th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="2014">2014</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="2015">2015</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="2016">2016</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="2017">2017</th>
</tr>
</thead>
<tbody class="gt_table_body">
  <tr class="gt_group_heading_row">
    <th class="gt_group_heading" colspan="5">Ferrari</th>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">awd</th>
    <td class="gt_row gt_right">None</td>
    <td class="gt_row gt_right">652.0</td>
    <td class="gt_row gt_right">None</td>
    <td class="gt_row gt_right">680.0</td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">rwd</th>
    <td class="gt_row gt_right gt_striped">562.0</td>
    <td class="gt_row gt_right gt_striped">678.4</td>
    <td class="gt_row gt_right gt_striped">661.0</td>
    <td class="gt_row gt_right gt_striped">None</td>
  </tr>
  <tr class="gt_group_heading_row">
    <th class="gt_group_heading" colspan="5">Lamborghini</th>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">awd</th>
    <td class="gt_row gt_right">None</td>
    <td class="gt_row gt_right">700.0</td>
    <td class="gt_row gt_right">None</td>
    <td class="gt_row gt_right">None</td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">rwd</th>
    <td class="gt_row gt_right gt_striped">550.0</td>
    <td class="gt_row gt_right gt_striped">610.0</td>
    <td class="gt_row gt_right gt_striped">None</td>
    <td class="gt_row gt_right gt_striped">None</td>
  </tr>
  <tr class="gt_group_heading_row">
    <th class="gt_group_heading" colspan="5">BMW</th>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">awd</th>
    <td class="gt_row gt_right">None</td>
    <td class="gt_row gt_right">None</td>
    <td class="gt_row gt_right">357.0</td>
    <td class="gt_row gt_right">None</td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">rwd</th>
    <td class="gt_row gt_right gt_striped">None</td>
    <td class="gt_row gt_right gt_striped">None</td>
    <td class="gt_row gt_right gt_striped">465.0</td>
    <td class="gt_row gt_right gt_striped">None</td>
  </tr>
</tbody>


</table>

</div>
</div>
</div>
<p>The numbers in the cells represent the average horsepower for each combination of <code>mfr</code> and <code>drivetrain</code> for a specific year.</p>
</section>
<section id="leveraging-the-mask-parameter-in-loc.body" class="level3">
<h3 class="anchored" data-anchor-id="leveraging-the-mask-parameter-in-loc.body">Leveraging the <code>mask=</code> parameter in <a href="../../reference/loc.body.html#great_tables.loc.body" title="0"><code>loc.body()</code></a></h3>
<p>The <code>mask=</code> parameter in <a href="../../reference/loc.body.html#great_tables.loc.body" title="0"><code>loc.body()</code></a> accepts a Polars expression that evaluates to a boolean result for each cell.</p>
<p>Here’s how we can use it to achieve the two goals:</p>
<ul>
<li>Highlight the cell text in red if the column datatype is numerical and the cell value exceeds 650.</li>
<li>Fill the background color as lightgrey if the cell value is missing in the last two columns (<code>2016</code> and <code>2017</code>).</li>
</ul>
<div id="7261e5c9" class="cell" data-execution_count="2">
<div class="code-copy-outer-scaffold"><div class="sourceCode cell-code" id="cb2" style="background: #f1f3f5;"><pre class="sourceCode python code-with-copy"><code class="sourceCode python"><span id="cb2-1">(</span>
<span id="cb2-2">    gt.tab_style(</span>
<span id="cb2-3">        style<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>style.text(color<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"red"</span>),</span>
<span id="cb2-4">        locations<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>loc.body(mask<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>cs.numeric().gt(<span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">650</span>))</span>
<span id="cb2-5">    ).tab_style(</span>
<span id="cb2-6">        style<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>style.fill(color<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"lightgrey"</span>),</span>
<span id="cb2-7">        locations<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>loc.body(mask<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>pl.nth(<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">-</span><span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">2</span>, <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">-</span><span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">1</span>).is_null()),</span>
<span id="cb2-8">    )</span>
<span id="cb2-9">)</span></code></pre></div></div>
<div class="cell-output cell-output-display" data-execution_count="2">
<div id="tpewkpylxv" style="padding-left:0px;padding-right:0px;padding-top:10px;padding-bottom:10px;overflow-x:auto;overflow-y:auto;width:auto;height:auto;">
<style>
#tpewkpylxv table {
          font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Helvetica Neue', 'Fira Sans', 'Droid Sans', Arial, sans-serif;
          -webkit-font-smoothing: antialiased;
          -moz-osx-font-smoothing: grayscale;
        }

#tpewkpylxv thead, tbody, tfoot, tr, td, th { border-style: none; }
 tr { background-color: transparent; }
#tpewkpylxv p { margin: 0; padding: 0; }
 #tpewkpylxv .gt_table { display: table; border-collapse: collapse; line-height: normal; margin-left: auto; margin-right: auto; color: #333333; font-size: 16px; font-weight: normal; font-style: normal; background-color: #FFFFFF; width: auto; border-top-style: solid; border-top-width: 2px; border-top-color: #016763; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #016763; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; }
 #tpewkpylxv .gt_caption { padding-top: 4px; padding-bottom: 4px; }
 #tpewkpylxv .gt_title { color: #333333; font-size: 125%; font-weight: initial; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; border-bottom-color: #FFFFFF; border-bottom-width: 0; }
 #tpewkpylxv .gt_subtitle { color: #333333; font-size: 85%; font-weight: initial; padding-top: 3px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; border-top-color: #FFFFFF; border-top-width: 0; }
 #tpewkpylxv .gt_heading { background-color: #FFFFFF; text-align: center; border-bottom-color: #FFFFFF; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #tpewkpylxv .gt_bottom_border { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #01837B; }
 #tpewkpylxv .gt_col_headings { border-top-style: solid; border-top-width: 2px; border-top-color: #01837B; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #01837B; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #tpewkpylxv .gt_col_heading { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; overflow-x: hidden; }
 #tpewkpylxv .gt_column_spanner_outer { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; padding-top: 0; padding-bottom: 0; padding-left: 4px; padding-right: 4px; }
 #tpewkpylxv .gt_column_spanner_outer:first-child { padding-left: 0; }
 #tpewkpylxv .gt_column_spanner_outer:last-child { padding-right: 0; }
 #tpewkpylxv .gt_column_spanner { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #01837B; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; overflow-x: hidden; display: inline-block; width: 100%; }
 #tpewkpylxv .gt_spanner_row { border-bottom-style: hidden; }
 #tpewkpylxv .gt_group_heading { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-top-style: solid; border-top-width: 2px; border-top-color: #01837B; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #01837B; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; text-align: left; }
 #tpewkpylxv .gt_empty_group_heading { padding: 0.5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; border-top-style: solid; border-top-width: 2px; border-top-color: #01837B; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #01837B; vertical-align: middle; }
 #tpewkpylxv .gt_from_md> :first-child { margin-top: 0; }
 #tpewkpylxv .gt_from_md> :last-child { margin-bottom: 0; }
 #tpewkpylxv .gt_row { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; margin: 10px; border-top-style: none; border-top-width: 1px; border-top-color: #A5FEF2; border-left-style: none; border-left-width: 1px; border-left-color: #A5FEF2; border-right-style: none; border-right-width: 1px; border-right-color: #A5FEF2; vertical-align: middle; overflow-x: hidden; }
 #tpewkpylxv .gt_stub { color: #FFFFFF; background-color: #01837B; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #01837B; padding-left: 5px; padding-right: 5px; }
 #tpewkpylxv .gt_stub_row_group { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; vertical-align: top; }
 #tpewkpylxv .gt_row_group_first td { border-top-width: 2px; }
 #tpewkpylxv .gt_row_group_first th { border-top-width: 2px; }
 #tpewkpylxv .gt_striped { color: #333333; background-color: #F4F4F4; }
 #tpewkpylxv .gt_table_body { border-top-style: solid; border-top-width: 2px; border-top-color: #01837B; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #01837B; }
 #tpewkpylxv .gt_grand_summary_row { color: #333333; background-color: #A5FEF2; text-transform: inherit; padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; }
 #tpewkpylxv .gt_first_grand_summary_row_bottom { border-top-style: double; border-top-width: 6px; border-top-color: #D3D3D3; }
 #tpewkpylxv .gt_last_grand_summary_row_top { border-bottom-style: double; border-bottom-width: 6px; border-bottom-color: #D3D3D3; }
 #tpewkpylxv .gt_sourcenotes { color: #333333; background-color: #FFFFFF; border-bottom-style: none; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; }
 #tpewkpylxv .gt_sourcenote { font-size: 90%; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; text-align: left; }
 #tpewkpylxv .gt_left { text-align: left; }
 #tpewkpylxv .gt_center { text-align: center; }
 #tpewkpylxv .gt_right { text-align: right; font-variant-numeric: tabular-nums; }
 #tpewkpylxv .gt_font_normal { font-weight: normal; }
 #tpewkpylxv .gt_font_bold { font-weight: bold; }
 #tpewkpylxv .gt_font_italic { font-style: italic; }
 #tpewkpylxv .gt_super { font-size: 65%; }
 #tpewkpylxv .gt_footnote_marks { font-size: 75%; vertical-align: 0.4em; position: initial; }
 #tpewkpylxv .gt_asterisk { font-size: 100%; vertical-align: 0; }
 
</style>
<table class="gt_table" data-quarto-disable-processing="false" data-quarto-bootstrap="false">
<thead>

<tr class="gt_col_headings">
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="1" colspan="1" scope="col" id=""></th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="2014">2014</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="2015">2015</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="2016">2016</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="2017">2017</th>
</tr>
</thead>
<tbody class="gt_table_body">
  <tr class="gt_group_heading_row">
    <th class="gt_group_heading" colspan="5">Ferrari</th>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">awd</th>
    <td class="gt_row gt_right">None</td>
    <td style="color: red;" class="gt_row gt_right">652.0</td>
    <td style="background-color: lightgrey;" class="gt_row gt_right">None</td>
    <td style="color: red;" class="gt_row gt_right">680.0</td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">rwd</th>
    <td class="gt_row gt_right gt_striped">562.0</td>
    <td style="color: red;" class="gt_row gt_right gt_striped">678.4</td>
    <td style="color: red;" class="gt_row gt_right gt_striped">661.0</td>
    <td style="background-color: lightgrey;" class="gt_row gt_right gt_striped">None</td>
  </tr>
  <tr class="gt_group_heading_row">
    <th class="gt_group_heading" colspan="5">Lamborghini</th>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">awd</th>
    <td class="gt_row gt_right">None</td>
    <td style="color: red;" class="gt_row gt_right">700.0</td>
    <td style="background-color: lightgrey;" class="gt_row gt_right">None</td>
    <td style="background-color: lightgrey;" class="gt_row gt_right">None</td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">rwd</th>
    <td class="gt_row gt_right gt_striped">550.0</td>
    <td class="gt_row gt_right gt_striped">610.0</td>
    <td style="background-color: lightgrey;" class="gt_row gt_right gt_striped">None</td>
    <td style="background-color: lightgrey;" class="gt_row gt_right gt_striped">None</td>
  </tr>
  <tr class="gt_group_heading_row">
    <th class="gt_group_heading" colspan="5">BMW</th>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">awd</th>
    <td class="gt_row gt_right">None</td>
    <td class="gt_row gt_right">None</td>
    <td class="gt_row gt_right">357.0</td>
    <td style="background-color: lightgrey;" class="gt_row gt_right">None</td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">rwd</th>
    <td class="gt_row gt_right gt_striped">None</td>
    <td class="gt_row gt_right gt_striped">None</td>
    <td class="gt_row gt_right gt_striped">465.0</td>
    <td style="background-color: lightgrey;" class="gt_row gt_right gt_striped">None</td>
  </tr>
</tbody>


</table>

</div>
</div>
</div>
<p>In this example:</p>
<ul>
<li><code>cs.numeric()</code> targets numerical columns, and <code>.gt(650)</code> checks if the cell value is greater than 650.</li>
<li><code>pl.nth(-2, -1)</code> targets the last two columns, and <code>.is_null()</code> identifies missing values.</li>
</ul>
<p>Did you notice that we can use Polars selectors and expressions to dynamically identify columns at runtime? This is definitely a killer feature when working with pivoted operations.</p>
<p>The <code>mask=</code> parameter acts as a syntactic sugar, streamlining the process and removing the need to loop through columns manually.</p>
<div class="callout callout-style-default callout-warning callout-titled">
<div class="callout-header d-flex align-content-center" data-bs-toggle="collapse" data-bs-target=".callout-1-contents" aria-controls="callout-1" aria-expanded="true" aria-label="Toggle callout">
<div class="callout-icon-container">
<i class="callout-icon"></i>
</div>
<div class="callout-title-container flex-fill">
<span class="screen-reader-only">Warning</span>Using <code>mask=</code> Independently
</div>
<div class="callout-btn-toggle d-inline-block border-0 py-1 ps-1 pe-0 float-end"><i class="callout-toggle"></i></div>
</div>
<div id="callout-1" class="callout-1-contents callout-collapse collapse show">
<div class="callout-body-container callout-body">
<p><code>mask=</code> should not be used in combination with the <code>columns</code> or <code>rows</code> arguments. Attempting to do so will raise a <code>ValueError</code>.</p>
</div>
</div>
</div>
</section>
<section id="utilizing-the-locations-parameter-in-gt.tab_style" class="level3">
<h3 class="anchored" data-anchor-id="utilizing-the-locations-parameter-in-gt.tab_style">Utilizing the <code>locations=</code> parameter in <a href="../../reference/GT.tab_style.html#great_tables.GT.tab_style" title="0"><code>GT.tab_style()</code></a></h3>
<p>A more “old-fashioned” approach involves passing a list of <a href="../../reference/loc.body.html#great_tables.loc.body" title="0"><code>loc.body()</code></a> objects to the <code>locations=</code> parameter in <a href="../../reference/GT.tab_style.html#great_tables.GT.tab_style" title="0"><code>GT.tab_style()</code></a>:</p>
<div id="ed190cdc" class="cell" data-execution_count="3">
<div class="code-copy-outer-scaffold"><div class="sourceCode cell-code" id="cb3" style="background: #f1f3f5;"><pre class="sourceCode python code-with-copy"><code class="sourceCode python"><span id="cb3-1">(</span>
<span id="cb3-2">    gt.tab_style(</span>
<span id="cb3-3">        style<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>style.text(color<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"red"</span>),</span>
<span id="cb3-4">        locations<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>[loc.body(columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>col, rows<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>pl.col(col).gt(<span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">650</span>))</span>
<span id="cb3-5">                   <span class="cf" style="color: #003B4F;
background-color: null;
font-weight: bold;
font-style: inherit;">for</span> col <span class="kw" style="color: #003B4F;
background-color: null;
font-weight: bold;
font-style: inherit;">in</span> year_cols],</span>
<span id="cb3-6">    ).tab_style(</span>
<span id="cb3-7">        style<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>style.fill(color<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"lightgrey"</span>),</span>
<span id="cb3-8">        locations<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>[loc.body(columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>col, rows<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>pl.col(col).is_null())</span>
<span id="cb3-9">                   <span class="cf" style="color: #003B4F;
background-color: null;
font-weight: bold;
font-style: inherit;">for</span> col <span class="kw" style="color: #003B4F;
background-color: null;
font-weight: bold;
font-style: inherit;">in</span> year_cols[<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">-</span><span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">2</span>:]],</span>
<span id="cb3-10">    )</span>
<span id="cb3-11">)</span></code></pre></div></div>
</div>
<p>This approach, though functional, demands additional effort:</p>
<ul>
<li>Explicitly preparing the column names in advance.</li>
<li>Specifying the <code>columns=</code> and <code>rows=</code> arguments for each <a href="../../reference/loc.body.html#great_tables.loc.body" title="0"><code>loc.body()</code></a> in the loop.</li>
</ul>
<p>While effective, it is less efficient and more verbose compared to the first approach.</p>
</section>
<section id="wrapping-up" class="level3">
<h3 class="anchored" data-anchor-id="wrapping-up">Wrapping up</h3>
<p>With the introduction of the <code>mask=</code> parameter in <a href="../../reference/loc.body.html#great_tables.loc.body" title="0"><code>loc.body()</code></a>, users can now style the table body in a more vectorized-like manner, akin to using <code>df.apply()</code> in Pandas, enhancing the overall user experience.</p>
<p>We extend our gratitude to <a href="https://github.com/igorcalabria"><span class="citation" data-cites="igorcalabria">@igorcalabria</span></a> for suggesting this feature in <a href="https://github.com/posit-dev/great-tables/issues/389">#389</a> and providing an insightful explanation of its utility. A special thanks to <a href="https://github.com/henryharbeck"><span class="citation" data-cites="henryharbeck">@henryharbeck</span></a> for providing the second approach.</p>
<p>We hope you enjoy this new functionality as much as we do! Have ideas to make Great Tables even better? Share them with us via <a href="https://github.com/posit-dev/great-tables/issues">GitHub Issues</a>. We’re always amazed by the creativity of our users! See you, until the next great table.</p>


</section>

 ]]></description>
  <guid>https://posit-dev.github.io/great-tables/blog/locbody-mask/</guid>
  <pubDate>Fri, 24 Jan 2025 00:00:00 GMT</pubDate>
</item>
<item>
  <title>Great Tables v0.15.0: Flags, Icons, and Other Formatting Goodies</title>
  <dc:creator>Rich Iannone</dc:creator>
  <link>https://posit-dev.github.io/great-tables/blog/introduction-0.15.0/</link>
  <description><![CDATA[ 




<p>The development of Great Tables is really moving along these days. We just released version <code>0.15.0</code> and it adds quite a few nice things to the package. The features we’ll highlight in this post are:</p>
<ul>
<li>adding flag icons with the new <code>fmt_flag()</code> method</li>
<li>peppering your table cells with Font Awesome icons via <code>fmt_icon()</code></li>
<li>support for displaying accounting notation with four number-based formatting methods</li>
</ul>
<p>Let’s look at each of these in turn!</p>
<section id="using-fmt_flag-to-incorporate-country-flag-icons" class="level3">
<h3 class="anchored" data-anchor-id="using-fmt_flag-to-incorporate-country-flag-icons">Using <code>fmt_flag()</code> to incorporate country flag icons</h3>
<p>When tables contain country-level data, having a more visual representation for a country can help the reader more quickly parse the table contents. The new <code>fmt_flag()</code> method makes this easy to accomplish. You just need to have either <a href="https://en.wikipedia.org/wiki/ISO_3166-1_alpha-2">two-letter country codes</a> or <a href="https://en.wikipedia.org/wiki/ISO_3166-1_alpha-3">three-letter country codes</a> in a column.</p>
<p>Here’s an example where country flags, shown as simplified circular icons, can be added to a table with <code>fmt_flag()</code>:</p>
<div id="1eaaa57a" class="cell" data-execution_count="1">
<div class="code-copy-outer-scaffold"><div class="sourceCode cell-code" id="cb1" style="background: #f1f3f5;"><pre class="sourceCode python code-with-copy"><code class="sourceCode python"><span id="cb1-1"><span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">from</span> great_tables <span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">import</span> GT</span>
<span id="cb1-2"><span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">from</span> great_tables.data <span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">import</span> peeps</span>
<span id="cb1-3"><span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">import</span> polars <span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">as</span> pl</span>
<span id="cb1-4"></span>
<span id="cb1-5">peeps_mini <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> (</span>
<span id="cb1-6">    pl.from_pandas(peeps)</span>
<span id="cb1-7">    .<span class="bu" style="color: null;
background-color: null;
font-style: inherit;">filter</span>(pl.col(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"dob"</span>).<span class="bu" style="color: null;
background-color: null;
font-style: inherit;">str</span>.<span class="bu" style="color: null;
background-color: null;
font-style: inherit;">slice</span>(offset<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">0</span>, length<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">4</span>) <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">==</span> <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"1988"</span>)</span>
<span id="cb1-8">    .with_columns(name<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>pl.col(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"name_given"</span>) <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">+</span> <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">" "</span> <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">+</span> pl.col(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"name_family"</span>))</span>
<span id="cb1-9">    .fill_null(value<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">""</span>)</span>
<span id="cb1-10">    .select([<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"country"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"name"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"address"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"city"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"state_prov"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"postcode"</span>])</span>
<span id="cb1-11">)</span>
<span id="cb1-12"></span>
<span id="cb1-13">(</span>
<span id="cb1-14">    GT(peeps_mini)</span>
<span id="cb1-15">    .tab_header(title<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Our Contacts (Born in 1988)"</span>)</span>
<span id="cb1-16">    .fmt_flag(columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"country"</span>)</span>
<span id="cb1-17">    .opt_vertical_padding(scale<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="fl" style="color: #AD0000;
background-color: null;
font-style: inherit;">0.5</span>)</span>
<span id="cb1-18">    .cols_label(</span>
<span id="cb1-19">        country<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">""</span>,</span>
<span id="cb1-20">        name<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Name"</span>,</span>
<span id="cb1-21">        address<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Address"</span>,</span>
<span id="cb1-22">        city<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"City"</span>,</span>
<span id="cb1-23">        state_prov<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"State/Prov."</span>,</span>
<span id="cb1-24">        postcode<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Zip/Postcode"</span>,</span>
<span id="cb1-25">    )</span>
<span id="cb1-26">)</span></code></pre></div></div>
<div class="cell-output cell-output-display" data-execution_count="1">
<div id="npddckauwk" style="padding-left:0px;padding-right:0px;padding-top:10px;padding-bottom:10px;overflow-x:auto;overflow-y:auto;width:auto;height:auto;">
<style>
#npddckauwk table {
          font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Helvetica Neue', 'Fira Sans', 'Droid Sans', Arial, sans-serif;
          -webkit-font-smoothing: antialiased;
          -moz-osx-font-smoothing: grayscale;
        }

#npddckauwk thead, tbody, tfoot, tr, td, th { border-style: none; }
 tr { background-color: transparent; }
#npddckauwk p { margin: 0; padding: 0; }
 #npddckauwk .gt_table { display: table; border-collapse: collapse; line-height: normal; margin-left: auto; margin-right: auto; color: #333333; font-size: 16px; font-weight: normal; font-style: normal; background-color: #FFFFFF; width: auto; border-top-style: solid; border-top-width: 2px; border-top-color: #A8A8A8; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #A8A8A8; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; }
 #npddckauwk .gt_caption { padding-top: 4px; padding-bottom: 4px; }
 #npddckauwk .gt_title { color: #333333; font-size: 125%; font-weight: initial; padding-top: 2px; padding-bottom: 2px; padding-left: 5px; padding-right: 5px; border-bottom-color: #FFFFFF; border-bottom-width: 0; }
 #npddckauwk .gt_subtitle { color: #333333; font-size: 85%; font-weight: initial; padding-top: 1px; padding-bottom: 3px; padding-left: 5px; padding-right: 5px; border-top-color: #FFFFFF; border-top-width: 0; }
 #npddckauwk .gt_heading { background-color: #FFFFFF; text-align: center; border-bottom-color: #FFFFFF; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #npddckauwk .gt_bottom_border { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #npddckauwk .gt_col_headings { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #npddckauwk .gt_col_heading { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: bottom; padding-top: 2px; padding-bottom: 3px; padding-left: 5px; padding-right: 5px; overflow-x: hidden; }
 #npddckauwk .gt_column_spanner_outer { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; padding-top: 0; padding-bottom: 0; padding-left: 4px; padding-right: 4px; }
 #npddckauwk .gt_column_spanner_outer:first-child { padding-left: 0; }
 #npddckauwk .gt_column_spanner_outer:last-child { padding-right: 0; }
 #npddckauwk .gt_column_spanner { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: bottom; padding-top: 2px; padding-bottom: 2px; overflow-x: hidden; display: inline-block; width: 100%; }
 #npddckauwk .gt_spanner_row { border-bottom-style: hidden; }
 #npddckauwk .gt_group_heading { padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; text-align: left; }
 #npddckauwk .gt_empty_group_heading { padding: 0.5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: middle; }
 #npddckauwk .gt_from_md> :first-child { margin-top: 0; }
 #npddckauwk .gt_from_md> :last-child { margin-bottom: 0; }
 #npddckauwk .gt_row { padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; margin: 10px; border-top-style: solid; border-top-width: 1px; border-top-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; overflow-x: hidden; }
 #npddckauwk .gt_stub { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; }
 #npddckauwk .gt_stub_row_group { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; vertical-align: top; }
 #npddckauwk .gt_row_group_first td { border-top-width: 2px; }
 #npddckauwk .gt_row_group_first th { border-top-width: 2px; }
 #npddckauwk .gt_striped { color: #333333; background-color: #F4F4F4; }
 #npddckauwk .gt_table_body { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #npddckauwk .gt_grand_summary_row { color: #333333; background-color: #FFFFFF; text-transform: inherit; padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; }
 #npddckauwk .gt_first_grand_summary_row_bottom { border-top-style: double; border-top-width: 6px; border-top-color: #D3D3D3; }
 #npddckauwk .gt_last_grand_summary_row_top { border-bottom-style: double; border-bottom-width: 6px; border-bottom-color: #D3D3D3; }
 #npddckauwk .gt_sourcenotes { color: #333333; background-color: #FFFFFF; border-bottom-style: none; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; }
 #npddckauwk .gt_sourcenote { font-size: 90%; padding-top: 2px; padding-bottom: 2px; padding-left: 5px; padding-right: 5px; text-align: left; }
 #npddckauwk .gt_left { text-align: left; }
 #npddckauwk .gt_center { text-align: center; }
 #npddckauwk .gt_right { text-align: right; font-variant-numeric: tabular-nums; }
 #npddckauwk .gt_font_normal { font-weight: normal; }
 #npddckauwk .gt_font_bold { font-weight: bold; }
 #npddckauwk .gt_font_italic { font-style: italic; }
 #npddckauwk .gt_super { font-size: 65%; }
 #npddckauwk .gt_footnote_marks { font-size: 75%; vertical-align: 0.4em; position: initial; }
 #npddckauwk .gt_asterisk { font-size: 100%; vertical-align: 0; }
 
</style>
<table class="gt_table" data-quarto-disable-processing="false" data-quarto-bootstrap="false">
<thead>

  <tr class="gt_heading">
    <td colspan="6" class="gt_heading gt_title gt_font_normal">Our Contacts (Born in 1988)</td>
  </tr>
<tr class="gt_col_headings">
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="1" colspan="1" scope="col" id="country"></th>
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="1" colspan="1" scope="col" id="name">Name</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="1" colspan="1" scope="col" id="address">Address</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="1" colspan="1" scope="col" id="city">City</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="1" colspan="1" scope="col" id="state_prov">State/Prov.</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="1" colspan="1" scope="col" id="postcode">Zip/Postcode</th>
</tr>
</thead>
<tbody class="gt_table_body">
  <tr>
    <td class="gt_row gt_left"><span style="white-space:nowrap;"></span></td>
    <td class="gt_row gt_left">Martin Bartůněk</td>
    <td class="gt_row gt_left">1850 Valley Lane</td>
    <td class="gt_row gt_left">Austin</td>
    <td class="gt_row gt_left">TX</td>
    <td class="gt_row gt_left">78744</td>
  </tr>
  <tr>
    <td class="gt_row gt_left"><span style="white-space:nowrap;"></span></td>
    <td class="gt_row gt_left">Feride Šijan</td>
    <td class="gt_row gt_left">Tavcarjeva 58</td>
    <td class="gt_row gt_left">Sodražica</td>
    <td class="gt_row gt_left"></td>
    <td class="gt_row gt_left">1317</td>
  </tr>
  <tr>
    <td class="gt_row gt_left"><span style="white-space:nowrap;"></span></td>
    <td class="gt_row gt_left">Vejsil Crevar</td>
    <td class="gt_row gt_left">Gosposka ulica 60</td>
    <td class="gt_row gt_left">Novo mesto</td>
    <td class="gt_row gt_left"></td>
    <td class="gt_row gt_left">8501</td>
  </tr>
  <tr>
    <td class="gt_row gt_left"><span style="white-space:nowrap;"></span></td>
    <td class="gt_row gt_left">Matilda Bates</td>
    <td class="gt_row gt_left">582 Islington Ave</td>
    <td class="gt_row gt_left">Toronto</td>
    <td class="gt_row gt_left">ON</td>
    <td class="gt_row gt_left">M8V 3B6</td>
  </tr>
</tbody>


</table>

</div>
</div>
</div>
<p>This slice of the <code>peeps</code> dataset has country codes in their 3-letter form (i.e., <code>"USA"</code>, <code>"SVN"</code>, and <code>"CAN"</code>) within the <code>country</code> column. So long as they are correct, <code>fmt_flag()</code> will perform the conversion to flag icons. Also, there’s a little bit of interactivity here: when hovering over a flag, the country name will appear as a tooltip!</p>
<p>We have the power to display multiple flag icons within a single cell. To make this happen, the country codes need to be combined in a single string where each code is separated by a comma (e.g., <code>"US,DE,GB"</code>). Here’s an example that uses a portion of the <code>films</code> dataset:</p>
<div id="73bf5be7" class="cell" data-execution_count="2">
<div class="code-copy-outer-scaffold"><div class="sourceCode cell-code" id="cb2" style="background: #f1f3f5;"><pre class="sourceCode python code-with-copy"><code class="sourceCode python"><span id="cb2-1"><span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">from</span> great_tables <span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">import</span> GT, google_font</span>
<span id="cb2-2"><span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">from</span> great_tables.data <span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">import</span> films</span>
<span id="cb2-3"><span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">import</span> polars <span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">as</span> pl</span>
<span id="cb2-4"></span>
<span id="cb2-5">films_mini <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> (</span>
<span id="cb2-6">    pl.from_pandas(films)</span>
<span id="cb2-7">    .<span class="bu" style="color: null;
background-color: null;
font-style: inherit;">filter</span>(pl.col(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"director"</span>) <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">==</span> <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Michael Haneke"</span>)</span>
<span id="cb2-8">    .with_columns(title<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>pl.col(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"title"</span>) <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">+</span> <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">" ("</span> <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">+</span> pl.col(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"year"</span>).cast(pl.String) <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">+</span> <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">")"</span>)</span>
<span id="cb2-9">    .select([<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"title"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"run_time"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"countries_of_origin"</span>])</span>
<span id="cb2-10">)</span>
<span id="cb2-11"></span>
<span id="cb2-12">(</span>
<span id="cb2-13">    GT(films_mini)</span>
<span id="cb2-14">    .fmt_flag(columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"countries_of_origin"</span>)</span>
<span id="cb2-15">    .tab_header(title<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"In Competition Films by Michael Haneke"</span>)</span>
<span id="cb2-16">    .opt_stylize()</span>
<span id="cb2-17">    .tab_options(column_labels_hidden<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="va" style="color: #111111;
background-color: null;
font-style: inherit;">True</span>)</span>
<span id="cb2-18">    .opt_table_font(font<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>google_font(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"PT Sans"</span>))</span>
<span id="cb2-19">)</span></code></pre></div></div>
<div class="cell-output cell-output-display" data-execution_count="2">
<div id="rdmafufxom" style="padding-left:0px;padding-right:0px;padding-top:10px;padding-bottom:10px;overflow-x:auto;overflow-y:auto;width:auto;height:auto;">
<style>
@import url('https://fonts.googleapis.com/css2?family=PT+Sans&display=swap');
#rdmafufxom table {
          font-family: 'PT Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Helvetica Neue', 'Fira Sans', 'Droid Sans', Arial, sans-serif;
          -webkit-font-smoothing: antialiased;
          -moz-osx-font-smoothing: grayscale;
        }

#rdmafufxom thead, tbody, tfoot, tr, td, th { border-style: none; }
 tr { background-color: transparent; }
#rdmafufxom p { margin: 0; padding: 0; }
 #rdmafufxom .gt_table { display: table; border-collapse: collapse; line-height: normal; margin-left: auto; margin-right: auto; color: #333333; font-size: 16px; font-weight: normal; font-style: normal; background-color: #FFFFFF; width: auto; border-top-style: solid; border-top-width: 2px; border-top-color: #004D80; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #004D80; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; }
 #rdmafufxom .gt_caption { padding-top: 4px; padding-bottom: 4px; }
 #rdmafufxom .gt_title { color: #333333; font-size: 125%; font-weight: initial; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; border-bottom-color: #FFFFFF; border-bottom-width: 0; }
 #rdmafufxom .gt_subtitle { color: #333333; font-size: 85%; font-weight: initial; padding-top: 3px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; border-top-color: #FFFFFF; border-top-width: 0; }
 #rdmafufxom .gt_heading { background-color: #FFFFFF; text-align: center; border-bottom-color: #FFFFFF; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #rdmafufxom .gt_bottom_border { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #0076BA; }
 #rdmafufxom .gt_col_headings { border-top-style: solid; border-top-width: 2px; border-top-color: #0076BA; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #0076BA; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #rdmafufxom .gt_col_heading { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; overflow-x: hidden; }
 #rdmafufxom .gt_column_spanner_outer { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; padding-top: 0; padding-bottom: 0; padding-left: 4px; padding-right: 4px; }
 #rdmafufxom .gt_column_spanner_outer:first-child { padding-left: 0; }
 #rdmafufxom .gt_column_spanner_outer:last-child { padding-right: 0; }
 #rdmafufxom .gt_column_spanner { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #0076BA; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; overflow-x: hidden; display: inline-block; width: 100%; }
 #rdmafufxom .gt_spanner_row { border-bottom-style: hidden; }
 #rdmafufxom .gt_group_heading { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-top-style: solid; border-top-width: 2px; border-top-color: #0076BA; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #0076BA; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; text-align: left; }
 #rdmafufxom .gt_empty_group_heading { padding: 0.5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; border-top-style: solid; border-top-width: 2px; border-top-color: #0076BA; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #0076BA; vertical-align: middle; }
 #rdmafufxom .gt_from_md> :first-child { margin-top: 0; }
 #rdmafufxom .gt_from_md> :last-child { margin-bottom: 0; }
 #rdmafufxom .gt_row { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; margin: 10px; border-top-style: none; border-top-width: 1px; border-top-color: #89D3FE; border-left-style: none; border-left-width: 1px; border-left-color: #89D3FE; border-right-style: none; border-right-width: 1px; border-right-color: #89D3FE; vertical-align: middle; overflow-x: hidden; }
 #rdmafufxom .gt_stub { color: #FFFFFF; background-color: #0076BA; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #0076BA; padding-left: 5px; padding-right: 5px; }
 #rdmafufxom .gt_stub_row_group { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; vertical-align: top; }
 #rdmafufxom .gt_row_group_first td { border-top-width: 2px; }
 #rdmafufxom .gt_row_group_first th { border-top-width: 2px; }
 #rdmafufxom .gt_striped { color: #333333; background-color: #F4F4F4; }
 #rdmafufxom .gt_table_body { border-top-style: solid; border-top-width: 2px; border-top-color: #0076BA; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #0076BA; }
 #rdmafufxom .gt_grand_summary_row { color: #333333; background-color: #89D3FE; text-transform: inherit; padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; }
 #rdmafufxom .gt_first_grand_summary_row_bottom { border-top-style: double; border-top-width: 6px; border-top-color: #D3D3D3; }
 #rdmafufxom .gt_last_grand_summary_row_top { border-bottom-style: double; border-bottom-width: 6px; border-bottom-color: #D3D3D3; }
 #rdmafufxom .gt_sourcenotes { color: #333333; background-color: #FFFFFF; border-bottom-style: none; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; }
 #rdmafufxom .gt_sourcenote { font-size: 90%; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; text-align: left; }
 #rdmafufxom .gt_left { text-align: left; }
 #rdmafufxom .gt_center { text-align: center; }
 #rdmafufxom .gt_right { text-align: right; font-variant-numeric: tabular-nums; }
 #rdmafufxom .gt_font_normal { font-weight: normal; }
 #rdmafufxom .gt_font_bold { font-weight: bold; }
 #rdmafufxom .gt_font_italic { font-style: italic; }
 #rdmafufxom .gt_super { font-size: 65%; }
 #rdmafufxom .gt_footnote_marks { font-size: 75%; vertical-align: 0.4em; position: initial; }
 #rdmafufxom .gt_asterisk { font-size: 100%; vertical-align: 0; }
 
</style>
<table class="gt_table" data-quarto-disable-processing="false" data-quarto-bootstrap="false">
<thead>

  <tr class="gt_heading">
    <td colspan="3" class="gt_heading gt_title gt_font_normal">In Competition Films by Michael Haneke</td>
  </tr>

</thead>
<tbody class="gt_table_body">
  <tr>
    <td class="gt_row gt_left">Funny Games (1997)</td>
    <td class="gt_row gt_left">1h 48m</td>
    <td class="gt_row gt_left"><span style="white-space:nowrap;"></span></td>
  </tr>
  <tr>
    <td class="gt_row gt_left gt_striped">Code Unknown (2000)</td>
    <td class="gt_row gt_left gt_striped">1h 58m</td>
    <td class="gt_row gt_left gt_striped"><span style="white-space:nowrap;">   </span></td>
  </tr>
  <tr>
    <td class="gt_row gt_left">The Piano Teacher (2001)</td>
    <td class="gt_row gt_left">2h 11m</td>
    <td class="gt_row gt_left"><span style="white-space:nowrap;">  </span></td>
  </tr>
  <tr>
    <td class="gt_row gt_left gt_striped">Caché (2005)</td>
    <td class="gt_row gt_left gt_striped">1h 57m</td>
    <td class="gt_row gt_left gt_striped"><span style="white-space:nowrap;">   </span></td>
  </tr>
  <tr>
    <td class="gt_row gt_left">The White Ribbon (2009)</td>
    <td class="gt_row gt_left">2h 24m</td>
    <td class="gt_row gt_left"><span style="white-space:nowrap;">    </span></td>
  </tr>
  <tr>
    <td class="gt_row gt_left gt_striped">Amour (2012)</td>
    <td class="gt_row gt_left gt_striped">2h 7m</td>
    <td class="gt_row gt_left gt_striped"><span style="white-space:nowrap;">  </span></td>
  </tr>
  <tr>
    <td class="gt_row gt_left">Happy End (2017)</td>
    <td class="gt_row gt_left">1h 47m</td>
    <td class="gt_row gt_left"><span style="white-space:nowrap;">  </span></td>
  </tr>
</tbody>


</table>

</div>
</div>
</div>
<p>The column <code>countries_of_origin</code> has these combined strings for each of the co-production films, where countries are arranged by decreasing level of contribution (e.g., <code>"FR,AT,RO,DE"</code> in the second row). The <code>fmt_flag()</code> method parses these strings into a sequence of flag icons that are displayed in the order provided. Each of the flags is separated by a space character but you can always change that default separator with the <code>sep=</code> argument.</p>
</section>
<section id="using-fmt_icon-to-include-font-awesome-icons" class="level3">
<h3 class="anchored" data-anchor-id="using-fmt_icon-to-include-font-awesome-icons">Using <code>fmt_icon()</code> to include Font Awesome icons</h3>
<p>The new <code>fmt_icon()</code> method gives you the ability to easily include Font Awesome icons in a table. It uses a similar input/output scheme as with <code>fmt_flag()</code>: provide the <em>short</em> icon name (e.g., <code>"table"</code>, <code>"music"</code>, <code>"globe"</code>, etc.) or a comma-separated list of them, and <code>fmt_icon()</code> will provide the Font Awesome icon in place. Let’s see it in action with an example that uses the <code>metro</code> dataset:</p>
<div id="1043428d" class="cell" data-execution_count="3">
<div class="code-copy-outer-scaffold"><div class="sourceCode cell-code" id="cb3" style="background: #f1f3f5;"><pre class="sourceCode python code-with-copy"><code class="sourceCode python"><span id="cb3-1"><span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">from</span> great_tables <span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">import</span> GT</span>
<span id="cb3-2"><span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">from</span> great_tables.data <span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">import</span> metro</span>
<span id="cb3-3"><span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">import</span> polars <span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">as</span> pl</span>
<span id="cb3-4"></span>
<span id="cb3-5">metro_mini <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> (</span>
<span id="cb3-6">    pl.from_pandas(metro).tail(<span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">10</span>)</span>
<span id="cb3-7">    .with_columns(</span>
<span id="cb3-8">        services <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> (</span>
<span id="cb3-9">            pl.when(pl.col(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"connect_tramway"</span>).is_not_null())</span>
<span id="cb3-10">            .then(pl.lit(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"train, train-tram"</span>))</span>
<span id="cb3-11">            .otherwise(pl.lit(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"train"</span>))</span>
<span id="cb3-12">        )</span>
<span id="cb3-13">    )</span>
<span id="cb3-14">    .select([<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"name"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"services"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"location"</span>])</span>
<span id="cb3-15">)</span>
<span id="cb3-16"></span>
<span id="cb3-17">(</span>
<span id="cb3-18">    GT(metro_mini)</span>
<span id="cb3-19">    .tab_header(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Services Available at Select Stations"</span>)</span>
<span id="cb3-20">    .fmt_icon(columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"services"</span>, sep<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">" / "</span>)</span>
<span id="cb3-21">    .tab_options(column_labels_hidden<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="va" style="color: #111111;
background-color: null;
font-style: inherit;">True</span>)</span>
<span id="cb3-22">    .opt_stylize(color<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"green"</span>)</span>
<span id="cb3-23">    .opt_horizontal_padding(scale<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">3</span>)</span>
<span id="cb3-24">    .opt_align_table_header(align<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"left"</span>)</span>
<span id="cb3-25">)</span></code></pre></div></div>
<div class="cell-output cell-output-display" data-execution_count="3">
<div id="zwdvfosage" style="padding-left:0px;padding-right:0px;padding-top:10px;padding-bottom:10px;overflow-x:auto;overflow-y:auto;width:auto;height:auto;">
<style>
#zwdvfosage table {
          font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Helvetica Neue', 'Fira Sans', 'Droid Sans', Arial, sans-serif;
          -webkit-font-smoothing: antialiased;
          -moz-osx-font-smoothing: grayscale;
        }

#zwdvfosage thead, tbody, tfoot, tr, td, th { border-style: none; }
 tr { background-color: transparent; }
#zwdvfosage p { margin: 0; padding: 0; }
 #zwdvfosage .gt_table { display: table; border-collapse: collapse; line-height: normal; margin-left: auto; margin-right: auto; color: #333333; font-size: 16px; font-weight: normal; font-style: normal; background-color: #FFFFFF; width: auto; border-top-style: solid; border-top-width: 2px; border-top-color: #027101; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #027101; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; }
 #zwdvfosage .gt_caption { padding-top: 4px; padding-bottom: 4px; }
 #zwdvfosage .gt_title { color: #333333; font-size: 125%; font-weight: initial; padding-top: 4px; padding-bottom: 4px; padding-left: 15px; padding-right: 15px; border-bottom-color: #FFFFFF; border-bottom-width: 0; }
 #zwdvfosage .gt_subtitle { color: #333333; font-size: 85%; font-weight: initial; padding-top: 3px; padding-bottom: 5px; padding-left: 15px; padding-right: 15px; border-top-color: #FFFFFF; border-top-width: 0; }
 #zwdvfosage .gt_heading { background-color: #FFFFFF; text-align: left; border-bottom-color: #FFFFFF; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #zwdvfosage .gt_bottom_border { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #038901; }
 #zwdvfosage .gt_col_headings { border-top-style: solid; border-top-width: 2px; border-top-color: #038901; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #038901; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #zwdvfosage .gt_col_heading { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; padding-left: 15px; padding-right: 15px; overflow-x: hidden; }
 #zwdvfosage .gt_column_spanner_outer { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; padding-top: 0; padding-bottom: 0; padding-left: 4px; padding-right: 4px; }
 #zwdvfosage .gt_column_spanner_outer:first-child { padding-left: 0; }
 #zwdvfosage .gt_column_spanner_outer:last-child { padding-right: 0; }
 #zwdvfosage .gt_column_spanner { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #038901; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; overflow-x: hidden; display: inline-block; width: 100%; }
 #zwdvfosage .gt_spanner_row { border-bottom-style: hidden; }
 #zwdvfosage .gt_group_heading { padding-top: 8px; padding-bottom: 8px; padding-left: 15px; padding-right: 15px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-top-style: solid; border-top-width: 2px; border-top-color: #038901; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #038901; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; text-align: left; }
 #zwdvfosage .gt_empty_group_heading { padding: 0.5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; border-top-style: solid; border-top-width: 2px; border-top-color: #038901; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #038901; vertical-align: middle; }
 #zwdvfosage .gt_from_md> :first-child { margin-top: 0; }
 #zwdvfosage .gt_from_md> :last-child { margin-bottom: 0; }
 #zwdvfosage .gt_row { padding-top: 8px; padding-bottom: 8px; padding-left: 15px; padding-right: 15px; margin: 10px; border-top-style: none; border-top-width: 1px; border-top-color: #CAFFAF; border-left-style: none; border-left-width: 1px; border-left-color: #CAFFAF; border-right-style: none; border-right-width: 1px; border-right-color: #CAFFAF; vertical-align: middle; overflow-x: hidden; }
 #zwdvfosage .gt_stub { color: #FFFFFF; background-color: #038901; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #038901; padding-left: 15px; padding-right: 15px; }
 #zwdvfosage .gt_stub_row_group { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 15px; padding-right: 15px; vertical-align: top; }
 #zwdvfosage .gt_row_group_first td { border-top-width: 2px; }
 #zwdvfosage .gt_row_group_first th { border-top-width: 2px; }
 #zwdvfosage .gt_striped { color: #333333; background-color: #F4F4F4; }
 #zwdvfosage .gt_table_body { border-top-style: solid; border-top-width: 2px; border-top-color: #038901; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #038901; }
 #zwdvfosage .gt_grand_summary_row { color: #333333; background-color: #CAFFAF; text-transform: inherit; padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; }
 #zwdvfosage .gt_first_grand_summary_row_bottom { border-top-style: double; border-top-width: 6px; border-top-color: #D3D3D3; }
 #zwdvfosage .gt_last_grand_summary_row_top { border-bottom-style: double; border-bottom-width: 6px; border-bottom-color: #D3D3D3; }
 #zwdvfosage .gt_sourcenotes { color: #333333; background-color: #FFFFFF; border-bottom-style: none; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; }
 #zwdvfosage .gt_sourcenote { font-size: 90%; padding-top: 4px; padding-bottom: 4px; padding-left: 15px; padding-right: 15px; text-align: left; }
 #zwdvfosage .gt_left { text-align: left; }
 #zwdvfosage .gt_center { text-align: center; }
 #zwdvfosage .gt_right { text-align: right; font-variant-numeric: tabular-nums; }
 #zwdvfosage .gt_font_normal { font-weight: normal; }
 #zwdvfosage .gt_font_bold { font-weight: bold; }
 #zwdvfosage .gt_font_italic { font-style: italic; }
 #zwdvfosage .gt_super { font-size: 65%; }
 #zwdvfosage .gt_footnote_marks { font-size: 75%; vertical-align: 0.4em; position: initial; }
 #zwdvfosage .gt_asterisk { font-size: 100%; vertical-align: 0; }
 
</style>
<table class="gt_table" data-quarto-disable-processing="false" data-quarto-bootstrap="false">
<thead>

  <tr class="gt_heading">
    <td colspan="3" class="gt_heading gt_title gt_font_normal">Services Available at Select Stations</td>
  </tr>

</thead>
<tbody class="gt_table_body">
  <tr>
    <td class="gt_row gt_left">Porte de Vanves</td>
    <td class="gt_row gt_left"><span style="white-space:nowrap;"> / </span></td>
    <td class="gt_row gt_left">Paris 14th</td>
  </tr>
  <tr>
    <td class="gt_row gt_left gt_striped">Saint-Denis—Porte de Paris</td>
    <td class="gt_row gt_left gt_striped"><span style="white-space:nowrap;"> / </span></td>
    <td class="gt_row gt_left gt_striped">Saint-Denis</td>
  </tr>
  <tr>
    <td class="gt_row gt_left">Saint-Denis—Université</td>
    <td class="gt_row gt_left"><span style="white-space:nowrap;"> / </span></td>
    <td class="gt_row gt_left">Saint-Denis</td>
  </tr>
  <tr>
    <td class="gt_row gt_left gt_striped">Saint-François-Xavier</td>
    <td class="gt_row gt_left gt_striped"><span style="white-space:nowrap;"></span></td>
    <td class="gt_row gt_left gt_striped">Paris 7th</td>
  </tr>
  <tr>
    <td class="gt_row gt_left">Varenne</td>
    <td class="gt_row gt_left"><span style="white-space:nowrap;"></span></td>
    <td class="gt_row gt_left">Paris 7th</td>
  </tr>
  <tr>
    <td class="gt_row gt_left gt_striped">Bibliothèque François Mitterrand</td>
    <td class="gt_row gt_left gt_striped"><span style="white-space:nowrap;"> / </span></td>
    <td class="gt_row gt_left gt_striped">Paris 13th</td>
  </tr>
  <tr>
    <td class="gt_row gt_left">Cour Saint-Émilion</td>
    <td class="gt_row gt_left"><span style="white-space:nowrap;"></span></td>
    <td class="gt_row gt_left">Paris 12th</td>
  </tr>
  <tr>
    <td class="gt_row gt_left gt_striped">Olympiades</td>
    <td class="gt_row gt_left gt_striped"><span style="white-space:nowrap;"></span></td>
    <td class="gt_row gt_left gt_striped">Paris 13th</td>
  </tr>
  <tr>
    <td class="gt_row gt_left">Pont Cardinet</td>
    <td class="gt_row gt_left"><span style="white-space:nowrap;"></span></td>
    <td class="gt_row gt_left">Paris 17th</td>
  </tr>
  <tr>
    <td class="gt_row gt_left gt_striped">Saint-Ouen</td>
    <td class="gt_row gt_left gt_striped"><span style="white-space:nowrap;"></span></td>
    <td class="gt_row gt_left gt_striped">Clichy, Saint-Ouen-sur-Seine</td>
  </tr>
</tbody>


</table>

</div>
</div>
</div>
<p>In the code, we added in the icon names <code>"train"</code> and <code>"train-tram"</code> to the <code>services</code> column, and there could either be just the train icon or the pair that includes the tramway service. We wanted a little separation between the icons in the latter case, so <code>sep=" / "</code> was used to place a slash with spacing between any pair of icons. The icons appear here with a black fill color, but that can be changed with the <code>fill_color=</code> argument (and there are several other arguments for controlling style attributes).</p>
<p>For a list of available icons, their names, and what they look like, check out <a href="https://fontawesome.com/search?m=free&amp;o=r">this listing on the Font Awesome website</a>. The icons draw from the Font Awesome ‘free’ set (2000+ icons in total) but are not obtained via the web. Rather, we use the <a href="https://pypi.org/project/faicons/">faicons library</a> so that this can be done entirely offline (directly using the SVG icons stored within faicons).</p>
</section>
<section id="accounting-notation-in-select-numeric-formatting-methods" class="level3">
<h3 class="anchored" data-anchor-id="accounting-notation-in-select-numeric-formatting-methods">Accounting notation in select numeric formatting methods</h3>
<p>For certain types of tables, it may be preferable to use accounting notation for numerical figures. This type of notation renders negative values in parentheses while omitting the minus sign. This is often seen for monetary and percentage figures but it’s also sensible for plain numbers in the right context. We’ve added support for accounting notation in four formatting methods:</p>
<ul>
<li><code>fmt_number()</code></li>
<li><code>fmt_integer()</code></li>
<li><code>fmt_currency()</code></li>
<li><code>fmt_percent()</code></li>
</ul>
<p>Here’s a comprehensive example table that demonstrates how this type of formatting looks.</p>
<div id="50d91748" class="cell" data-execution_count="4">
<details class="code-fold">
<summary>Show the code</summary>
<div class="code-copy-outer-scaffold"><div class="sourceCode cell-code" id="cb4" style="background: #f1f3f5;"><pre class="sourceCode python code-with-copy"><code class="sourceCode python"><span id="cb4-1"><span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">from</span> great_tables <span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">import</span> GT</span>
<span id="cb4-2"><span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">import</span> polars <span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">as</span> pl</span>
<span id="cb4-3"></span>
<span id="cb4-4">df <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> pl.DataFrame({</span>
<span id="cb4-5">    <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"number_type"</span>: [<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"negative"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"positive"</span>],</span>
<span id="cb4-6">    <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"number"</span>: [<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">-</span><span class="fl" style="color: #AD0000;
background-color: null;
font-style: inherit;">1.2</span>, <span class="fl" style="color: #AD0000;
background-color: null;
font-style: inherit;">23.6</span>],</span>
<span id="cb4-7">    <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"integer"</span>: [<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">-</span><span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">2323</span>, <span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">23213</span>],</span>
<span id="cb4-8">    <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"currency"</span>: [<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">-</span><span class="fl" style="color: #AD0000;
background-color: null;
font-style: inherit;">24334.23</span>, <span class="fl" style="color: #AD0000;
background-color: null;
font-style: inherit;">7323.253</span>],</span>
<span id="cb4-9">    <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"percent"</span>: [<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">-</span><span class="fl" style="color: #AD0000;
background-color: null;
font-style: inherit;">0.0523</span>, <span class="fl" style="color: #AD0000;
background-color: null;
font-style: inherit;">0.363</span>]</span>
<span id="cb4-10">    }</span>
<span id="cb4-11">).with_columns(</span>
<span id="cb4-12">    number_acc <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> pl.col(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"number"</span>),</span>
<span id="cb4-13">    integer_acc <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> pl.col(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"integer"</span>),</span>
<span id="cb4-14">    currency_acc <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> pl.col(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"currency"</span>),</span>
<span id="cb4-15">    percent_acc <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> pl.col(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"percent"</span>)</span>
<span id="cb4-16">)</span>
<span id="cb4-17"></span>
<span id="cb4-18">(</span>
<span id="cb4-19">    GT(df, rowname_col<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"number_type"</span>)</span>
<span id="cb4-20">    .fmt_number(columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"number"</span>)</span>
<span id="cb4-21">    .fmt_percent(columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"percent"</span>)</span>
<span id="cb4-22">    .fmt_integer(columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"integer"</span>)</span>
<span id="cb4-23">    .fmt_currency(columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"currency"</span>)</span>
<span id="cb4-24">    .fmt_number(columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"number_acc"</span>, accounting<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="va" style="color: #111111;
background-color: null;
font-style: inherit;">True</span>)</span>
<span id="cb4-25">    .fmt_percent(columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"percent_acc"</span>, accounting<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="va" style="color: #111111;
background-color: null;
font-style: inherit;">True</span>)</span>
<span id="cb4-26">    .fmt_integer(columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"integer_acc"</span>, accounting<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="va" style="color: #111111;
background-color: null;
font-style: inherit;">True</span>)</span>
<span id="cb4-27">    .fmt_currency(columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"currency_acc"</span>, accounting<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="va" style="color: #111111;
background-color: null;
font-style: inherit;">True</span>)</span>
<span id="cb4-28">    .tab_spanner(label<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"default formatting"</span>, columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>[<span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">1</span>, <span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">2</span>, <span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">3</span>, <span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">4</span>])</span>
<span id="cb4-29">    .tab_spanner(label<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"with accounting notation"</span>, columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>[<span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">5</span>, <span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">6</span>, <span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">7</span>, <span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">8</span>])</span>
<span id="cb4-30">    .cols_label(</span>
<span id="cb4-31">        number_acc<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"number"</span>,</span>
<span id="cb4-32">        integer_acc<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"integer"</span>,</span>
<span id="cb4-33">        currency_acc<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"currency"</span>,</span>
<span id="cb4-34">        percent_acc<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"percent"</span></span>
<span id="cb4-35">    )</span>
<span id="cb4-36">)</span></code></pre></div></div>
</details>
<div class="cell-output cell-output-display" data-execution_count="4">
<div id="aftulipnqi" style="padding-left:0px;padding-right:0px;padding-top:10px;padding-bottom:10px;overflow-x:auto;overflow-y:auto;width:auto;height:auto;">
<style>
#aftulipnqi table {
          font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Helvetica Neue', 'Fira Sans', 'Droid Sans', Arial, sans-serif;
          -webkit-font-smoothing: antialiased;
          -moz-osx-font-smoothing: grayscale;
        }

#aftulipnqi thead, tbody, tfoot, tr, td, th { border-style: none; }
 tr { background-color: transparent; }
#aftulipnqi p { margin: 0; padding: 0; }
 #aftulipnqi .gt_table { display: table; border-collapse: collapse; line-height: normal; margin-left: auto; margin-right: auto; color: #333333; font-size: 16px; font-weight: normal; font-style: normal; background-color: #FFFFFF; width: auto; border-top-style: solid; border-top-width: 2px; border-top-color: #A8A8A8; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #A8A8A8; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; }
 #aftulipnqi .gt_caption { padding-top: 4px; padding-bottom: 4px; }
 #aftulipnqi .gt_title { color: #333333; font-size: 125%; font-weight: initial; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; border-bottom-color: #FFFFFF; border-bottom-width: 0; }
 #aftulipnqi .gt_subtitle { color: #333333; font-size: 85%; font-weight: initial; padding-top: 3px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; border-top-color: #FFFFFF; border-top-width: 0; }
 #aftulipnqi .gt_heading { background-color: #FFFFFF; text-align: center; border-bottom-color: #FFFFFF; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #aftulipnqi .gt_bottom_border { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #aftulipnqi .gt_col_headings { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #aftulipnqi .gt_col_heading { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; overflow-x: hidden; }
 #aftulipnqi .gt_column_spanner_outer { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; padding-top: 0; padding-bottom: 0; padding-left: 4px; padding-right: 4px; }
 #aftulipnqi .gt_column_spanner_outer:first-child { padding-left: 0; }
 #aftulipnqi .gt_column_spanner_outer:last-child { padding-right: 0; }
 #aftulipnqi .gt_column_spanner { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; overflow-x: hidden; display: inline-block; width: 100%; }
 #aftulipnqi .gt_spanner_row { border-bottom-style: hidden; }
 #aftulipnqi .gt_group_heading { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; text-align: left; }
 #aftulipnqi .gt_empty_group_heading { padding: 0.5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: middle; }
 #aftulipnqi .gt_from_md> :first-child { margin-top: 0; }
 #aftulipnqi .gt_from_md> :last-child { margin-bottom: 0; }
 #aftulipnqi .gt_row { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; margin: 10px; border-top-style: solid; border-top-width: 1px; border-top-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; overflow-x: hidden; }
 #aftulipnqi .gt_stub { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; }
 #aftulipnqi .gt_stub_row_group { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; vertical-align: top; }
 #aftulipnqi .gt_row_group_first td { border-top-width: 2px; }
 #aftulipnqi .gt_row_group_first th { border-top-width: 2px; }
 #aftulipnqi .gt_striped { color: #333333; background-color: #F4F4F4; }
 #aftulipnqi .gt_table_body { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #aftulipnqi .gt_grand_summary_row { color: #333333; background-color: #FFFFFF; text-transform: inherit; padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; }
 #aftulipnqi .gt_first_grand_summary_row_bottom { border-top-style: double; border-top-width: 6px; border-top-color: #D3D3D3; }
 #aftulipnqi .gt_last_grand_summary_row_top { border-bottom-style: double; border-bottom-width: 6px; border-bottom-color: #D3D3D3; }
 #aftulipnqi .gt_sourcenotes { color: #333333; background-color: #FFFFFF; border-bottom-style: none; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; }
 #aftulipnqi .gt_sourcenote { font-size: 90%; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; text-align: left; }
 #aftulipnqi .gt_left { text-align: left; }
 #aftulipnqi .gt_center { text-align: center; }
 #aftulipnqi .gt_right { text-align: right; font-variant-numeric: tabular-nums; }
 #aftulipnqi .gt_font_normal { font-weight: normal; }
 #aftulipnqi .gt_font_bold { font-weight: bold; }
 #aftulipnqi .gt_font_italic { font-style: italic; }
 #aftulipnqi .gt_super { font-size: 65%; }
 #aftulipnqi .gt_footnote_marks { font-size: 75%; vertical-align: 0.4em; position: initial; }
 #aftulipnqi .gt_asterisk { font-size: 100%; vertical-align: 0; }
 
</style>
<table class="gt_table" data-quarto-disable-processing="false" data-quarto-bootstrap="false">
<thead>

<tr class="gt_col_headings gt_spanner_row">
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="2" colspan="1" scope="col" id=""></th>
  <th class="gt_center gt_columns_top_border gt_column_spanner_outer" rowspan="1" colspan="4" scope="colgroup" id="default-formatting">
    <span class="gt_column_spanner">default formatting</span>
  </th>
  <th class="gt_center gt_columns_top_border gt_column_spanner_outer" rowspan="1" colspan="4" scope="colgroup" id="with-accounting-notation">
    <span class="gt_column_spanner">with accounting notation</span>
  </th>
</tr>
<tr class="gt_col_headings">
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="number">number</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="integer">integer</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="currency">currency</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="percent">percent</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="number_acc">number</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="integer_acc">integer</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="currency_acc">currency</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="percent_acc">percent</th>
</tr>
</thead>
<tbody class="gt_table_body">
  <tr>
    <th class="gt_row gt_left gt_stub">negative</th>
    <td class="gt_row gt_right">−1.20</td>
    <td class="gt_row gt_right">−2,323</td>
    <td class="gt_row gt_right">−$24,334.23</td>
    <td class="gt_row gt_right">−5.23%</td>
    <td class="gt_row gt_right">(1.20)</td>
    <td class="gt_row gt_right">(2,323)</td>
    <td class="gt_row gt_right">($24,334.23)</td>
    <td class="gt_row gt_right">(5.23%)</td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">positive</th>
    <td class="gt_row gt_right">23.60</td>
    <td class="gt_row gt_right">23,213</td>
    <td class="gt_row gt_right">$7,323.25</td>
    <td class="gt_row gt_right">36.30%</td>
    <td class="gt_row gt_right">23.60</td>
    <td class="gt_row gt_right">23,213</td>
    <td class="gt_row gt_right">$7,323.25</td>
    <td class="gt_row gt_right">36.30%</td>
  </tr>
</tbody>


</table>

</div>
</div>
</div>
<p>For the formatting in the final four columns, we use <code>accounting=True</code> to get the values into accounting notation. This is only apparent for the negative values (first row) as the positive values won’t change their appearance, looking the same as they do when <code>accounting=False</code> (the default).</p>
</section>
<section id="acknowledgements-and-how-to-contact-us" class="level3">
<h3 class="anchored" data-anchor-id="acknowledgements-and-how-to-contact-us">Acknowledgements and how to contact us</h3>
<p>We are <em>very</em> grateful for the work that <a href="https://github.com/jrycw">Jerry Wu</a> has done during this release, some of which includes:</p>
<ul>
<li>enhancing the <code>fmt_image()</code> to support <code>http</code>/<code>https</code> schema in the <code>columns=</code> parameter, and writing an <a href="https://posit-dev.github.io/great-tables/blog/rendering-images/">incredible blog post</a> about incorporating images in your tables</li>
<li>improving the <code>save()</code> method, giving it the ability to perform intermediate saves (since the method returns itself)</li>
<li>adding the <code>pipe()</code> method, which operates similarly to that of the Pandas and Polars APIs</li>
<li>all sorts of little QoL fixes</li>
</ul>
<p>We extend our gratitude also to <a href="https://github.com/amol-">Alessandro Molina</a> for adding experimental support for <code>pyarrow.Table</code> inputs in this release.</p>
<p>Finally, we thank <a href="https://github.com/lukemanley">Luke Manley</a> and <a href="https://github.com/glemaitre">Guillaume Lemaitre</a> for their first contributions to the project!</p>
<p>We’re always happy to get feedback. There are three good ways to talk to us:</p>
<ol type="1">
<li><a href="https://github.com/posit-dev/great-tables/issues">GitHub Issues</a></li>
<li><a href="https://github.com/posit-dev/great-tables/discussions">GitHub Discussions</a></li>
<li><a href="https://discord.com/invite/Ux7nrcXHVV">Discord</a></li>
</ol>
<p>Don’t be shy. We love talking tables (and how we can make them better)!</p>


</section>

 ]]></description>
  <guid>https://posit-dev.github.io/great-tables/blog/introduction-0.15.0/</guid>
  <pubDate>Thu, 19 Dec 2024 00:00:00 GMT</pubDate>
</item>
<item>
  <title>Contributing to Public Transit Data Analysis and Tooling</title>
  <dc:creator>Michael Chow</dc:creator>
  <link>https://posit-dev.github.io/great-tables/blog/open-transit-tools/</link>
  <description><![CDATA[ 




<p>Hello! Michael Chow here. In 2025, I’ll be focusing on contributing to open source data standards and tooling for public transit. If you work on analytics at a public transit agency, please reach out on <a href="https://www.linkedin.com/in/michael-a-chow/">linkedin</a> or <a href="https://bsky.app/profile/mchow.com">bluesky</a>—I would love to hear about your work, and how I could be useful!</p>
<p>(I will also be at the TRB Annual Meeting 2025 in Washington D.C.)</p>
<p>At this point, you might be wondering three things:</p>
<ul>
<li>why focus on open source in public transit?</li>
<li>why is this on the Great Tables blog?</li>
<li>what are you hoping to contribute?</li>
</ul>
<section id="why-focus-on-open-source-in-public-transit" class="level2">
<h2 class="anchored" data-anchor-id="why-focus-on-open-source-in-public-transit">Why focus on open source in public transit?</h2>
<p>People doing analytics in public transit are active in developing open data standards (like GTFS, GTFS-RT, and TIDES). These open data sources are complex—they cover schedules that change from week to week, buses moving in realtime, and passenger events. As people like me work more and more on open source tools, we start to lose touch with data analysis in realistic, complex settings. Working on open source transit data is an opportunity for me to ensure my open source tooling work helps people solve real, complex problems.</p>
<p>An inspiration for this angle is the book <a href="https://r4ds.hadley.nz/">R for Data Science</a>, which uses realistic datasets—like NYC flights data—to teach data analysis using an ecosystem of packages called the Tidyverse. The Tidyverse packages have dozens of example datasets, and I think this focus on working through examples is part of what made their design so great.</p>
<p>A few years ago, I worked with the Cal-ITP project to build out a warehouse for their GTFS schedule and realtime data. This left a profound impression on me: transit data is perfect for educating on data analyses in R and Python, as well as analytics engineering with tools like dbt or sqlmesh. Many analysts in public transit are querying warehouses, which opens up interesting use-cases with tools like dbplyr (in R) and ibis (in Python).</p>
<p>(I’m also inspired by tools like <a href="https://github.com/r-transit/tidytransit">tidytransit</a>, and other communities like <a href="https://pharmaverse.org">pharmaverse.org</a>.)</p>
<p>Here are some relevant talks:</p>
<ul>
<li><a href="https://youtu.be/MD5sKupHsTQ">Tidy Transit: Real Life Data Modeling for Public Transportation (Hunter Owens, Cal-ITP)</a></li>
<li><a href="https://www.youtube.com/live/EYdb1x1cO9U">The Accidental Analytics Engineer (Michael Chow)</a></li>
</ul>
</section>
<section id="why-is-this-on-the-great-tables-blog" class="level2">
<h2 class="anchored" data-anchor-id="why-is-this-on-the-great-tables-blog">Why is this on the Great Tables blog?</h2>
<p>It gives me the opportunity to show off a lot of interesting, transit related tables!</p>
<section id="great-tables-data-paris-metro-lines" class="level3">
<h3 class="anchored" data-anchor-id="great-tables-data-paris-metro-lines">Great Tables data: Paris metro lines</h3>
<p>If you’ve seen the Great Tables documentation for <a href="../../reference/GT.fmt_image.html#great_tables.GT.fmt_image"><span><code>GT.fmt_image()</code></span></a>, then you’ve basked in this beautiful example from our Paris <a href="../../reference/data.metro.html#great_tables.data.metro"><code>metro</code></a> dataset.</p>
<div id="93d587b6" class="cell" data-execution_count="1">
<details class="code-fold">
<summary>Code</summary>
<div class="code-copy-outer-scaffold"><div class="sourceCode cell-code" id="cb1" style="background: #f1f3f5;"><pre class="sourceCode python code-with-copy"><code class="sourceCode python"><span id="cb1-1"><span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">from</span> great_tables <span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">import</span> GT</span>
<span id="cb1-2"><span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">from</span> great_tables.data <span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">import</span> metro</span>
<span id="cb1-3"><span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">from</span> importlib_resources <span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">import</span> files</span>
<span id="cb1-4"></span>
<span id="cb1-5">img_paths <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> files(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"great_tables"</span>) <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">/</span> <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"data/metro_images"</span></span>
<span id="cb1-6"></span>
<span id="cb1-7">metro_mini <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> metro[[<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"name"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"lines"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"passengers"</span>]].head(<span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">5</span>)</span>
<span id="cb1-8"></span>
<span id="cb1-9">(</span>
<span id="cb1-10">    GT(metro_mini)</span>
<span id="cb1-11">    .fmt_image(columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"lines"</span>, path<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>img_paths, file_pattern<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"metro_</span><span class="sc" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">{}</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">.svg"</span>)</span>
<span id="cb1-12">    .fmt_integer(columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"passengers"</span>)</span>
<span id="cb1-13">)</span></code></pre></div></div>
</details>
<div class="cell-output cell-output-display" data-execution_count="1">
<div id="mrjzoytgnv" style="padding-left:0px;padding-right:0px;padding-top:10px;padding-bottom:10px;overflow-x:auto;overflow-y:auto;width:auto;height:auto;">
<style>
#mrjzoytgnv table {
          font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Helvetica Neue', 'Fira Sans', 'Droid Sans', Arial, sans-serif;
          -webkit-font-smoothing: antialiased;
          -moz-osx-font-smoothing: grayscale;
        }

#mrjzoytgnv thead, tbody, tfoot, tr, td, th { border-style: none; }
 tr { background-color: transparent; }
#mrjzoytgnv p { margin: 0; padding: 0; }
 #mrjzoytgnv .gt_table { display: table; border-collapse: collapse; line-height: normal; margin-left: auto; margin-right: auto; color: #333333; font-size: 16px; font-weight: normal; font-style: normal; background-color: #FFFFFF; width: auto; border-top-style: solid; border-top-width: 2px; border-top-color: #A8A8A8; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #A8A8A8; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; }
 #mrjzoytgnv .gt_caption { padding-top: 4px; padding-bottom: 4px; }
 #mrjzoytgnv .gt_title { color: #333333; font-size: 125%; font-weight: initial; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; border-bottom-color: #FFFFFF; border-bottom-width: 0; }
 #mrjzoytgnv .gt_subtitle { color: #333333; font-size: 85%; font-weight: initial; padding-top: 3px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; border-top-color: #FFFFFF; border-top-width: 0; }
 #mrjzoytgnv .gt_heading { background-color: #FFFFFF; text-align: center; border-bottom-color: #FFFFFF; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #mrjzoytgnv .gt_bottom_border { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #mrjzoytgnv .gt_col_headings { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #mrjzoytgnv .gt_col_heading { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; overflow-x: hidden; }
 #mrjzoytgnv .gt_column_spanner_outer { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; padding-top: 0; padding-bottom: 0; padding-left: 4px; padding-right: 4px; }
 #mrjzoytgnv .gt_column_spanner_outer:first-child { padding-left: 0; }
 #mrjzoytgnv .gt_column_spanner_outer:last-child { padding-right: 0; }
 #mrjzoytgnv .gt_column_spanner { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; overflow-x: hidden; display: inline-block; width: 100%; }
 #mrjzoytgnv .gt_spanner_row { border-bottom-style: hidden; }
 #mrjzoytgnv .gt_group_heading { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; text-align: left; }
 #mrjzoytgnv .gt_empty_group_heading { padding: 0.5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: middle; }
 #mrjzoytgnv .gt_from_md> :first-child { margin-top: 0; }
 #mrjzoytgnv .gt_from_md> :last-child { margin-bottom: 0; }
 #mrjzoytgnv .gt_row { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; margin: 10px; border-top-style: solid; border-top-width: 1px; border-top-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; overflow-x: hidden; }
 #mrjzoytgnv .gt_stub { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; }
 #mrjzoytgnv .gt_stub_row_group { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; vertical-align: top; }
 #mrjzoytgnv .gt_row_group_first td { border-top-width: 2px; }
 #mrjzoytgnv .gt_row_group_first th { border-top-width: 2px; }
 #mrjzoytgnv .gt_striped { color: #333333; background-color: #F4F4F4; }
 #mrjzoytgnv .gt_table_body { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #mrjzoytgnv .gt_grand_summary_row { color: #333333; background-color: #FFFFFF; text-transform: inherit; padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; }
 #mrjzoytgnv .gt_first_grand_summary_row_bottom { border-top-style: double; border-top-width: 6px; border-top-color: #D3D3D3; }
 #mrjzoytgnv .gt_last_grand_summary_row_top { border-bottom-style: double; border-bottom-width: 6px; border-bottom-color: #D3D3D3; }
 #mrjzoytgnv .gt_sourcenotes { color: #333333; background-color: #FFFFFF; border-bottom-style: none; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; }
 #mrjzoytgnv .gt_sourcenote { font-size: 90%; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; text-align: left; }
 #mrjzoytgnv .gt_left { text-align: left; }
 #mrjzoytgnv .gt_center { text-align: center; }
 #mrjzoytgnv .gt_right { text-align: right; font-variant-numeric: tabular-nums; }
 #mrjzoytgnv .gt_font_normal { font-weight: normal; }
 #mrjzoytgnv .gt_font_bold { font-weight: bold; }
 #mrjzoytgnv .gt_font_italic { font-style: italic; }
 #mrjzoytgnv .gt_super { font-size: 65%; }
 #mrjzoytgnv .gt_footnote_marks { font-size: 75%; vertical-align: 0.4em; position: initial; }
 #mrjzoytgnv .gt_asterisk { font-size: 100%; vertical-align: 0; }
 
</style>
<table class="gt_table" data-quarto-disable-processing="false" data-quarto-bootstrap="false">
<thead>

<tr class="gt_col_headings">
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="1" colspan="1" scope="col" id="name">name</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="lines">lines</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="passengers">passengers</th>
</tr>
</thead>
<tbody class="gt_table_body">
  <tr>
    <td class="gt_row gt_left">Argentine</td>
    <td class="gt_row gt_right"><span style="white-space:nowrap;"><img src="https://posit-dev.github.io/great-tables/blog/open-transit-tools/data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHJvbGU9ImltZyIgdmlld0JveD0iMCAwIDEwNTAgMTA1MCIgc3R5bGU9ImhlaWdodDoxZW07d2lkdGg6MS4xM2VtO3ZlcnRpY2FsLWFsaWduOi0wLjEyNWVtO21hcmdpbi1sZWZ0OmF1dG87bWFyZ2luLXJpZ2h0OmF1dG87Zm9udC1zaXplOmluaGVyaXQ7b3ZlcmZsb3c6dmlzaWJsZTtwb3NpdGlvbjpyZWxhdGl2ZTsiPjxjaXJjbGUgZmlsbD0iI0ZFQ0UwMCIgY3g9IjUwMCIgY3k9IjUwMCIgcj0iNTAwIi8+PHBhdGggZmlsbD0iIzIyMUUyMCIgZD0iTTU3Ny4wMjYgNzYzLjk4N1YyMzQuMDIyaC05Mi4zNTJjLTIzLjkzOCAxOC43MTQtODEuMDE3IDU0LjAyNi0xNDIuNTY1IDgzLjI2NWwtMzIuMjg3IDE1LjE0NyAzNi4wMTQgODEuMDQyIDI3Ljk0Ni0xNC4zOGMxOS4zNzgtOS42MTEgNzIuNjE3LTM3LjM1NyA5MC42OC01MS43djQxNi41OTFoMTEyLjU2NCIvPjwvc3ZnPg==" style="height: 2em;vertical-align: middle;"></span></td>
    <td class="gt_row gt_right">2,079,212</td>
  </tr>
  <tr>
    <td class="gt_row gt_left">Bastille</td>
    <td class="gt_row gt_right"><span style="white-space:nowrap;"><img src="https://posit-dev.github.io/great-tables/blog/open-transit-tools/data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHJvbGU9ImltZyIgdmlld0JveD0iMCAwIDEwNTAgMTA1MCIgc3R5bGU9ImhlaWdodDoxZW07d2lkdGg6MS4xM2VtO3ZlcnRpY2FsLWFsaWduOi0wLjEyNWVtO21hcmdpbi1sZWZ0OmF1dG87bWFyZ2luLXJpZ2h0OmF1dG87Zm9udC1zaXplOmluaGVyaXQ7b3ZlcmZsb3c6dmlzaWJsZTtwb3NpdGlvbjpyZWxhdGl2ZTsiPjxjaXJjbGUgZmlsbD0iI0ZFQ0UwMCIgY3g9IjUwMCIgY3k9IjUwMCIgcj0iNTAwIi8+PHBhdGggZmlsbD0iIzIyMUUyMCIgZD0iTTU3Ny4wMjYgNzYzLjk4N1YyMzQuMDIyaC05Mi4zNTJjLTIzLjkzOCAxOC43MTQtODEuMDE3IDU0LjAyNi0xNDIuNTY1IDgzLjI2NWwtMzIuMjg3IDE1LjE0NyAzNi4wMTQgODEuMDQyIDI3Ljk0Ni0xNC4zOGMxOS4zNzgtOS42MTEgNzIuNjE3LTM3LjM1NyA5MC42OC01MS43djQxNi41OTFoMTEyLjU2NCIvPjwvc3ZnPg==" style="height: 2em;vertical-align: middle;"> <img src="https://posit-dev.github.io/great-tables/blog/open-transit-tools/data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHJvbGU9ImltZyIgdmlld0JveD0iMCAwIDEwNTAgMTA1MCIgc3R5bGU9ImhlaWdodDoxZW07d2lkdGg6MS4xM2VtO3ZlcnRpY2FsLWFsaWduOi0wLjEyNWVtO21hcmdpbi1sZWZ0OmF1dG87bWFyZ2luLXJpZ2h0OmF1dG87Zm9udC1zaXplOmluaGVyaXQ7b3ZlcmZsb3c6dmlzaWJsZTtwb3NpdGlvbjpyZWxhdGl2ZTsiPjxjaXJjbGUgZmlsbD0iI0YxOTA0MyIgY3g9IjUwMCIgY3k9IjUwMCIgcj0iNTAwIi8+PHBhdGggZmlsbD0iIzIzMUYyMCIgZD0iTTY3OS43MSA1OTIuNzVjMC03OS40ODYtNTguNDItMTU5LjY4LTIwMy4yNy0xNjcuMjVsLTE1LjEzMy0uNzEyIDcuNDE4LTEwMS4zNTFoMTkwLjc4di04Ny45MTNoLTI3OC41MmwtMjEuMDM2IDI3NS40OSA4Mi41NDIuNzEyYzk3LjYxMy45NzkgMTIyLjk3OSA1My4zMTcgMTIyLjk3OSA5MS42NSAwIDYyLjE2LTUxLjYyNyA4NS42MjktOTIuODY2IDg1LjYyOS00NS4xODggMC03NS4wMzctMTYuNjE1LTEwMC42MS0zMy45MTJsLTM4Ljg5NyA4Mi42OWM0MS4wOTMgMjMuMTcyIDg5LjI3NyAzOC4zMzMgMTQ1LjUgMzguMzMzIDEyMC43NzEtLjA0IDIwMS4xMi04Mi4wOCAyMDEuMTItMTgzLjM3Ii8+PC9zdmc+" style="height: 2em;vertical-align: middle;"> <img src="https://posit-dev.github.io/great-tables/blog/open-transit-tools/data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHJvbGU9ImltZyIgdmlld0JveD0iMCAwIDEwNTAgMTA1MCIgc3R5bGU9ImhlaWdodDoxZW07d2lkdGg6MS4xM2VtO3ZlcnRpY2FsLWFsaWduOi0wLjEyNWVtO21hcmdpbi1sZWZ0OmF1dG87bWFyZ2luLXJpZ2h0OmF1dG87Zm9udC1zaXplOmluaGVyaXQ7b3ZlcmZsb3c6dmlzaWJsZTtwb3NpdGlvbjpyZWxhdGl2ZTsiPjxjaXJjbGUgZmlsbD0iI0NEQUNDRiIgY3g9IjUwMCIgY3k9IjUwMCIgcj0iNTAwIi8+PHBhdGggZmlsbD0iIzIzMUYyMCIgZD0iTTY4OS4yMSA2MTQuOTJjMC02OS42MTctNDIuNzQyLTExMS44MS05MS41NzMtMTM0Ljg1IDQ5LjU2OC0zMC4xNzUgNzUuMjA2LTY4LjQ1NCA3NS4yMDYtMTE3LjkgMC05MC45ODYtNzcuMzc4LTEzNi44My0xNzAuNDYtMTM2LjgzLTkwLjg3NyAwLTE3MC40MSA2MC45My0xNzAuNDEgMTQ4LjY2IDAgNTQuODAxIDI4LjU0NSA4Ny4wMzEgNzQuMjM1IDExNS41NC01MS4wMjMgMjYuMjk2LTkwLjc3OSA2Ny43MTYtOTAuNzc5IDEzOC4xNSAwIDgwLjM5NyA2Ni42OTMgMTUwLjkwOSAxODQuNTggMTUwLjkwOSAxMDguODYtLjAyIDE4OS4xOS02Mi45NiAxODkuMTktMTYzLjY4TTU3MS40MDkgMzY4LjgzYzAgMzMuMTItMzAuMDIxIDYzLjY4Mi01Ny44MTIgNzYuNTU5LTMzLjcwNS0xNC4yNzItNzcuMzAyLTM3LjYyLTc3LjMwMi04MS4wNTkgMC0zNi42ODkgMjYuMjIxLTYyLjI4NiA2Ny41MjctNjIuMjg2IDQzLjUyOS4wMSA2Ny41OCAyOS45MSA2Ny41OCA2Ni43OWwuMDA3LS4wMDR6bTguMjIgMjU0LjQyYzAgNDIuMDQyLTI3Ljc3IDc3LjM3My03OC4wOTUgNzcuMzczLTUxLjEwMyAwLTc5LjU1LTQxLjQ1OS03OS41NS04NC44OTYgMC00MS4xODggMzQuNTM5LTc1LjcwNSA2OS4wNTgtODkuMzE4IDQ0Ljk5IDIyLjU0IDg4LjU5IDQ4LjggODguNTkgOTYuODVsLS4wMDMtLjAwOXoiLz48L3N2Zz4=" style="height: 2em;vertical-align: middle;"></span></td>
    <td class="gt_row gt_right">8,069,243</td>
  </tr>
  <tr>
    <td class="gt_row gt_left">Bérault</td>
    <td class="gt_row gt_right"><span style="white-space:nowrap;"><img src="https://posit-dev.github.io/great-tables/blog/open-transit-tools/data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHJvbGU9ImltZyIgdmlld0JveD0iMCAwIDEwNTAgMTA1MCIgc3R5bGU9ImhlaWdodDoxZW07d2lkdGg6MS4xM2VtO3ZlcnRpY2FsLWFsaWduOi0wLjEyNWVtO21hcmdpbi1sZWZ0OmF1dG87bWFyZ2luLXJpZ2h0OmF1dG87Zm9udC1zaXplOmluaGVyaXQ7b3ZlcmZsb3c6dmlzaWJsZTtwb3NpdGlvbjpyZWxhdGl2ZTsiPjxjaXJjbGUgZmlsbD0iI0ZFQ0UwMCIgY3g9IjUwMCIgY3k9IjUwMCIgcj0iNTAwIi8+PHBhdGggZmlsbD0iIzIyMUUyMCIgZD0iTTU3Ny4wMjYgNzYzLjk4N1YyMzQuMDIyaC05Mi4zNTJjLTIzLjkzOCAxOC43MTQtODEuMDE3IDU0LjAyNi0xNDIuNTY1IDgzLjI2NWwtMzIuMjg3IDE1LjE0NyAzNi4wMTQgODEuMDQyIDI3Ljk0Ni0xNC4zOGMxOS4zNzgtOS42MTEgNzIuNjE3LTM3LjM1NyA5MC42OC01MS43djQxNi41OTFoMTEyLjU2NCIvPjwvc3ZnPg==" style="height: 2em;vertical-align: middle;"></span></td>
    <td class="gt_row gt_right">2,106,827</td>
  </tr>
  <tr>
    <td class="gt_row gt_left">Champs-Élysées—Clemenceau</td>
    <td class="gt_row gt_right"><span style="white-space:nowrap;"><img src="https://posit-dev.github.io/great-tables/blog/open-transit-tools/data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHJvbGU9ImltZyIgdmlld0JveD0iMCAwIDEwNTAgMTA1MCIgc3R5bGU9ImhlaWdodDoxZW07d2lkdGg6MS4xM2VtO3ZlcnRpY2FsLWFsaWduOi0wLjEyNWVtO21hcmdpbi1sZWZ0OmF1dG87bWFyZ2luLXJpZ2h0OmF1dG87Zm9udC1zaXplOmluaGVyaXQ7b3ZlcmZsb3c6dmlzaWJsZTtwb3NpdGlvbjpyZWxhdGl2ZTsiPjxjaXJjbGUgZmlsbD0iI0ZFQ0UwMCIgY3g9IjUwMCIgY3k9IjUwMCIgcj0iNTAwIi8+PHBhdGggZmlsbD0iIzIyMUUyMCIgZD0iTTU3Ny4wMjYgNzYzLjk4N1YyMzQuMDIyaC05Mi4zNTJjLTIzLjkzOCAxOC43MTQtODEuMDE3IDU0LjAyNi0xNDIuNTY1IDgzLjI2NWwtMzIuMjg3IDE1LjE0NyAzNi4wMTQgODEuMDQyIDI3Ljk0Ni0xNC4zOGMxOS4zNzgtOS42MTEgNzIuNjE3LTM3LjM1NyA5MC42OC01MS43djQxNi41OTFoMTEyLjU2NCIvPjwvc3ZnPg==" style="height: 2em;vertical-align: middle;"> <img src="https://posit-dev.github.io/great-tables/blog/open-transit-tools/data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHJvbGU9ImltZyIgdmlld0JveD0iMCAwIDEwNTAgMTA1MCIgc3R5bGU9ImhlaWdodDoxZW07d2lkdGg6MS4xM2VtO3ZlcnRpY2FsLWFsaWduOi0wLjEyNWVtO21hcmdpbi1sZWZ0OmF1dG87bWFyZ2luLXJpZ2h0OmF1dG87Zm9udC1zaXplOmluaGVyaXQ7b3ZlcmZsb3c6dmlzaWJsZTtwb3NpdGlvbjpyZWxhdGl2ZTsiPjxjaXJjbGUgZmlsbD0iIzk5RDRERSIgY3g9IjUwMCIgY3k9IjUwMCIgcj0iNTAwIi8+PHBhdGggZmlsbD0iIzIzMUYyMCIgZD0iTTM4Ny41IDc2NC4xMVYyMzQuMDNoLTkyLjM2MWMtMjQuMDkyIDE4LjY5NS04MS4xODkgNTMuODcxLTE0Mi43MyA4My4xMDVsLTMyLjI5MiAxNC45NzQgMzYuMDk2IDgxLjYgMjcuNzc2LTE0LjI2YzE5LjQ1Ni05Ljc0NSA3Mi44MjgtMzcuNDM1IDkwLjc3Ny01MS42MTN2NDE2LjI4aDExMi43Mk04MjEuMjIgNjA2LjkzYzAtNzQuMTUxLTQ0LjI5Ny0xMTcuNTY5LTEwMi44NTktMTI4Ljg1OXYtMS40NjVjNTYuMjY2LTIwLjk5NCA4NS40MjgtNjIuODYzIDg1LjQyOC0xMTcuNTcgMC03MS4xNDMtNjEuNDk1LTEzNC4wNC0xNjkuNTEtMTM0LjA0LTYyLjQ0NyAwLTExMy4zOCAxNy4yNy0xNTkuMTUgNDcuMjE3bDM2LjcxMSA3Ny44NzdjMTcuMjM2LTE0LjIyMSA0OS40NS0zOC4xODYgOTguMzQ2LTM4LjE4NiA1NS41OTMgMCA4MS4wMjkgMjkuOTg1IDgxLjAyOSA2My42OTQgMCA0MC4zMjQtMzIuMjEzIDY1Ljg3NS04NC4xMjEgNjUuODc1SDU1MS41OHY4Ny41OGg1NC44MDFjNTQuMjAzIDAgMTAwLjY0IDE5LjQ0OSAxMDAuNjQgODAuMDk3IDAgNDQuOTItMzguMTk3IDc4LjY3LTk5LjkzMiA3OC42Ny00NC43NzQgMC04MS42MDQtMTcuMjcxLTEwNC4xNy0zNC40NjRsLTQwLjU5NiA4MS42MDFjNDIuNzk0IDIzLjkyNiA4NC4wNjIgMzkuNjEzIDE1Mi4zNyAzOS42MTMgMTIzLjE0OS0uMDExIDIwNi41Mi03NC44ODEgMjA2LjUyLTE2Ny42NWwuMDA3LjAxeiIvPjwvc3ZnPg==" style="height: 2em;vertical-align: middle;"></span></td>
    <td class="gt_row gt_right">1,909,005</td>
  </tr>
  <tr>
    <td class="gt_row gt_left">Charles de Gaulle—Étoile</td>
    <td class="gt_row gt_right"><span style="white-space:nowrap;"><img src="https://posit-dev.github.io/great-tables/blog/open-transit-tools/data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHJvbGU9ImltZyIgdmlld0JveD0iMCAwIDEwNTAgMTA1MCIgc3R5bGU9ImhlaWdodDoxZW07d2lkdGg6MS4xM2VtO3ZlcnRpY2FsLWFsaWduOi0wLjEyNWVtO21hcmdpbi1sZWZ0OmF1dG87bWFyZ2luLXJpZ2h0OmF1dG87Zm9udC1zaXplOmluaGVyaXQ7b3ZlcmZsb3c6dmlzaWJsZTtwb3NpdGlvbjpyZWxhdGl2ZTsiPjxjaXJjbGUgZmlsbD0iI0ZFQ0UwMCIgY3g9IjUwMCIgY3k9IjUwMCIgcj0iNTAwIi8+PHBhdGggZmlsbD0iIzIyMUUyMCIgZD0iTTU3Ny4wMjYgNzYzLjk4N1YyMzQuMDIyaC05Mi4zNTJjLTIzLjkzOCAxOC43MTQtODEuMDE3IDU0LjAyNi0xNDIuNTY1IDgzLjI2NWwtMzIuMjg3IDE1LjE0NyAzNi4wMTQgODEuMDQyIDI3Ljk0Ni0xNC4zOGMxOS4zNzgtOS42MTEgNzIuNjE3LTM3LjM1NyA5MC42OC01MS43djQxNi41OTFoMTEyLjU2NCIvPjwvc3ZnPg==" style="height: 2em;vertical-align: middle;"> <img src="https://posit-dev.github.io/great-tables/blog/open-transit-tools/data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHJvbGU9ImltZyIgdmlld0JveD0iMCAwIDEwNTAgMTA1MCIgc3R5bGU9ImhlaWdodDoxZW07d2lkdGg6MS4xM2VtO3ZlcnRpY2FsLWFsaWduOi0wLjEyNWVtO21hcmdpbi1sZWZ0OmF1dG87bWFyZ2luLXJpZ2h0OmF1dG87Zm9udC1zaXplOmluaGVyaXQ7b3ZlcmZsb3c6dmlzaWJsZTtwb3NpdGlvbjpyZWxhdGl2ZTsiPjxjaXJjbGUgZmlsbD0iIzAwNjVBRSIgY3g9IjUwMCIgY3k9IjUwMCIgcj0iNTAwIi8+PHBhdGggZmlsbD0iI2ZmZiIgZD0iTTY3Ni40NCA3NDAuOTV2LTg4LjcwOUg0NTcuNzZjNi44ODgtMzAuNzEzIDYwLjEzMy03NS4wMzUgODcuMDg0LTk5Ljc1IDYzLjg1NS01Ny45OTcgMTIxLjYyLTk5LjE4OCAxMjEuNjItMTkwLjAxIDAtMTA4LjA1LTg3LjY3OC0xNjAuNjEtMTgwLjc2LTE2MC42MS03MS4zNjYgMC0xMTguNjIgMjAuOTkxLTE2OS43MiA2NS4zNzlsNTUuNzE3IDczLjU4NWMxMi42NTItMTQuMzM1IDQ0Ljk3NS00OC4xMTIgOTEuNDM0LTQ4LjExMiA1Ny43NiAwIDg3Ljc0MiAzNi43NzYgODcuNzQyIDgyLjQ4MiAwIDUxLjIwOS0zOC4wMjMgODcuODU0LTczLjM0NCAxMTguNjMtNzAuNzA5IDYxLjU5LTEzMS40NyAxMTUuNTctMTQ0Ljk0IDE3Ny4yOXY2OS44NjFoMzQzLjg1MSIvPjwvc3ZnPg==" style="height: 2em;vertical-align: middle;"> <img src="https://posit-dev.github.io/great-tables/blog/open-transit-tools/data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHJvbGU9ImltZyIgdmlld0JveD0iMCAwIDEwNTAgMTA1MCIgc3R5bGU9ImhlaWdodDoxZW07d2lkdGg6MS4xM2VtO3ZlcnRpY2FsLWFsaWduOi0wLjEyNWVtO21hcmdpbi1sZWZ0OmF1dG87bWFyZ2luLXJpZ2h0OmF1dG87Zm9udC1zaXplOmluaGVyaXQ7b3ZlcmZsb3c6dmlzaWJsZTtwb3NpdGlvbjpyZWxhdGl2ZTsiPjxjaXJjbGUgZmlsbD0iIzg0QzI4RSIgY3g9IjUwMCIgY3k9IjUwMCIgcj0iNTAwIi8+PHBhdGggZmlsbD0iIzIzMUYyMCIgZD0iTTY3Mi4xNiA1NzAuNTZjMC05OS4zMDUtNzAuNTE5LTE1Ny4wMS0xNTcuMTEtMTU3LjAxLTU1Ljk0NyAwLTg5Ljg4NyAyMC4yODctMTA3Ljc5IDM2LjA2OCA2LjY5OS0xMDYuNTIxIDYxLjQzOC0xNTkuODcgMTM0LjQxLTE1OS44NyAyOS43NjggMCA1Ni45NzMgNi43MDEgNzEuMDMxIDEyLjg5MWwxNi42Ni05MC4xMTVjLTIxLjcxMy01LjQxNy00OC45MTYtOC45MzQtNzguODMtOC45MzQtMTY2LjU5IDAtMjUxLjM2IDEyNS44OTEtMjUxLjM2IDMwOS44OTEgMCAxNDAuMzUgNTAuODk1IDI0MC4zMSAxOTMuNTggMjQwLjMxIDEwOC44OS0uMDAxIDE3OS40MS03Ny41NjEgMTc5LjQwOS0xODMuMjMxbS0xMDUuODA5IDExLjI4YzAgNDUuNjI1LTI2LjI1NCA4OC40My03Ny40MDEgODguNDMtNTIuNTc4IDAtODAuOTUzLTQ4Ljc3Mi04MC45NTMtOTkuMTIgMC0xNS42MzggMC0zNS45NTkgNi4wMDQtNDQuOTY4IDEwLjQ3MS0xNi41ODYgMzYuNzk3LTI5LjE4NCA2OS4wNTUtMjkuMTg0IDUwLjkyIDAgODMuMjkgMzUuMTkgODMuMjkgODQuODRsLjAwNS4wMDJ6Ii8+PC9zdmc+" style="height: 2em;vertical-align: middle;"></span></td>
    <td class="gt_row gt_right">4,291,663</td>
  </tr>
</tbody>


</table>

</div>
</div>
</div>
</section>
<section id="amtrak-interactive-route-table" class="level3">
<h3 class="anchored" data-anchor-id="amtrak-interactive-route-table">Amtrak interactive route table</h3>
<p>Our 2022 Annual Posit Table Contest received the most incredible entry—an interactive table of Amtrak routes. The table uses the library reactable in R (which we recently <a href="https://github.com/machow/reactable-py">ported to Python</a>!).</p>
<p>Here is a link to to <a href="https://joshfangmeier.quarto.pub/table-contest-2022/#sec-table">the interactive Amtrak table by Josh Fangmeier</a>. And I’ll drop a handy screenshot below.</p>
<div class="quarto-figure quarto-figure-center">
<figure class="figure">
<p><img src="https://posit-dev.github.io/great-tables/blog/open-transit-tools/amtrak-routes.jpg" class="img-fluid quarto-figure quarto-figure-center figure-img" style="width:85.0%"></p>
</figure>
</div>
<p><br><br></p>
</section>
<section id="cal-itp-trips-table" class="level3">
<h3 class="anchored" data-anchor-id="cal-itp-trips-table">Cal-ITP trips table</h3>
<p>Our 2024 contest saw a great set of transit tables submitted by Tiffany Ku at CalTrans (<a href="https://forum.posit.co/t/hourly-transit-service-patterns-table-contest/187805">submission</a>, <a href="https://github.com/tiffanychu90/great-tables-contest">github repo</a>). The submission showed service patterns using stop times binned by hour. It produced these for all California operators!</p>
<p>Here is the reasoning given behind the table:</p>
<blockquote class="blockquote">
<p>We can see what service patterns look like across operators by hour of the day. In one table, we can quickly see a summary snapshot of what this service pattern is and see the type of riders the operator typically serves. Here’s the same <a href="https://www.ncbi.nlm.nih.gov/pmc/articles/PMC7160583/figure/fig6/">chart</a> made in a <a href="https://www.ncbi.nlm.nih.gov/pmc/articles/PMC7160583">paper</a> about for transit in Calgary, Canada.</p>
</blockquote>
<div class="quarto-figure quarto-figure-center">
<figure class="figure">
<p><img src="https://posit-dev.github.io/great-tables/blog/open-transit-tools/calitp-service-patterns.png" class="img-fluid quarto-figure quarto-figure-center figure-img" style="width:85.0%"></p>
</figure>
</div>
</section>
</section>
<section id="what-are-you-hoping-to-contribute" class="level2">
<h2 class="anchored" data-anchor-id="what-are-you-hoping-to-contribute">What are you hoping to contribute?</h2>
<p>I’m hoping to focus on two things:</p>
<ul>
<li>Workshops to support R and Python analyst teams (and help me appreciate their needs).</li>
<li>Collaboration on creating open source tools and guides for analyzing transit data.</li>
</ul>
<section id="workshops" class="level3">
<h3 class="anchored" data-anchor-id="workshops">Workshops</h3>
<p>Beyond my obvious potential involvement as a table fanatic, I’m really interested in making the daily lives of R and Python users at public transit agencies easier.</p>
<ul>
<li><strong>Workshops on R</strong>. Think Tidyverse, Shiny, Quarto, querying warehouses.</li>
<li><strong>Workshops on Python</strong>. Let’s say Polars, Quarto, publishing notebooks, Great Tables, dashboards.</li>
<li><strong>Analytics engineering</strong>. How to get analysts to use your data models 😓.</li>
</ul>
<p>I’m open to whatever topics seem most useful, even if they aren’t in the list above.</p>
<div class="callout callout-style-default callout-important callout-titled" title="Scheduling a workshop">
<div class="callout-header d-flex align-content-center">
<div class="callout-icon-container">
<i class="callout-icon"></i>
</div>
<div class="callout-title-container flex-fill">
<span class="screen-reader-only">Important</span>Scheduling a workshop
</div>
</div>
<div class="callout-body-container callout-body">
<p>If you’re a public transit agency, reach out on <a href="https://www.linkedin.com/in/michael-a-chow/">linkedin</a> or <a href="https://bsky.app/profile/mchow.com">bluesky</a>, and I will send my calendly for scheduling.</p>
</div>
</div>
</section>
<section id="collaboration" class="level3">
<h3 class="anchored" data-anchor-id="collaboration">Collaboration</h3>
<p>I’m interested in understanding major challenges analytics teams working on public transit face, and the kind of strategic and tooling support they’d most benefit from. If you’re working on analytics in public transit, I would love to hear about what you’re working on, and the tools you use most.</p>
<p>One topic I’ve discussed with a few agencies is <a href="https://wwww.septa.org/news/ghost-bus-ting/">ghost buses</a>, which is when a bus is scheduled but never shows up. This is an interesting analysis because it combines GTFS schedule data with GTFS-RT realtime bus data.</p>
<p>Another is passenger events (e.g.&nbsp;people tapping on or off a bus). This data is challenging because different vendors data record and deliver this data in different ways. This can make it hard for analysts across agencies to discuss analyses—every analysis is different in its own way.</p>
</section>
</section>
<section id="in-summary" class="level2">
<h2 class="anchored" data-anchor-id="in-summary">In summary</h2>
<p>Analytics in public transit is a really neat, impactful area—with an active community working on open source data standards and tooling. As a data science tool builder on the open source team at Posit, PBC, my mission is to create value and give it away to teams using Python or R for code first data science. I’d love to support open source work in public transit however is most useful.</p>


</section>

 ]]></description>
  <guid>https://posit-dev.github.io/great-tables/blog/open-transit-tools/</guid>
  <pubDate>Thu, 19 Dec 2024 00:00:00 GMT</pubDate>
</item>
<item>
  <title>Rendering images anywhere in Great Tables</title>
  <dc:creator>Jerry Wu</dc:creator>
  <link>https://posit-dev.github.io/great-tables/blog/rendering-images/</link>
  <description><![CDATA[ 




<p>Rendering images in Great Tables is straightforward with <a href="../../reference/GT.fmt_image.html#great_tables.GT.fmt_image" title="0"><code>GT.fmt_image()</code></a> and <a href="../../reference/vals.fmt_image.html#great_tables.vals.fmt_image" title="0"><code>vals.fmt_image()</code></a>. In this post, we’ll explore three key topics:</p>
<ul>
<li>Four examples demonstrating how to render images within the body using <a href="../../reference/GT.fmt_image.html#great_tables.GT.fmt_image" title="0"><code>GT.fmt_image()</code></a>.</li>
<li>How to render images anywhere using <a href="../../reference/vals.fmt_image.html#great_tables.vals.fmt_image" title="0"><code>vals.fmt_image()</code></a> and <a href="../../reference/html.html#great_tables.html" title="0"><code>html()</code></a>.</li>
<li>How to manually render images anywhere using <a href="../../reference/html.html#great_tables.html" title="0"><code>html()</code></a>.</li>
</ul>
<section id="rendering-images-in-the-body" class="level2">
<h2 class="anchored" data-anchor-id="rendering-images-in-the-body">Rendering Images in the Body</h2>
<p><a href="https://posit-dev.github.io/great-tables/reference/GT.fmt_image.html#great_tables.GT.fmt_image">GT.fmt_image()</a> is the go-to tool for rendering images within the body of a table. Below, we’ll present four examples corresponding to the cases outlined in the documentation:</p>
<ul>
<li><strong>Case 1</strong>: Local file paths.</li>
<li><strong>Case 2</strong>: Full HTTP/HTTPS URLs.</li>
<li><strong>Case 3</strong>: Image names with the <code>path=</code> argument.</li>
<li><strong>Case 4</strong>: Image names using both the <code>path=</code> and <code>file_pattern=</code> arguments.</li>
</ul>
<div class="callout callout-style-default callout-tip callout-titled">
<div class="callout-header d-flex align-content-center" data-bs-toggle="collapse" data-bs-target=".callout-1-contents" aria-controls="callout-1" aria-expanded="true" aria-label="Toggle callout">
<div class="callout-icon-container">
<i class="callout-icon"></i>
</div>
<div class="callout-title-container flex-fill">
<span class="screen-reader-only">Tip</span>Finding the Right Case for Your Needs
</div>
<div class="callout-btn-toggle d-inline-block border-0 py-1 ps-1 pe-0 float-end"><i class="callout-toggle"></i></div>
</div>
<div id="callout-1" class="callout-1-contents callout-collapse collapse show">
<div class="callout-body-container callout-body">
<ul>
<li><strong>Case 1</strong> and <strong>Case 2</strong> work best for data sourced directly from a database.</li>
<li><strong>Case 3</strong> is ideal for users dealing with image names relative to a base directory or URL (e.g., <code>/path/to/images</code>).</li>
<li><strong>Case 4</strong> is tailored for users working with patterned image names (e.g., <code>metro_{}.svg</code>).</li>
</ul>
</div>
</div>
</div>
<section id="preparations" class="level3">
<h3 class="anchored" data-anchor-id="preparations">Preparations</h3>
<p>For this demonstration, we’ll use the first five rows of the built-in <a href="https://posit-dev.github.io/great-tables/reference/data.metro.html#great_tables.data.metro">metro</a> dataset, specifically the <code>name</code> and <code>lines</code> columns.</p>
<p>To ensure a smooth walkthrough, we’ll manipulate the <code>data</code> (a Python dictionary) directly. However, in real-world applications, such operations are more likely performed at the DataFrame level to leverage the benefits of vectorized operations.</p>
<div id="04d46a78" class="cell" data-execution_count="1">
<details class="code-fold">
<summary>Show the Code</summary>
<div class="code-copy-outer-scaffold"><div class="sourceCode cell-code" id="cb1" style="background: #f1f3f5;"><pre class="sourceCode python code-with-copy"><code class="sourceCode python"><span id="cb1-1"><span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">import</span> pandas <span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">as</span> pd</span>
<span id="cb1-2"><span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">from</span> great_tables <span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">import</span> GT, vals, html</span>
<span id="cb1-3"><span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">from</span> importlib_resources <span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">import</span> files</span>
<span id="cb1-4"></span>
<span id="cb1-5">pd.set_option(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">'display.max_colwidth'</span>, <span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">150</span>)</span>
<span id="cb1-6"></span>
<span id="cb1-7">data <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> {</span>
<span id="cb1-8">    <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"name"</span>: [</span>
<span id="cb1-9">        <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Argentine"</span>,</span>
<span id="cb1-10">        <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Bastille"</span>,</span>
<span id="cb1-11">        <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Bérault"</span>,</span>
<span id="cb1-12">        <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Champs-Élysées—Clemenceau"</span>,</span>
<span id="cb1-13">        <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Charles de Gaulle—Étoile"</span>,</span>
<span id="cb1-14">    ],</span>
<span id="cb1-15">    <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"lines"</span>: [<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"1"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"1, 5, 8"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"1"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"1, 13"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"1, 2, 6"</span>],</span>
<span id="cb1-16">}</span>
<span id="cb1-17"></span>
<span id="cb1-18"><span class="bu" style="color: null;
background-color: null;
font-style: inherit;">print</span>(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"""</span><span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">\</span></span>
<span id="cb1-19"><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">data = {</span></span>
<span id="cb1-20"><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">    "name": [</span></span>
<span id="cb1-21"><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">        "Argentine",</span></span>
<span id="cb1-22"><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">        "Bastille",</span></span>
<span id="cb1-23"><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">        "Bérault",</span></span>
<span id="cb1-24"><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">        "Champs-Élysées—Clemenceau",</span></span>
<span id="cb1-25"><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">        "Charles de Gaulle—Étoile",</span></span>
<span id="cb1-26"><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">    ],</span></span>
<span id="cb1-27"><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">    "lines": ["1", "1, 5, 8", "1", "1, 13", "1, 2, 6"],</span></span>
<span id="cb1-28"><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">}</span><span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">\</span></span>
<span id="cb1-29"><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"""</span>)</span></code></pre></div></div>
</details>
<div class="cell-output cell-output-stdout">
<pre><code>data = {
    "name": [
        "Argentine",
        "Bastille",
        "Bérault",
        "Champs-Élysées—Clemenceau",
        "Charles de Gaulle—Étoile",
    ],
    "lines": ["1", "1, 5, 8", "1", "1, 13", "1, 2, 6"],
}</code></pre>
</div>
</div>
<p>Attentive readers may have noticed that the values for the key <code>lines</code> are lists of strings, each containing one or more numbers separated by commas. <a href="../../reference/GT.fmt_image.html#great_tables.GT.fmt_image" title="0"><code>GT.fmt_image()</code></a> is specifically designed to handle such cases, allowing users to render multiple images in a single row.</p>
</section>
<section id="case-1-local-file-paths" class="level3">
<h3 class="anchored" data-anchor-id="case-1-local-file-paths">Case 1: Local File Paths</h3>
<p><strong>Case 1</strong> demonstrates how to simulate a column containing strings representing local file paths. We’ll use images stored in the <code>data/metro_images</code> directory of Great Tables:</p>
<div id="e741ce36" class="cell" data-execution_count="2">
<div class="code-copy-outer-scaffold"><div class="sourceCode cell-code" id="annotated-cell-2" style="background: #f1f3f5;"><pre class="sourceCode python code-annotation-code code-with-copy code-annotated"><code class="sourceCode python"><a class="code-annotation-anchor" data-target-cell="annotated-cell-2" data-target-annotation="1" onclick="event.preventDefault();">1</a><span id="annotated-cell-2-1" class="code-annotation-target">img_local_paths <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> files(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"great_tables"</span>) <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">/</span> <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"data/metro_images"</span></span><div class="code-annotation-gutter-bg"></div><div class="code-annotation-gutter"></div></code></pre></div></div>
<div class="cell-annotation">
<dl class="code-annotation-container-grid">
<dt data-target-cell="annotated-cell-2" data-target-annotation="1">1</dt>
<dd>
<span data-code-cell="annotated-cell-2" data-code-lines="1" data-code-annotation="1">These image files follow a patterned naming convention, such as <code>metro_1.svg</code>, <code>metro_2.svg</code>, and so on.</span>
</dd>
</dl>
</div>
</div>
<p>Below is a <code>Pandas</code> DataFrame called <code>metro_mini1</code>, where the <code>case1</code> column contains local file paths that we want to render as images.</p>
<div id="10d97bc9" class="cell" data-execution_count="3">
<details class="code-fold">
<summary>Show the Code</summary>
<div class="code-copy-outer-scaffold"><div class="sourceCode cell-code" id="cb3" style="background: #f1f3f5;"><pre class="sourceCode python code-with-copy"><code class="sourceCode python"><span id="cb3-1">metro_mini1 <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> pd.DataFrame(</span>
<span id="cb3-2">    {</span>
<span id="cb3-3">        <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">**</span>data,</span>
<span id="cb3-4">        <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"case1"</span>: [</span>
<span id="cb3-5">            <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">", "</span>.join(</span>
<span id="cb3-6">                <span class="bu" style="color: null;
background-color: null;
font-style: inherit;">str</span>((img_local_paths <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">/</span> <span class="ss" style="color: #20794D;
background-color: null;
font-style: inherit;">f"metro_</span><span class="sc" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">{</span>item<span class="sc" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">}</span><span class="ss" style="color: #20794D;
background-color: null;
font-style: inherit;">"</span>).with_suffix(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">".svg"</span>))</span>
<span id="cb3-7">                <span class="cf" style="color: #003B4F;
background-color: null;
font-weight: bold;
font-style: inherit;">for</span> item <span class="kw" style="color: #003B4F;
background-color: null;
font-weight: bold;
font-style: inherit;">in</span> row.split(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">", "</span>)</span>
<span id="cb3-8">            )</span>
<span id="cb3-9">            <span class="cf" style="color: #003B4F;
background-color: null;
font-weight: bold;
font-style: inherit;">for</span> row <span class="kw" style="color: #003B4F;
background-color: null;
font-weight: bold;
font-style: inherit;">in</span> data[<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"lines"</span>]</span>
<span id="cb3-10">        ],</span>
<span id="cb3-11">    }</span>
<span id="cb3-12">)</span>
<span id="cb3-13">metro_mini1</span></code></pre></div></div>
</details>
<div class="cell-output cell-output-display" data-execution_count="3">
<div>

<table class="dataframe table table-sm table-striped small">
  <thead>
    <tr>
      <th></th>
      <th>name</th>
      <th>lines</th>
      <th>case1</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <th>0</th>
      <td>Argentine</td>
      <td>1</td>
      <td>/opt/hostedtoolcache/Python/3.10.20/x64/lib/python3.10/site-packages/great_tables/data/metro_images/metro_1.svg</td>
    </tr>
    <tr>
      <th>1</th>
      <td>Bastille</td>
      <td>1, 5, 8</td>
      <td>/opt/hostedtoolcache/Python/3.10.20/x64/lib/python3.10/site-packages/great_tables/data/metro_images/metro_1.svg, /opt/hostedtoolcache/Python/3.10....</td>
    </tr>
    <tr>
      <th>2</th>
      <td>Bérault</td>
      <td>1</td>
      <td>/opt/hostedtoolcache/Python/3.10.20/x64/lib/python3.10/site-packages/great_tables/data/metro_images/metro_1.svg</td>
    </tr>
    <tr>
      <th>3</th>
      <td>Champs-Élysées—Clemenceau</td>
      <td>1, 13</td>
      <td>/opt/hostedtoolcache/Python/3.10.20/x64/lib/python3.10/site-packages/great_tables/data/metro_images/metro_1.svg, /opt/hostedtoolcache/Python/3.10....</td>
    </tr>
    <tr>
      <th>4</th>
      <td>Charles de Gaulle—Étoile</td>
      <td>1, 2, 6</td>
      <td>/opt/hostedtoolcache/Python/3.10.20/x64/lib/python3.10/site-packages/great_tables/data/metro_images/metro_1.svg, /opt/hostedtoolcache/Python/3.10....</td>
    </tr>
  </tbody>
</table>
</div>
</div>
</div>
<div class="callout callout-style-default callout-tip callout-titled">
<div class="callout-header d-flex align-content-center" data-bs-toggle="collapse" data-bs-target=".callout-2-contents" aria-controls="callout-2" aria-expanded="true" aria-label="Toggle callout">
<div class="callout-icon-container">
<i class="callout-icon"></i>
</div>
<div class="callout-title-container flex-fill">
<span class="screen-reader-only">Tip</span>Use the <code>pathlib</code> Module to Construct Paths
</div>
<div class="callout-btn-toggle d-inline-block border-0 py-1 ps-1 pe-0 float-end"><i class="callout-toggle"></i></div>
</div>
<div id="callout-2" class="callout-2-contents callout-collapse collapse show">
<div class="callout-body-container callout-body">
<p>Local file paths can vary depending on the operating system, which makes it easy to accidentally construct invalid paths. A good practice to mitigate this is to use Python’s built-in <a href="https://docs.python.org/3/library/pathlib.html">pathlib</a> module to construct paths first and then convert them to strings. In this example, <code>img_local_paths</code> is actually an instance of <code>pathlib.Path</code>.</p>
<div id="c1b89d64" class="cell" data-execution_count="4">
<div class="code-copy-outer-scaffold"><div class="sourceCode cell-code" id="cb4" style="background: #f1f3f5;"><pre class="sourceCode python code-with-copy"><code class="sourceCode python"><span id="cb4-1"><span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">from</span> pathlib <span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">import</span> Path</span>
<span id="cb4-2"></span>
<span id="cb4-3"><span class="bu" style="color: null;
background-color: null;
font-style: inherit;">isinstance</span>(img_local_paths, Path)  <span class="co" style="color: #5E5E5E;
background-color: null;
font-style: inherit;"># True</span></span></code></pre></div></div>
</div>
</div>
</div>
</div>
<p>The <code>case1</code> column is quite lengthy due to the inclusion of <code>img_local_paths</code>. In <strong>Case 3</strong>, we’ll share a useful trick to avoid repeating the directory name each time—stay tuned!</p>
<p>For now, let’s use <a href="../../reference/GT.fmt_image.html#great_tables.GT.fmt_image" title="0"><code>GT.fmt_image()</code></a> to render images by passing <code>"case1"</code> as the first argument:</p>
<div id="d2932fc4" class="cell" data-execution_count="5">
<div class="code-copy-outer-scaffold"><div class="sourceCode cell-code" id="cb5" style="background: #f1f3f5;"><pre class="sourceCode python code-with-copy"><code class="sourceCode python"><span id="cb5-1">GT(metro_mini1).fmt_image(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"case1"</span>).cols_align(align<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"right"</span>, columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"case1"</span>)</span></code></pre></div></div>
<div class="cell-output cell-output-display" data-execution_count="4">
<div id="vwcgydcvuy" style="padding-left:0px;padding-right:0px;padding-top:10px;padding-bottom:10px;overflow-x:auto;overflow-y:auto;width:auto;height:auto;">
<style>
#vwcgydcvuy table {
          font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Helvetica Neue', 'Fira Sans', 'Droid Sans', Arial, sans-serif;
          -webkit-font-smoothing: antialiased;
          -moz-osx-font-smoothing: grayscale;
        }

#vwcgydcvuy thead, tbody, tfoot, tr, td, th { border-style: none; }
 tr { background-color: transparent; }
#vwcgydcvuy p { margin: 0; padding: 0; }
 #vwcgydcvuy .gt_table { display: table; border-collapse: collapse; line-height: normal; margin-left: auto; margin-right: auto; color: #333333; font-size: 16px; font-weight: normal; font-style: normal; background-color: #FFFFFF; width: auto; border-top-style: solid; border-top-width: 2px; border-top-color: #A8A8A8; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #A8A8A8; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; }
 #vwcgydcvuy .gt_caption { padding-top: 4px; padding-bottom: 4px; }
 #vwcgydcvuy .gt_title { color: #333333; font-size: 125%; font-weight: initial; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; border-bottom-color: #FFFFFF; border-bottom-width: 0; }
 #vwcgydcvuy .gt_subtitle { color: #333333; font-size: 85%; font-weight: initial; padding-top: 3px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; border-top-color: #FFFFFF; border-top-width: 0; }
 #vwcgydcvuy .gt_heading { background-color: #FFFFFF; text-align: center; border-bottom-color: #FFFFFF; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #vwcgydcvuy .gt_bottom_border { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #vwcgydcvuy .gt_col_headings { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #vwcgydcvuy .gt_col_heading { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; overflow-x: hidden; }
 #vwcgydcvuy .gt_column_spanner_outer { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; padding-top: 0; padding-bottom: 0; padding-left: 4px; padding-right: 4px; }
 #vwcgydcvuy .gt_column_spanner_outer:first-child { padding-left: 0; }
 #vwcgydcvuy .gt_column_spanner_outer:last-child { padding-right: 0; }
 #vwcgydcvuy .gt_column_spanner { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; overflow-x: hidden; display: inline-block; width: 100%; }
 #vwcgydcvuy .gt_spanner_row { border-bottom-style: hidden; }
 #vwcgydcvuy .gt_group_heading { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; text-align: left; }
 #vwcgydcvuy .gt_empty_group_heading { padding: 0.5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: middle; }
 #vwcgydcvuy .gt_from_md> :first-child { margin-top: 0; }
 #vwcgydcvuy .gt_from_md> :last-child { margin-bottom: 0; }
 #vwcgydcvuy .gt_row { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; margin: 10px; border-top-style: solid; border-top-width: 1px; border-top-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; overflow-x: hidden; }
 #vwcgydcvuy .gt_stub { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; }
 #vwcgydcvuy .gt_stub_row_group { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; vertical-align: top; }
 #vwcgydcvuy .gt_row_group_first td { border-top-width: 2px; }
 #vwcgydcvuy .gt_row_group_first th { border-top-width: 2px; }
 #vwcgydcvuy .gt_striped { color: #333333; background-color: #F4F4F4; }
 #vwcgydcvuy .gt_table_body { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #vwcgydcvuy .gt_grand_summary_row { color: #333333; background-color: #FFFFFF; text-transform: inherit; padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; }
 #vwcgydcvuy .gt_first_grand_summary_row_bottom { border-top-style: double; border-top-width: 6px; border-top-color: #D3D3D3; }
 #vwcgydcvuy .gt_last_grand_summary_row_top { border-bottom-style: double; border-bottom-width: 6px; border-bottom-color: #D3D3D3; }
 #vwcgydcvuy .gt_sourcenotes { color: #333333; background-color: #FFFFFF; border-bottom-style: none; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; }
 #vwcgydcvuy .gt_sourcenote { font-size: 90%; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; text-align: left; }
 #vwcgydcvuy .gt_left { text-align: left; }
 #vwcgydcvuy .gt_center { text-align: center; }
 #vwcgydcvuy .gt_right { text-align: right; font-variant-numeric: tabular-nums; }
 #vwcgydcvuy .gt_font_normal { font-weight: normal; }
 #vwcgydcvuy .gt_font_bold { font-weight: bold; }
 #vwcgydcvuy .gt_font_italic { font-style: italic; }
 #vwcgydcvuy .gt_super { font-size: 65%; }
 #vwcgydcvuy .gt_footnote_marks { font-size: 75%; vertical-align: 0.4em; position: initial; }
 #vwcgydcvuy .gt_asterisk { font-size: 100%; vertical-align: 0; }
 
</style>
<table class="gt_table" data-quarto-disable-processing="false" data-quarto-bootstrap="false">
<thead>

<tr class="gt_col_headings">
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="1" colspan="1" scope="col" id="name">name</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="lines">lines</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="case1">case1</th>
</tr>
</thead>
<tbody class="gt_table_body">
  <tr>
    <td class="gt_row gt_left">Argentine</td>
    <td class="gt_row gt_right">1</td>
    <td class="gt_row gt_right"><span style="white-space:nowrap;"><img src="https://posit-dev.github.io/great-tables/blog/rendering-images/data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHJvbGU9ImltZyIgdmlld0JveD0iMCAwIDEwNTAgMTA1MCIgc3R5bGU9ImhlaWdodDoxZW07d2lkdGg6MS4xM2VtO3ZlcnRpY2FsLWFsaWduOi0wLjEyNWVtO21hcmdpbi1sZWZ0OmF1dG87bWFyZ2luLXJpZ2h0OmF1dG87Zm9udC1zaXplOmluaGVyaXQ7b3ZlcmZsb3c6dmlzaWJsZTtwb3NpdGlvbjpyZWxhdGl2ZTsiPjxjaXJjbGUgZmlsbD0iI0ZFQ0UwMCIgY3g9IjUwMCIgY3k9IjUwMCIgcj0iNTAwIi8+PHBhdGggZmlsbD0iIzIyMUUyMCIgZD0iTTU3Ny4wMjYgNzYzLjk4N1YyMzQuMDIyaC05Mi4zNTJjLTIzLjkzOCAxOC43MTQtODEuMDE3IDU0LjAyNi0xNDIuNTY1IDgzLjI2NWwtMzIuMjg3IDE1LjE0NyAzNi4wMTQgODEuMDQyIDI3Ljk0Ni0xNC4zOGMxOS4zNzgtOS42MTEgNzIuNjE3LTM3LjM1NyA5MC42OC01MS43djQxNi41OTFoMTEyLjU2NCIvPjwvc3ZnPg==" style="height: 2em;vertical-align: middle;"></span></td>
  </tr>
  <tr>
    <td class="gt_row gt_left">Bastille</td>
    <td class="gt_row gt_right">1, 5, 8</td>
    <td class="gt_row gt_right"><span style="white-space:nowrap;"><img src="https://posit-dev.github.io/great-tables/blog/rendering-images/data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHJvbGU9ImltZyIgdmlld0JveD0iMCAwIDEwNTAgMTA1MCIgc3R5bGU9ImhlaWdodDoxZW07d2lkdGg6MS4xM2VtO3ZlcnRpY2FsLWFsaWduOi0wLjEyNWVtO21hcmdpbi1sZWZ0OmF1dG87bWFyZ2luLXJpZ2h0OmF1dG87Zm9udC1zaXplOmluaGVyaXQ7b3ZlcmZsb3c6dmlzaWJsZTtwb3NpdGlvbjpyZWxhdGl2ZTsiPjxjaXJjbGUgZmlsbD0iI0ZFQ0UwMCIgY3g9IjUwMCIgY3k9IjUwMCIgcj0iNTAwIi8+PHBhdGggZmlsbD0iIzIyMUUyMCIgZD0iTTU3Ny4wMjYgNzYzLjk4N1YyMzQuMDIyaC05Mi4zNTJjLTIzLjkzOCAxOC43MTQtODEuMDE3IDU0LjAyNi0xNDIuNTY1IDgzLjI2NWwtMzIuMjg3IDE1LjE0NyAzNi4wMTQgODEuMDQyIDI3Ljk0Ni0xNC4zOGMxOS4zNzgtOS42MTEgNzIuNjE3LTM3LjM1NyA5MC42OC01MS43djQxNi41OTFoMTEyLjU2NCIvPjwvc3ZnPg==" style="height: 2em;vertical-align: middle;"> <img src="https://posit-dev.github.io/great-tables/blog/rendering-images/data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHJvbGU9ImltZyIgdmlld0JveD0iMCAwIDEwNTAgMTA1MCIgc3R5bGU9ImhlaWdodDoxZW07d2lkdGg6MS4xM2VtO3ZlcnRpY2FsLWFsaWduOi0wLjEyNWVtO21hcmdpbi1sZWZ0OmF1dG87bWFyZ2luLXJpZ2h0OmF1dG87Zm9udC1zaXplOmluaGVyaXQ7b3ZlcmZsb3c6dmlzaWJsZTtwb3NpdGlvbjpyZWxhdGl2ZTsiPjxjaXJjbGUgZmlsbD0iI0YxOTA0MyIgY3g9IjUwMCIgY3k9IjUwMCIgcj0iNTAwIi8+PHBhdGggZmlsbD0iIzIzMUYyMCIgZD0iTTY3OS43MSA1OTIuNzVjMC03OS40ODYtNTguNDItMTU5LjY4LTIwMy4yNy0xNjcuMjVsLTE1LjEzMy0uNzEyIDcuNDE4LTEwMS4zNTFoMTkwLjc4di04Ny45MTNoLTI3OC41MmwtMjEuMDM2IDI3NS40OSA4Mi41NDIuNzEyYzk3LjYxMy45NzkgMTIyLjk3OSA1My4zMTcgMTIyLjk3OSA5MS42NSAwIDYyLjE2LTUxLjYyNyA4NS42MjktOTIuODY2IDg1LjYyOS00NS4xODggMC03NS4wMzctMTYuNjE1LTEwMC42MS0zMy45MTJsLTM4Ljg5NyA4Mi42OWM0MS4wOTMgMjMuMTcyIDg5LjI3NyAzOC4zMzMgMTQ1LjUgMzguMzMzIDEyMC43NzEtLjA0IDIwMS4xMi04Mi4wOCAyMDEuMTItMTgzLjM3Ii8+PC9zdmc+" style="height: 2em;vertical-align: middle;"> <img src="https://posit-dev.github.io/great-tables/blog/rendering-images/data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHJvbGU9ImltZyIgdmlld0JveD0iMCAwIDEwNTAgMTA1MCIgc3R5bGU9ImhlaWdodDoxZW07d2lkdGg6MS4xM2VtO3ZlcnRpY2FsLWFsaWduOi0wLjEyNWVtO21hcmdpbi1sZWZ0OmF1dG87bWFyZ2luLXJpZ2h0OmF1dG87Zm9udC1zaXplOmluaGVyaXQ7b3ZlcmZsb3c6dmlzaWJsZTtwb3NpdGlvbjpyZWxhdGl2ZTsiPjxjaXJjbGUgZmlsbD0iI0NEQUNDRiIgY3g9IjUwMCIgY3k9IjUwMCIgcj0iNTAwIi8+PHBhdGggZmlsbD0iIzIzMUYyMCIgZD0iTTY4OS4yMSA2MTQuOTJjMC02OS42MTctNDIuNzQyLTExMS44MS05MS41NzMtMTM0Ljg1IDQ5LjU2OC0zMC4xNzUgNzUuMjA2LTY4LjQ1NCA3NS4yMDYtMTE3LjkgMC05MC45ODYtNzcuMzc4LTEzNi44My0xNzAuNDYtMTM2LjgzLTkwLjg3NyAwLTE3MC40MSA2MC45My0xNzAuNDEgMTQ4LjY2IDAgNTQuODAxIDI4LjU0NSA4Ny4wMzEgNzQuMjM1IDExNS41NC01MS4wMjMgMjYuMjk2LTkwLjc3OSA2Ny43MTYtOTAuNzc5IDEzOC4xNSAwIDgwLjM5NyA2Ni42OTMgMTUwLjkwOSAxODQuNTggMTUwLjkwOSAxMDguODYtLjAyIDE4OS4xOS02Mi45NiAxODkuMTktMTYzLjY4TTU3MS40MDkgMzY4LjgzYzAgMzMuMTItMzAuMDIxIDYzLjY4Mi01Ny44MTIgNzYuNTU5LTMzLjcwNS0xNC4yNzItNzcuMzAyLTM3LjYyLTc3LjMwMi04MS4wNTkgMC0zNi42ODkgMjYuMjIxLTYyLjI4NiA2Ny41MjctNjIuMjg2IDQzLjUyOS4wMSA2Ny41OCAyOS45MSA2Ny41OCA2Ni43OWwuMDA3LS4wMDR6bTguMjIgMjU0LjQyYzAgNDIuMDQyLTI3Ljc3IDc3LjM3My03OC4wOTUgNzcuMzczLTUxLjEwMyAwLTc5LjU1LTQxLjQ1OS03OS41NS04NC44OTYgMC00MS4xODggMzQuNTM5LTc1LjcwNSA2OS4wNTgtODkuMzE4IDQ0Ljk5IDIyLjU0IDg4LjU5IDQ4LjggODguNTkgOTYuODVsLS4wMDMtLjAwOXoiLz48L3N2Zz4=" style="height: 2em;vertical-align: middle;"></span></td>
  </tr>
  <tr>
    <td class="gt_row gt_left">Bérault</td>
    <td class="gt_row gt_right">1</td>
    <td class="gt_row gt_right"><span style="white-space:nowrap;"><img src="https://posit-dev.github.io/great-tables/blog/rendering-images/data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHJvbGU9ImltZyIgdmlld0JveD0iMCAwIDEwNTAgMTA1MCIgc3R5bGU9ImhlaWdodDoxZW07d2lkdGg6MS4xM2VtO3ZlcnRpY2FsLWFsaWduOi0wLjEyNWVtO21hcmdpbi1sZWZ0OmF1dG87bWFyZ2luLXJpZ2h0OmF1dG87Zm9udC1zaXplOmluaGVyaXQ7b3ZlcmZsb3c6dmlzaWJsZTtwb3NpdGlvbjpyZWxhdGl2ZTsiPjxjaXJjbGUgZmlsbD0iI0ZFQ0UwMCIgY3g9IjUwMCIgY3k9IjUwMCIgcj0iNTAwIi8+PHBhdGggZmlsbD0iIzIyMUUyMCIgZD0iTTU3Ny4wMjYgNzYzLjk4N1YyMzQuMDIyaC05Mi4zNTJjLTIzLjkzOCAxOC43MTQtODEuMDE3IDU0LjAyNi0xNDIuNTY1IDgzLjI2NWwtMzIuMjg3IDE1LjE0NyAzNi4wMTQgODEuMDQyIDI3Ljk0Ni0xNC4zOGMxOS4zNzgtOS42MTEgNzIuNjE3LTM3LjM1NyA5MC42OC01MS43djQxNi41OTFoMTEyLjU2NCIvPjwvc3ZnPg==" style="height: 2em;vertical-align: middle;"></span></td>
  </tr>
  <tr>
    <td class="gt_row gt_left">Champs-Élysées—Clemenceau</td>
    <td class="gt_row gt_right">1, 13</td>
    <td class="gt_row gt_right"><span style="white-space:nowrap;"><img src="https://posit-dev.github.io/great-tables/blog/rendering-images/data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHJvbGU9ImltZyIgdmlld0JveD0iMCAwIDEwNTAgMTA1MCIgc3R5bGU9ImhlaWdodDoxZW07d2lkdGg6MS4xM2VtO3ZlcnRpY2FsLWFsaWduOi0wLjEyNWVtO21hcmdpbi1sZWZ0OmF1dG87bWFyZ2luLXJpZ2h0OmF1dG87Zm9udC1zaXplOmluaGVyaXQ7b3ZlcmZsb3c6dmlzaWJsZTtwb3NpdGlvbjpyZWxhdGl2ZTsiPjxjaXJjbGUgZmlsbD0iI0ZFQ0UwMCIgY3g9IjUwMCIgY3k9IjUwMCIgcj0iNTAwIi8+PHBhdGggZmlsbD0iIzIyMUUyMCIgZD0iTTU3Ny4wMjYgNzYzLjk4N1YyMzQuMDIyaC05Mi4zNTJjLTIzLjkzOCAxOC43MTQtODEuMDE3IDU0LjAyNi0xNDIuNTY1IDgzLjI2NWwtMzIuMjg3IDE1LjE0NyAzNi4wMTQgODEuMDQyIDI3Ljk0Ni0xNC4zOGMxOS4zNzgtOS42MTEgNzIuNjE3LTM3LjM1NyA5MC42OC01MS43djQxNi41OTFoMTEyLjU2NCIvPjwvc3ZnPg==" style="height: 2em;vertical-align: middle;"> <img src="https://posit-dev.github.io/great-tables/blog/rendering-images/data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHJvbGU9ImltZyIgdmlld0JveD0iMCAwIDEwNTAgMTA1MCIgc3R5bGU9ImhlaWdodDoxZW07d2lkdGg6MS4xM2VtO3ZlcnRpY2FsLWFsaWduOi0wLjEyNWVtO21hcmdpbi1sZWZ0OmF1dG87bWFyZ2luLXJpZ2h0OmF1dG87Zm9udC1zaXplOmluaGVyaXQ7b3ZlcmZsb3c6dmlzaWJsZTtwb3NpdGlvbjpyZWxhdGl2ZTsiPjxjaXJjbGUgZmlsbD0iIzk5RDRERSIgY3g9IjUwMCIgY3k9IjUwMCIgcj0iNTAwIi8+PHBhdGggZmlsbD0iIzIzMUYyMCIgZD0iTTM4Ny41IDc2NC4xMVYyMzQuMDNoLTkyLjM2MWMtMjQuMDkyIDE4LjY5NS04MS4xODkgNTMuODcxLTE0Mi43MyA4My4xMDVsLTMyLjI5MiAxNC45NzQgMzYuMDk2IDgxLjYgMjcuNzc2LTE0LjI2YzE5LjQ1Ni05Ljc0NSA3Mi44MjgtMzcuNDM1IDkwLjc3Ny01MS42MTN2NDE2LjI4aDExMi43Mk04MjEuMjIgNjA2LjkzYzAtNzQuMTUxLTQ0LjI5Ny0xMTcuNTY5LTEwMi44NTktMTI4Ljg1OXYtMS40NjVjNTYuMjY2LTIwLjk5NCA4NS40MjgtNjIuODYzIDg1LjQyOC0xMTcuNTcgMC03MS4xNDMtNjEuNDk1LTEzNC4wNC0xNjkuNTEtMTM0LjA0LTYyLjQ0NyAwLTExMy4zOCAxNy4yNy0xNTkuMTUgNDcuMjE3bDM2LjcxMSA3Ny44NzdjMTcuMjM2LTE0LjIyMSA0OS40NS0zOC4xODYgOTguMzQ2LTM4LjE4NiA1NS41OTMgMCA4MS4wMjkgMjkuOTg1IDgxLjAyOSA2My42OTQgMCA0MC4zMjQtMzIuMjEzIDY1Ljg3NS04NC4xMjEgNjUuODc1SDU1MS41OHY4Ny41OGg1NC44MDFjNTQuMjAzIDAgMTAwLjY0IDE5LjQ0OSAxMDAuNjQgODAuMDk3IDAgNDQuOTItMzguMTk3IDc4LjY3LTk5LjkzMiA3OC42Ny00NC43NzQgMC04MS42MDQtMTcuMjcxLTEwNC4xNy0zNC40NjRsLTQwLjU5NiA4MS42MDFjNDIuNzk0IDIzLjkyNiA4NC4wNjIgMzkuNjEzIDE1Mi4zNyAzOS42MTMgMTIzLjE0OS0uMDExIDIwNi41Mi03NC44ODEgMjA2LjUyLTE2Ny42NWwuMDA3LjAxeiIvPjwvc3ZnPg==" style="height: 2em;vertical-align: middle;"></span></td>
  </tr>
  <tr>
    <td class="gt_row gt_left">Charles de Gaulle—Étoile</td>
    <td class="gt_row gt_right">1, 2, 6</td>
    <td class="gt_row gt_right"><span style="white-space:nowrap;"><img src="https://posit-dev.github.io/great-tables/blog/rendering-images/data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHJvbGU9ImltZyIgdmlld0JveD0iMCAwIDEwNTAgMTA1MCIgc3R5bGU9ImhlaWdodDoxZW07d2lkdGg6MS4xM2VtO3ZlcnRpY2FsLWFsaWduOi0wLjEyNWVtO21hcmdpbi1sZWZ0OmF1dG87bWFyZ2luLXJpZ2h0OmF1dG87Zm9udC1zaXplOmluaGVyaXQ7b3ZlcmZsb3c6dmlzaWJsZTtwb3NpdGlvbjpyZWxhdGl2ZTsiPjxjaXJjbGUgZmlsbD0iI0ZFQ0UwMCIgY3g9IjUwMCIgY3k9IjUwMCIgcj0iNTAwIi8+PHBhdGggZmlsbD0iIzIyMUUyMCIgZD0iTTU3Ny4wMjYgNzYzLjk4N1YyMzQuMDIyaC05Mi4zNTJjLTIzLjkzOCAxOC43MTQtODEuMDE3IDU0LjAyNi0xNDIuNTY1IDgzLjI2NWwtMzIuMjg3IDE1LjE0NyAzNi4wMTQgODEuMDQyIDI3Ljk0Ni0xNC4zOGMxOS4zNzgtOS42MTEgNzIuNjE3LTM3LjM1NyA5MC42OC01MS43djQxNi41OTFoMTEyLjU2NCIvPjwvc3ZnPg==" style="height: 2em;vertical-align: middle;"> <img src="https://posit-dev.github.io/great-tables/blog/rendering-images/data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHJvbGU9ImltZyIgdmlld0JveD0iMCAwIDEwNTAgMTA1MCIgc3R5bGU9ImhlaWdodDoxZW07d2lkdGg6MS4xM2VtO3ZlcnRpY2FsLWFsaWduOi0wLjEyNWVtO21hcmdpbi1sZWZ0OmF1dG87bWFyZ2luLXJpZ2h0OmF1dG87Zm9udC1zaXplOmluaGVyaXQ7b3ZlcmZsb3c6dmlzaWJsZTtwb3NpdGlvbjpyZWxhdGl2ZTsiPjxjaXJjbGUgZmlsbD0iIzAwNjVBRSIgY3g9IjUwMCIgY3k9IjUwMCIgcj0iNTAwIi8+PHBhdGggZmlsbD0iI2ZmZiIgZD0iTTY3Ni40NCA3NDAuOTV2LTg4LjcwOUg0NTcuNzZjNi44ODgtMzAuNzEzIDYwLjEzMy03NS4wMzUgODcuMDg0LTk5Ljc1IDYzLjg1NS01Ny45OTcgMTIxLjYyLTk5LjE4OCAxMjEuNjItMTkwLjAxIDAtMTA4LjA1LTg3LjY3OC0xNjAuNjEtMTgwLjc2LTE2MC42MS03MS4zNjYgMC0xMTguNjIgMjAuOTkxLTE2OS43MiA2NS4zNzlsNTUuNzE3IDczLjU4NWMxMi42NTItMTQuMzM1IDQ0Ljk3NS00OC4xMTIgOTEuNDM0LTQ4LjExMiA1Ny43NiAwIDg3Ljc0MiAzNi43NzYgODcuNzQyIDgyLjQ4MiAwIDUxLjIwOS0zOC4wMjMgODcuODU0LTczLjM0NCAxMTguNjMtNzAuNzA5IDYxLjU5LTEzMS40NyAxMTUuNTctMTQ0Ljk0IDE3Ny4yOXY2OS44NjFoMzQzLjg1MSIvPjwvc3ZnPg==" style="height: 2em;vertical-align: middle;"> <img src="https://posit-dev.github.io/great-tables/blog/rendering-images/data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHJvbGU9ImltZyIgdmlld0JveD0iMCAwIDEwNTAgMTA1MCIgc3R5bGU9ImhlaWdodDoxZW07d2lkdGg6MS4xM2VtO3ZlcnRpY2FsLWFsaWduOi0wLjEyNWVtO21hcmdpbi1sZWZ0OmF1dG87bWFyZ2luLXJpZ2h0OmF1dG87Zm9udC1zaXplOmluaGVyaXQ7b3ZlcmZsb3c6dmlzaWJsZTtwb3NpdGlvbjpyZWxhdGl2ZTsiPjxjaXJjbGUgZmlsbD0iIzg0QzI4RSIgY3g9IjUwMCIgY3k9IjUwMCIgcj0iNTAwIi8+PHBhdGggZmlsbD0iIzIzMUYyMCIgZD0iTTY3Mi4xNiA1NzAuNTZjMC05OS4zMDUtNzAuNTE5LTE1Ny4wMS0xNTcuMTEtMTU3LjAxLTU1Ljk0NyAwLTg5Ljg4NyAyMC4yODctMTA3Ljc5IDM2LjA2OCA2LjY5OS0xMDYuNTIxIDYxLjQzOC0xNTkuODcgMTM0LjQxLTE1OS44NyAyOS43NjggMCA1Ni45NzMgNi43MDEgNzEuMDMxIDEyLjg5MWwxNi42Ni05MC4xMTVjLTIxLjcxMy01LjQxNy00OC45MTYtOC45MzQtNzguODMtOC45MzQtMTY2LjU5IDAtMjUxLjM2IDEyNS44OTEtMjUxLjM2IDMwOS44OTEgMCAxNDAuMzUgNTAuODk1IDI0MC4zMSAxOTMuNTggMjQwLjMxIDEwOC44OS0uMDAxIDE3OS40MS03Ny41NjEgMTc5LjQwOS0xODMuMjMxbS0xMDUuODA5IDExLjI4YzAgNDUuNjI1LTI2LjI1NCA4OC40My03Ny40MDEgODguNDMtNTIuNTc4IDAtODAuOTUzLTQ4Ljc3Mi04MC45NTMtOTkuMTIgMC0xNS42MzggMC0zNS45NTkgNi4wMDQtNDQuOTY4IDEwLjQ3MS0xNi41ODYgMzYuNzk3LTI5LjE4NCA2OS4wNTUtMjkuMTg0IDUwLjkyIDAgODMuMjkgMzUuMTkgODMuMjkgODQuODRsLjAwNS4wMDJ6Ii8+PC9zdmc+" style="height: 2em;vertical-align: middle;"></span></td>
  </tr>
</tbody>


</table>

</div>
</div>
</div>
</section>
<section id="case-2-full-httphttps-urls" class="level3">
<h3 class="anchored" data-anchor-id="case-2-full-httphttps-urls">Case 2: Full HTTP/HTTPS URLs</h3>
<p><strong>Case 2</strong> demonstrates how to simulate a column containing strings representing HTTP/HTTPS URLs. We’ll use the same images as in <strong>Case 1</strong>, but this time, retrieve them from the Great Tables GitHub repository:</p>
<div id="b84b0f21" class="cell" data-execution_count="6">
<div class="code-copy-outer-scaffold"><div class="sourceCode cell-code" id="cb6" style="background: #f1f3f5;"><pre class="sourceCode python code-with-copy"><code class="sourceCode python"><span id="cb6-1">img_url_paths <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"https://raw.githubusercontent.com/posit-dev/great-tables/refs/heads/main/great_tables/data/metro_images"</span></span></code></pre></div></div>
</div>
<p>Below is a <code>Pandas</code> DataFrame called <code>metro_mini2</code>, where the <code>case2</code> column contains full HTTP/HTTPS URLs that we aim to render as images.</p>
<div id="ac7ba522" class="cell" data-execution_count="7">
<details class="code-fold">
<summary>Show the Code</summary>
<div class="code-copy-outer-scaffold"><div class="sourceCode cell-code" id="cb7" style="background: #f1f3f5;"><pre class="sourceCode python code-with-copy"><code class="sourceCode python"><span id="cb7-1">metro_mini2 <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> pd.DataFrame(</span>
<span id="cb7-2">    {</span>
<span id="cb7-3">        <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">**</span>data,</span>
<span id="cb7-4">        <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"case2"</span>: [</span>
<span id="cb7-5">            <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">", "</span>.join(<span class="ss" style="color: #20794D;
background-color: null;
font-style: inherit;">f"</span><span class="sc" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">{</span>img_url_paths<span class="sc" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">}</span><span class="ss" style="color: #20794D;
background-color: null;
font-style: inherit;">/metro_</span><span class="sc" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">{</span>item<span class="sc" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">}</span><span class="ss" style="color: #20794D;
background-color: null;
font-style: inherit;">.svg"</span> <span class="cf" style="color: #003B4F;
background-color: null;
font-weight: bold;
font-style: inherit;">for</span> item <span class="kw" style="color: #003B4F;
background-color: null;
font-weight: bold;
font-style: inherit;">in</span> row.split(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">", "</span>))</span>
<span id="cb7-6">            <span class="cf" style="color: #003B4F;
background-color: null;
font-weight: bold;
font-style: inherit;">for</span> row <span class="kw" style="color: #003B4F;
background-color: null;
font-weight: bold;
font-style: inherit;">in</span> data[<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"lines"</span>]</span>
<span id="cb7-7">        ],</span>
<span id="cb7-8">    }</span>
<span id="cb7-9">)</span>
<span id="cb7-10">metro_mini2</span></code></pre></div></div>
</details>
<div class="cell-output cell-output-display" data-execution_count="6">
<div>

<table class="dataframe table table-sm table-striped small">
  <thead>
    <tr>
      <th></th>
      <th>name</th>
      <th>lines</th>
      <th>case2</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <th>0</th>
      <td>Argentine</td>
      <td>1</td>
      <td>https://raw.githubusercontent.com/posit-dev/great-tables/refs/heads/main/great_tables/data/metro_images/metro_1.svg</td>
    </tr>
    <tr>
      <th>1</th>
      <td>Bastille</td>
      <td>1, 5, 8</td>
      <td>https://raw.githubusercontent.com/posit-dev/great-tables/refs/heads/main/great_tables/data/metro_images/metro_1.svg, https://raw.githubusercontent...</td>
    </tr>
    <tr>
      <th>2</th>
      <td>Bérault</td>
      <td>1</td>
      <td>https://raw.githubusercontent.com/posit-dev/great-tables/refs/heads/main/great_tables/data/metro_images/metro_1.svg</td>
    </tr>
    <tr>
      <th>3</th>
      <td>Champs-Élysées—Clemenceau</td>
      <td>1, 13</td>
      <td>https://raw.githubusercontent.com/posit-dev/great-tables/refs/heads/main/great_tables/data/metro_images/metro_1.svg, https://raw.githubusercontent...</td>
    </tr>
    <tr>
      <th>4</th>
      <td>Charles de Gaulle—Étoile</td>
      <td>1, 2, 6</td>
      <td>https://raw.githubusercontent.com/posit-dev/great-tables/refs/heads/main/great_tables/data/metro_images/metro_1.svg, https://raw.githubusercontent...</td>
    </tr>
  </tbody>
</table>
</div>
</div>
</div>
<p>The lengthy <code>case2</code> column issue can also be addressed using the trick shared in <strong>Case 3</strong>.</p>
<p>Similarly, we can use <a href="../../reference/GT.fmt_image.html#great_tables.GT.fmt_image" title="0"><code>GT.fmt_image()</code></a> to render images by passing <code>"case2"</code> as the first argument:</p>
<div id="aeeb6eb6" class="cell" data-execution_count="8">
<div class="code-copy-outer-scaffold"><div class="sourceCode cell-code" id="cb8" style="background: #f1f3f5;"><pre class="sourceCode python code-with-copy"><code class="sourceCode python"><span id="cb8-1">GT(metro_mini2).fmt_image(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"case2"</span>).cols_align(align<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"right"</span>, columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"case2"</span>)</span></code></pre></div></div>
<div class="cell-output cell-output-display" data-execution_count="7">
<div id="wtxeclcsys" style="padding-left:0px;padding-right:0px;padding-top:10px;padding-bottom:10px;overflow-x:auto;overflow-y:auto;width:auto;height:auto;">
<style>
#wtxeclcsys table {
          font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Helvetica Neue', 'Fira Sans', 'Droid Sans', Arial, sans-serif;
          -webkit-font-smoothing: antialiased;
          -moz-osx-font-smoothing: grayscale;
        }

#wtxeclcsys thead, tbody, tfoot, tr, td, th { border-style: none; }
 tr { background-color: transparent; }
#wtxeclcsys p { margin: 0; padding: 0; }
 #wtxeclcsys .gt_table { display: table; border-collapse: collapse; line-height: normal; margin-left: auto; margin-right: auto; color: #333333; font-size: 16px; font-weight: normal; font-style: normal; background-color: #FFFFFF; width: auto; border-top-style: solid; border-top-width: 2px; border-top-color: #A8A8A8; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #A8A8A8; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; }
 #wtxeclcsys .gt_caption { padding-top: 4px; padding-bottom: 4px; }
 #wtxeclcsys .gt_title { color: #333333; font-size: 125%; font-weight: initial; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; border-bottom-color: #FFFFFF; border-bottom-width: 0; }
 #wtxeclcsys .gt_subtitle { color: #333333; font-size: 85%; font-weight: initial; padding-top: 3px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; border-top-color: #FFFFFF; border-top-width: 0; }
 #wtxeclcsys .gt_heading { background-color: #FFFFFF; text-align: center; border-bottom-color: #FFFFFF; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #wtxeclcsys .gt_bottom_border { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #wtxeclcsys .gt_col_headings { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #wtxeclcsys .gt_col_heading { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; overflow-x: hidden; }
 #wtxeclcsys .gt_column_spanner_outer { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; padding-top: 0; padding-bottom: 0; padding-left: 4px; padding-right: 4px; }
 #wtxeclcsys .gt_column_spanner_outer:first-child { padding-left: 0; }
 #wtxeclcsys .gt_column_spanner_outer:last-child { padding-right: 0; }
 #wtxeclcsys .gt_column_spanner { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; overflow-x: hidden; display: inline-block; width: 100%; }
 #wtxeclcsys .gt_spanner_row { border-bottom-style: hidden; }
 #wtxeclcsys .gt_group_heading { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; text-align: left; }
 #wtxeclcsys .gt_empty_group_heading { padding: 0.5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: middle; }
 #wtxeclcsys .gt_from_md> :first-child { margin-top: 0; }
 #wtxeclcsys .gt_from_md> :last-child { margin-bottom: 0; }
 #wtxeclcsys .gt_row { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; margin: 10px; border-top-style: solid; border-top-width: 1px; border-top-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; overflow-x: hidden; }
 #wtxeclcsys .gt_stub { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; }
 #wtxeclcsys .gt_stub_row_group { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; vertical-align: top; }
 #wtxeclcsys .gt_row_group_first td { border-top-width: 2px; }
 #wtxeclcsys .gt_row_group_first th { border-top-width: 2px; }
 #wtxeclcsys .gt_striped { color: #333333; background-color: #F4F4F4; }
 #wtxeclcsys .gt_table_body { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #wtxeclcsys .gt_grand_summary_row { color: #333333; background-color: #FFFFFF; text-transform: inherit; padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; }
 #wtxeclcsys .gt_first_grand_summary_row_bottom { border-top-style: double; border-top-width: 6px; border-top-color: #D3D3D3; }
 #wtxeclcsys .gt_last_grand_summary_row_top { border-bottom-style: double; border-bottom-width: 6px; border-bottom-color: #D3D3D3; }
 #wtxeclcsys .gt_sourcenotes { color: #333333; background-color: #FFFFFF; border-bottom-style: none; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; }
 #wtxeclcsys .gt_sourcenote { font-size: 90%; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; text-align: left; }
 #wtxeclcsys .gt_left { text-align: left; }
 #wtxeclcsys .gt_center { text-align: center; }
 #wtxeclcsys .gt_right { text-align: right; font-variant-numeric: tabular-nums; }
 #wtxeclcsys .gt_font_normal { font-weight: normal; }
 #wtxeclcsys .gt_font_bold { font-weight: bold; }
 #wtxeclcsys .gt_font_italic { font-style: italic; }
 #wtxeclcsys .gt_super { font-size: 65%; }
 #wtxeclcsys .gt_footnote_marks { font-size: 75%; vertical-align: 0.4em; position: initial; }
 #wtxeclcsys .gt_asterisk { font-size: 100%; vertical-align: 0; }
 
</style>
<table class="gt_table" data-quarto-disable-processing="false" data-quarto-bootstrap="false">
<thead>

<tr class="gt_col_headings">
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="1" colspan="1" scope="col" id="name">name</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="lines">lines</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="case2">case2</th>
</tr>
</thead>
<tbody class="gt_table_body">
  <tr>
    <td class="gt_row gt_left">Argentine</td>
    <td class="gt_row gt_right">1</td>
    <td class="gt_row gt_right"><span style="white-space:nowrap;"><img src="https://raw.githubusercontent.com/posit-dev/great-tables/refs/heads/main/great_tables/data/metro_images/metro_1.svg" style="height: 2em;vertical-align: middle;"></span></td>
  </tr>
  <tr>
    <td class="gt_row gt_left">Bastille</td>
    <td class="gt_row gt_right">1, 5, 8</td>
    <td class="gt_row gt_right"><span style="white-space:nowrap;"><img src="https://raw.githubusercontent.com/posit-dev/great-tables/refs/heads/main/great_tables/data/metro_images/metro_1.svg" style="height: 2em;vertical-align: middle;"> <img src="https://raw.githubusercontent.com/posit-dev/great-tables/refs/heads/main/great_tables/data/metro_images/metro_5.svg" style="height: 2em;vertical-align: middle;"> <img src="https://raw.githubusercontent.com/posit-dev/great-tables/refs/heads/main/great_tables/data/metro_images/metro_8.svg" style="height: 2em;vertical-align: middle;"></span></td>
  </tr>
  <tr>
    <td class="gt_row gt_left">Bérault</td>
    <td class="gt_row gt_right">1</td>
    <td class="gt_row gt_right"><span style="white-space:nowrap;"><img src="https://raw.githubusercontent.com/posit-dev/great-tables/refs/heads/main/great_tables/data/metro_images/metro_1.svg" style="height: 2em;vertical-align: middle;"></span></td>
  </tr>
  <tr>
    <td class="gt_row gt_left">Champs-Élysées—Clemenceau</td>
    <td class="gt_row gt_right">1, 13</td>
    <td class="gt_row gt_right"><span style="white-space:nowrap;"><img src="https://raw.githubusercontent.com/posit-dev/great-tables/refs/heads/main/great_tables/data/metro_images/metro_1.svg" style="height: 2em;vertical-align: middle;"> <img src="https://raw.githubusercontent.com/posit-dev/great-tables/refs/heads/main/great_tables/data/metro_images/metro_13.svg" style="height: 2em;vertical-align: middle;"></span></td>
  </tr>
  <tr>
    <td class="gt_row gt_left">Charles de Gaulle—Étoile</td>
    <td class="gt_row gt_right">1, 2, 6</td>
    <td class="gt_row gt_right"><span style="white-space:nowrap;"><img src="https://raw.githubusercontent.com/posit-dev/great-tables/refs/heads/main/great_tables/data/metro_images/metro_1.svg" style="height: 2em;vertical-align: middle;"> <img src="https://raw.githubusercontent.com/posit-dev/great-tables/refs/heads/main/great_tables/data/metro_images/metro_2.svg" style="height: 2em;vertical-align: middle;"> <img src="https://raw.githubusercontent.com/posit-dev/great-tables/refs/heads/main/great_tables/data/metro_images/metro_6.svg" style="height: 2em;vertical-align: middle;"></span></td>
  </tr>
</tbody>


</table>

</div>
</div>
</div>
</section>
<section id="case-3-image-names-with-the-path-argument" class="level3">
<h3 class="anchored" data-anchor-id="case-3-image-names-with-the-path-argument">Case 3: Image Names with the <code>path=</code> Argument</h3>
<p><strong>Case 3</strong> demonstrates how to use the <code>path=</code> argument to specify images relative to a base directory or URL. This approach eliminates much of the repetition in file names, offering a solution to the issues in <strong>Case 1</strong> and <strong>Case 2</strong>.</p>
<p>Below is a <code>Pandas</code> DataFrame called <code>metro_mini3</code>, where the <code>case3</code> column contains file names that we aim to render as images.</p>
<div id="76ab1603" class="cell" data-execution_count="9">
<details class="code-fold">
<summary>Show the Code</summary>
<div class="code-copy-outer-scaffold"><div class="sourceCode cell-code" id="cb9" style="background: #f1f3f5;"><pre class="sourceCode python code-with-copy"><code class="sourceCode python"><span id="cb9-1">metro_mini3 <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> pd.DataFrame(</span>
<span id="cb9-2">    {</span>
<span id="cb9-3">        <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">**</span>data,</span>
<span id="cb9-4">        <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"case3"</span>: [</span>
<span id="cb9-5">            <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">", "</span>.join(<span class="ss" style="color: #20794D;
background-color: null;
font-style: inherit;">f"metro_</span><span class="sc" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">{</span>item<span class="sc" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">}</span><span class="ss" style="color: #20794D;
background-color: null;
font-style: inherit;">.svg"</span> <span class="cf" style="color: #003B4F;
background-color: null;
font-weight: bold;
font-style: inherit;">for</span> item <span class="kw" style="color: #003B4F;
background-color: null;
font-weight: bold;
font-style: inherit;">in</span> row.split(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">", "</span>)) <span class="cf" style="color: #003B4F;
background-color: null;
font-weight: bold;
font-style: inherit;">for</span> row <span class="kw" style="color: #003B4F;
background-color: null;
font-weight: bold;
font-style: inherit;">in</span> data[<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"lines"</span>]</span>
<span id="cb9-6">        ],</span>
<span id="cb9-7">    }</span>
<span id="cb9-8">)</span>
<span id="cb9-9">metro_mini3</span></code></pre></div></div>
</details>
<div class="cell-output cell-output-display" data-execution_count="8">
<div>

<table class="dataframe table table-sm table-striped small">
  <thead>
    <tr>
      <th></th>
      <th>name</th>
      <th>lines</th>
      <th>case3</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <th>0</th>
      <td>Argentine</td>
      <td>1</td>
      <td>metro_1.svg</td>
    </tr>
    <tr>
      <th>1</th>
      <td>Bastille</td>
      <td>1, 5, 8</td>
      <td>metro_1.svg, metro_5.svg, metro_8.svg</td>
    </tr>
    <tr>
      <th>2</th>
      <td>Bérault</td>
      <td>1</td>
      <td>metro_1.svg</td>
    </tr>
    <tr>
      <th>3</th>
      <td>Champs-Élysées—Clemenceau</td>
      <td>1, 13</td>
      <td>metro_1.svg, metro_13.svg</td>
    </tr>
    <tr>
      <th>4</th>
      <td>Charles de Gaulle—Étoile</td>
      <td>1, 2, 6</td>
      <td>metro_1.svg, metro_2.svg, metro_6.svg</td>
    </tr>
  </tbody>
</table>
</div>
</div>
</div>
<p>Now we can use <a href="../../reference/GT.fmt_image.html#great_tables.GT.fmt_image" title="0"><code>GT.fmt_image()</code></a> to render the images by passing <code>"case3"</code> as the first argument and specifying either <code>img_local_paths</code> or <code>img_url_paths</code> as the <code>path=</code> argument:</p>
<div id="ecedba3e" class="cell" data-execution_count="10">
<div class="code-copy-outer-scaffold"><div class="sourceCode cell-code" id="cb10" style="background: #f1f3f5;"><pre class="sourceCode python code-with-copy"><code class="sourceCode python"><span id="cb10-1"><span class="co" style="color: #5E5E5E;
background-color: null;
font-style: inherit;"># equivalent to `Case 1`</span></span>
<span id="cb10-2">(</span>
<span id="cb10-3">    GT(metro_mini3)</span>
<span id="cb10-4">    .fmt_image(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"case3"</span>, path<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>img_local_paths)</span>
<span id="cb10-5">    .cols_align(align<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"right"</span>, columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"case3"</span>)</span>
<span id="cb10-6">)</span>
<span id="cb10-7"></span>
<span id="cb10-8"><span class="co" style="color: #5E5E5E;
background-color: null;
font-style: inherit;"># equivalent to `Case 2`</span></span>
<span id="cb10-9">(</span>
<span id="cb10-10">    GT(metro_mini3)</span>
<span id="cb10-11">    .fmt_image(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"case3"</span>, path<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>img_url_paths)</span>
<span id="cb10-12">    .cols_align(align<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"right"</span>, columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"case3"</span>)</span>
<span id="cb10-13">)</span></code></pre></div></div>
<div class="cell-output cell-output-display" data-execution_count="9">
<div id="ktokdtbtol" style="padding-left:0px;padding-right:0px;padding-top:10px;padding-bottom:10px;overflow-x:auto;overflow-y:auto;width:auto;height:auto;">
<style>
#ktokdtbtol table {
          font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Helvetica Neue', 'Fira Sans', 'Droid Sans', Arial, sans-serif;
          -webkit-font-smoothing: antialiased;
          -moz-osx-font-smoothing: grayscale;
        }

#ktokdtbtol thead, tbody, tfoot, tr, td, th { border-style: none; }
 tr { background-color: transparent; }
#ktokdtbtol p { margin: 0; padding: 0; }
 #ktokdtbtol .gt_table { display: table; border-collapse: collapse; line-height: normal; margin-left: auto; margin-right: auto; color: #333333; font-size: 16px; font-weight: normal; font-style: normal; background-color: #FFFFFF; width: auto; border-top-style: solid; border-top-width: 2px; border-top-color: #A8A8A8; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #A8A8A8; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; }
 #ktokdtbtol .gt_caption { padding-top: 4px; padding-bottom: 4px; }
 #ktokdtbtol .gt_title { color: #333333; font-size: 125%; font-weight: initial; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; border-bottom-color: #FFFFFF; border-bottom-width: 0; }
 #ktokdtbtol .gt_subtitle { color: #333333; font-size: 85%; font-weight: initial; padding-top: 3px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; border-top-color: #FFFFFF; border-top-width: 0; }
 #ktokdtbtol .gt_heading { background-color: #FFFFFF; text-align: center; border-bottom-color: #FFFFFF; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #ktokdtbtol .gt_bottom_border { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #ktokdtbtol .gt_col_headings { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #ktokdtbtol .gt_col_heading { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; overflow-x: hidden; }
 #ktokdtbtol .gt_column_spanner_outer { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; padding-top: 0; padding-bottom: 0; padding-left: 4px; padding-right: 4px; }
 #ktokdtbtol .gt_column_spanner_outer:first-child { padding-left: 0; }
 #ktokdtbtol .gt_column_spanner_outer:last-child { padding-right: 0; }
 #ktokdtbtol .gt_column_spanner { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; overflow-x: hidden; display: inline-block; width: 100%; }
 #ktokdtbtol .gt_spanner_row { border-bottom-style: hidden; }
 #ktokdtbtol .gt_group_heading { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; text-align: left; }
 #ktokdtbtol .gt_empty_group_heading { padding: 0.5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: middle; }
 #ktokdtbtol .gt_from_md> :first-child { margin-top: 0; }
 #ktokdtbtol .gt_from_md> :last-child { margin-bottom: 0; }
 #ktokdtbtol .gt_row { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; margin: 10px; border-top-style: solid; border-top-width: 1px; border-top-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; overflow-x: hidden; }
 #ktokdtbtol .gt_stub { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; }
 #ktokdtbtol .gt_stub_row_group { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; vertical-align: top; }
 #ktokdtbtol .gt_row_group_first td { border-top-width: 2px; }
 #ktokdtbtol .gt_row_group_first th { border-top-width: 2px; }
 #ktokdtbtol .gt_striped { color: #333333; background-color: #F4F4F4; }
 #ktokdtbtol .gt_table_body { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #ktokdtbtol .gt_grand_summary_row { color: #333333; background-color: #FFFFFF; text-transform: inherit; padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; }
 #ktokdtbtol .gt_first_grand_summary_row_bottom { border-top-style: double; border-top-width: 6px; border-top-color: #D3D3D3; }
 #ktokdtbtol .gt_last_grand_summary_row_top { border-bottom-style: double; border-bottom-width: 6px; border-bottom-color: #D3D3D3; }
 #ktokdtbtol .gt_sourcenotes { color: #333333; background-color: #FFFFFF; border-bottom-style: none; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; }
 #ktokdtbtol .gt_sourcenote { font-size: 90%; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; text-align: left; }
 #ktokdtbtol .gt_left { text-align: left; }
 #ktokdtbtol .gt_center { text-align: center; }
 #ktokdtbtol .gt_right { text-align: right; font-variant-numeric: tabular-nums; }
 #ktokdtbtol .gt_font_normal { font-weight: normal; }
 #ktokdtbtol .gt_font_bold { font-weight: bold; }
 #ktokdtbtol .gt_font_italic { font-style: italic; }
 #ktokdtbtol .gt_super { font-size: 65%; }
 #ktokdtbtol .gt_footnote_marks { font-size: 75%; vertical-align: 0.4em; position: initial; }
 #ktokdtbtol .gt_asterisk { font-size: 100%; vertical-align: 0; }
 
</style>
<table class="gt_table" data-quarto-disable-processing="false" data-quarto-bootstrap="false">
<thead>

<tr class="gt_col_headings">
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="1" colspan="1" scope="col" id="name">name</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="lines">lines</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="case3">case3</th>
</tr>
</thead>
<tbody class="gt_table_body">
  <tr>
    <td class="gt_row gt_left">Argentine</td>
    <td class="gt_row gt_right">1</td>
    <td class="gt_row gt_right"><span style="white-space:nowrap;"><img src="https://raw.githubusercontent.com/posit-dev/great-tables/refs/heads/main/great_tables/data/metro_images/metro_1.svg" style="height: 2em;vertical-align: middle;"></span></td>
  </tr>
  <tr>
    <td class="gt_row gt_left">Bastille</td>
    <td class="gt_row gt_right">1, 5, 8</td>
    <td class="gt_row gt_right"><span style="white-space:nowrap;"><img src="https://raw.githubusercontent.com/posit-dev/great-tables/refs/heads/main/great_tables/data/metro_images/metro_1.svg" style="height: 2em;vertical-align: middle;"> <img src="https://raw.githubusercontent.com/posit-dev/great-tables/refs/heads/main/great_tables/data/metro_images/metro_5.svg" style="height: 2em;vertical-align: middle;"> <img src="https://raw.githubusercontent.com/posit-dev/great-tables/refs/heads/main/great_tables/data/metro_images/metro_8.svg" style="height: 2em;vertical-align: middle;"></span></td>
  </tr>
  <tr>
    <td class="gt_row gt_left">Bérault</td>
    <td class="gt_row gt_right">1</td>
    <td class="gt_row gt_right"><span style="white-space:nowrap;"><img src="https://raw.githubusercontent.com/posit-dev/great-tables/refs/heads/main/great_tables/data/metro_images/metro_1.svg" style="height: 2em;vertical-align: middle;"></span></td>
  </tr>
  <tr>
    <td class="gt_row gt_left">Champs-Élysées—Clemenceau</td>
    <td class="gt_row gt_right">1, 13</td>
    <td class="gt_row gt_right"><span style="white-space:nowrap;"><img src="https://raw.githubusercontent.com/posit-dev/great-tables/refs/heads/main/great_tables/data/metro_images/metro_1.svg" style="height: 2em;vertical-align: middle;"> <img src="https://raw.githubusercontent.com/posit-dev/great-tables/refs/heads/main/great_tables/data/metro_images/metro_13.svg" style="height: 2em;vertical-align: middle;"></span></td>
  </tr>
  <tr>
    <td class="gt_row gt_left">Charles de Gaulle—Étoile</td>
    <td class="gt_row gt_right">1, 2, 6</td>
    <td class="gt_row gt_right"><span style="white-space:nowrap;"><img src="https://raw.githubusercontent.com/posit-dev/great-tables/refs/heads/main/great_tables/data/metro_images/metro_1.svg" style="height: 2em;vertical-align: middle;"> <img src="https://raw.githubusercontent.com/posit-dev/great-tables/refs/heads/main/great_tables/data/metro_images/metro_2.svg" style="height: 2em;vertical-align: middle;"> <img src="https://raw.githubusercontent.com/posit-dev/great-tables/refs/heads/main/great_tables/data/metro_images/metro_6.svg" style="height: 2em;vertical-align: middle;"></span></td>
  </tr>
</tbody>


</table>

</div>
</div>
</div>
<p>After exploring <strong>Case 1</strong> and <strong>Case 2</strong>, you’ll likely appreciate the functionality of the <code>path=</code> argument. However, manually constructing file names can still be a bit tedious. If your file names follow a consistent pattern, the <code>file_pattern=</code> argument can simplify the process. Let’s see how this works in <strong>Case 4</strong> below.</p>
</section>
<section id="case-4-image-names-using-both-the-path-and-file_pattern-arguments" class="level3">
<h3 class="anchored" data-anchor-id="case-4-image-names-using-both-the-path-and-file_pattern-arguments">Case 4: Image Names Using Both the <code>path=</code> and <code>file_pattern=</code> Arguments</h3>
<p><strong>Case 4</strong> demonstrates how to use <code>path=</code> and <code>file_pattern=</code> to specify images with names following a common pattern. For example, you could use <code>file_pattern="metro_{}.svg"</code> to reference images like <code>metro_1.svg</code>, <code>metro_2.svg</code>, and so on.</p>
<p>Below is a <code>Pandas</code> DataFrame called <code>metro_mini4</code>, where the <code>case4</code> column contains a copy of <code>data["lines"]</code>, which we aim to render as images.</p>
<div id="02d32063" class="cell" data-execution_count="11">
<details class="code-fold">
<summary>Show the Code</summary>
<div class="code-copy-outer-scaffold"><div class="sourceCode cell-code" id="cb11" style="background: #f1f3f5;"><pre class="sourceCode python code-with-copy"><code class="sourceCode python"><span id="cb11-1">metro_mini4 <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> pd.DataFrame({<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">**</span>data, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"case4"</span>: data[<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"lines"</span>]})</span>
<span id="cb11-2">metro_mini4</span></code></pre></div></div>
</details>
<div class="cell-output cell-output-display" data-execution_count="10">
<div>

<table class="dataframe table table-sm table-striped small">
  <thead>
    <tr>
      <th></th>
      <th>name</th>
      <th>lines</th>
      <th>case4</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <th>0</th>
      <td>Argentine</td>
      <td>1</td>
      <td>1</td>
    </tr>
    <tr>
      <th>1</th>
      <td>Bastille</td>
      <td>1, 5, 8</td>
      <td>1, 5, 8</td>
    </tr>
    <tr>
      <th>2</th>
      <td>Bérault</td>
      <td>1</td>
      <td>1</td>
    </tr>
    <tr>
      <th>3</th>
      <td>Champs-Élysées—Clemenceau</td>
      <td>1, 13</td>
      <td>1, 13</td>
    </tr>
    <tr>
      <th>4</th>
      <td>Charles de Gaulle—Étoile</td>
      <td>1, 2, 6</td>
      <td>1, 2, 6</td>
    </tr>
  </tbody>
</table>
</div>
</div>
</div>
<p>First, define a string pattern to illustrate the file naming convention, using <code>{}</code> to indicate the variable portion:</p>
<div id="e0a9eaac" class="cell" data-execution_count="12">
<div class="code-copy-outer-scaffold"><div class="sourceCode cell-code" id="cb12" style="background: #f1f3f5;"><pre class="sourceCode python code-with-copy"><code class="sourceCode python"><span id="cb12-1">file_pattern <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"metro_</span><span class="sc" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">{}</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">.svg"</span></span></code></pre></div></div>
</div>
<p>Next, pass <code>"case4"</code> as the first argument, along with <code>img_local_paths</code> or <code>img_url_paths</code> as the <code>path=</code> argument, and <code>file_pattern</code> as the <code>file_pattern=</code> argument. This allows <a href="../../reference/GT.fmt_image.html#great_tables.GT.fmt_image" title="0"><code>GT.fmt_image()</code></a> to render the images:</p>
<div id="d08ecb5b" class="cell" data-execution_count="13">
<div class="code-copy-outer-scaffold"><div class="sourceCode cell-code" id="cb13" style="background: #f1f3f5;"><pre class="sourceCode python code-with-copy"><code class="sourceCode python"><span id="cb13-1"><span class="co" style="color: #5E5E5E;
background-color: null;
font-style: inherit;"># equivalent to `Case 1`</span></span>
<span id="cb13-2">(</span>
<span id="cb13-3">    GT(metro_mini4)</span>
<span id="cb13-4">    .fmt_image(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"case4"</span>, path<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>img_local_paths, file_pattern<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>file_pattern)</span>
<span id="cb13-5">    .cols_align(align<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"right"</span>, columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"case4"</span>)</span>
<span id="cb13-6">)</span>
<span id="cb13-7"></span>
<span id="cb13-8"><span class="co" style="color: #5E5E5E;
background-color: null;
font-style: inherit;"># equivalent to `Case 2`</span></span>
<span id="cb13-9">(</span>
<span id="cb13-10">    GT(metro_mini4)</span>
<span id="cb13-11">    .fmt_image(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"case4"</span>, path<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>img_url_paths, file_pattern<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>file_pattern)</span>
<span id="cb13-12">    .cols_align(align<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"right"</span>, columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"case4"</span>)</span>
<span id="cb13-13">)</span></code></pre></div></div>
<div class="cell-output cell-output-display" data-execution_count="12">
<div id="scxwmvwfes" style="padding-left:0px;padding-right:0px;padding-top:10px;padding-bottom:10px;overflow-x:auto;overflow-y:auto;width:auto;height:auto;">
<style>
#scxwmvwfes table {
          font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Helvetica Neue', 'Fira Sans', 'Droid Sans', Arial, sans-serif;
          -webkit-font-smoothing: antialiased;
          -moz-osx-font-smoothing: grayscale;
        }

#scxwmvwfes thead, tbody, tfoot, tr, td, th { border-style: none; }
 tr { background-color: transparent; }
#scxwmvwfes p { margin: 0; padding: 0; }
 #scxwmvwfes .gt_table { display: table; border-collapse: collapse; line-height: normal; margin-left: auto; margin-right: auto; color: #333333; font-size: 16px; font-weight: normal; font-style: normal; background-color: #FFFFFF; width: auto; border-top-style: solid; border-top-width: 2px; border-top-color: #A8A8A8; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #A8A8A8; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; }
 #scxwmvwfes .gt_caption { padding-top: 4px; padding-bottom: 4px; }
 #scxwmvwfes .gt_title { color: #333333; font-size: 125%; font-weight: initial; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; border-bottom-color: #FFFFFF; border-bottom-width: 0; }
 #scxwmvwfes .gt_subtitle { color: #333333; font-size: 85%; font-weight: initial; padding-top: 3px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; border-top-color: #FFFFFF; border-top-width: 0; }
 #scxwmvwfes .gt_heading { background-color: #FFFFFF; text-align: center; border-bottom-color: #FFFFFF; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #scxwmvwfes .gt_bottom_border { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #scxwmvwfes .gt_col_headings { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #scxwmvwfes .gt_col_heading { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; overflow-x: hidden; }
 #scxwmvwfes .gt_column_spanner_outer { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; padding-top: 0; padding-bottom: 0; padding-left: 4px; padding-right: 4px; }
 #scxwmvwfes .gt_column_spanner_outer:first-child { padding-left: 0; }
 #scxwmvwfes .gt_column_spanner_outer:last-child { padding-right: 0; }
 #scxwmvwfes .gt_column_spanner { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; overflow-x: hidden; display: inline-block; width: 100%; }
 #scxwmvwfes .gt_spanner_row { border-bottom-style: hidden; }
 #scxwmvwfes .gt_group_heading { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; text-align: left; }
 #scxwmvwfes .gt_empty_group_heading { padding: 0.5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: middle; }
 #scxwmvwfes .gt_from_md> :first-child { margin-top: 0; }
 #scxwmvwfes .gt_from_md> :last-child { margin-bottom: 0; }
 #scxwmvwfes .gt_row { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; margin: 10px; border-top-style: solid; border-top-width: 1px; border-top-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; overflow-x: hidden; }
 #scxwmvwfes .gt_stub { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; }
 #scxwmvwfes .gt_stub_row_group { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; vertical-align: top; }
 #scxwmvwfes .gt_row_group_first td { border-top-width: 2px; }
 #scxwmvwfes .gt_row_group_first th { border-top-width: 2px; }
 #scxwmvwfes .gt_striped { color: #333333; background-color: #F4F4F4; }
 #scxwmvwfes .gt_table_body { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #scxwmvwfes .gt_grand_summary_row { color: #333333; background-color: #FFFFFF; text-transform: inherit; padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; }
 #scxwmvwfes .gt_first_grand_summary_row_bottom { border-top-style: double; border-top-width: 6px; border-top-color: #D3D3D3; }
 #scxwmvwfes .gt_last_grand_summary_row_top { border-bottom-style: double; border-bottom-width: 6px; border-bottom-color: #D3D3D3; }
 #scxwmvwfes .gt_sourcenotes { color: #333333; background-color: #FFFFFF; border-bottom-style: none; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; }
 #scxwmvwfes .gt_sourcenote { font-size: 90%; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; text-align: left; }
 #scxwmvwfes .gt_left { text-align: left; }
 #scxwmvwfes .gt_center { text-align: center; }
 #scxwmvwfes .gt_right { text-align: right; font-variant-numeric: tabular-nums; }
 #scxwmvwfes .gt_font_normal { font-weight: normal; }
 #scxwmvwfes .gt_font_bold { font-weight: bold; }
 #scxwmvwfes .gt_font_italic { font-style: italic; }
 #scxwmvwfes .gt_super { font-size: 65%; }
 #scxwmvwfes .gt_footnote_marks { font-size: 75%; vertical-align: 0.4em; position: initial; }
 #scxwmvwfes .gt_asterisk { font-size: 100%; vertical-align: 0; }
 
</style>
<table class="gt_table" data-quarto-disable-processing="false" data-quarto-bootstrap="false">
<thead>

<tr class="gt_col_headings">
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="1" colspan="1" scope="col" id="name">name</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="lines">lines</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="case4">case4</th>
</tr>
</thead>
<tbody class="gt_table_body">
  <tr>
    <td class="gt_row gt_left">Argentine</td>
    <td class="gt_row gt_right">1</td>
    <td class="gt_row gt_right"><span style="white-space:nowrap;"><img src="https://raw.githubusercontent.com/posit-dev/great-tables/refs/heads/main/great_tables/data/metro_images/metro_1.svg" style="height: 2em;vertical-align: middle;"></span></td>
  </tr>
  <tr>
    <td class="gt_row gt_left">Bastille</td>
    <td class="gt_row gt_right">1, 5, 8</td>
    <td class="gt_row gt_right"><span style="white-space:nowrap;"><img src="https://raw.githubusercontent.com/posit-dev/great-tables/refs/heads/main/great_tables/data/metro_images/metro_1.svg" style="height: 2em;vertical-align: middle;"> <img src="https://raw.githubusercontent.com/posit-dev/great-tables/refs/heads/main/great_tables/data/metro_images/metro_5.svg" style="height: 2em;vertical-align: middle;"> <img src="https://raw.githubusercontent.com/posit-dev/great-tables/refs/heads/main/great_tables/data/metro_images/metro_8.svg" style="height: 2em;vertical-align: middle;"></span></td>
  </tr>
  <tr>
    <td class="gt_row gt_left">Bérault</td>
    <td class="gt_row gt_right">1</td>
    <td class="gt_row gt_right"><span style="white-space:nowrap;"><img src="https://raw.githubusercontent.com/posit-dev/great-tables/refs/heads/main/great_tables/data/metro_images/metro_1.svg" style="height: 2em;vertical-align: middle;"></span></td>
  </tr>
  <tr>
    <td class="gt_row gt_left">Champs-Élysées—Clemenceau</td>
    <td class="gt_row gt_right">1, 13</td>
    <td class="gt_row gt_right"><span style="white-space:nowrap;"><img src="https://raw.githubusercontent.com/posit-dev/great-tables/refs/heads/main/great_tables/data/metro_images/metro_1.svg" style="height: 2em;vertical-align: middle;"> <img src="https://raw.githubusercontent.com/posit-dev/great-tables/refs/heads/main/great_tables/data/metro_images/metro_13.svg" style="height: 2em;vertical-align: middle;"></span></td>
  </tr>
  <tr>
    <td class="gt_row gt_left">Charles de Gaulle—Étoile</td>
    <td class="gt_row gt_right">1, 2, 6</td>
    <td class="gt_row gt_right"><span style="white-space:nowrap;"><img src="https://raw.githubusercontent.com/posit-dev/great-tables/refs/heads/main/great_tables/data/metro_images/metro_1.svg" style="height: 2em;vertical-align: middle;"> <img src="https://raw.githubusercontent.com/posit-dev/great-tables/refs/heads/main/great_tables/data/metro_images/metro_2.svg" style="height: 2em;vertical-align: middle;"> <img src="https://raw.githubusercontent.com/posit-dev/great-tables/refs/heads/main/great_tables/data/metro_images/metro_6.svg" style="height: 2em;vertical-align: middle;"></span></td>
  </tr>
</tbody>


</table>

</div>
</div>
</div>
<div class="callout callout-style-default callout-warning callout-titled">
<div class="callout-header d-flex align-content-center collapsed" data-bs-toggle="collapse" data-bs-target=".callout-3-contents" aria-controls="callout-3" aria-expanded="false" aria-label="Toggle callout">
<div class="callout-icon-container">
<i class="callout-icon"></i>
</div>
<div class="callout-title-container flex-fill">
<span class="screen-reader-only">Warning</span>Using <code>file_pattern=</code> Independently
</div>
<div class="callout-btn-toggle d-inline-block border-0 py-1 ps-1 pe-0 float-end"><i class="callout-toggle"></i></div>
</div>
<div id="callout-3" class="callout-3-contents callout-collapse collapse">
<div class="callout-body-container callout-body">
<p>The <code>file_pattern=</code> argument is typically used in conjunction with the <code>path=</code> argument, but this is not a strict rule. If your local file paths or HTTP/HTTPS URLs follow a pattern, you can use <code>file_pattern=</code> alone without <code>path=</code>. This allows you to include the shared portion of the file paths or URLs directly in <code>file_pattern</code>, as shown below:</p>
<div id="16be3384" class="cell" data-execution_count="14">
<div class="code-copy-outer-scaffold"><div class="sourceCode cell-code" id="cb14" style="background: #f1f3f5;"><pre class="sourceCode python code-with-copy"><code class="sourceCode python"><span id="cb14-1">file_pattern <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> <span class="bu" style="color: null;
background-color: null;
font-style: inherit;">str</span>(img_local_paths <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">/</span> <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"metro_</span><span class="sc" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">{}</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">.svg"</span>)</span>
<span id="cb14-2">(</span>
<span id="cb14-3">    GT(metro_mini4)</span>
<span id="cb14-4">    .fmt_image(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"case4"</span>, file_pattern<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>file_pattern)</span>
<span id="cb14-5">    .cols_align(align<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"right"</span>, columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"case4"</span>)</span>
<span id="cb14-6">)</span></code></pre></div></div>
<div class="cell-output cell-output-display" data-execution_count="13">
<div id="feynrjmttl" style="padding-left:0px;padding-right:0px;padding-top:10px;padding-bottom:10px;overflow-x:auto;overflow-y:auto;width:auto;height:auto;">
<style>
#feynrjmttl table {
          font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Helvetica Neue', 'Fira Sans', 'Droid Sans', Arial, sans-serif;
          -webkit-font-smoothing: antialiased;
          -moz-osx-font-smoothing: grayscale;
        }

#feynrjmttl thead, tbody, tfoot, tr, td, th { border-style: none; }
 tr { background-color: transparent; }
#feynrjmttl p { margin: 0; padding: 0; }
 #feynrjmttl .gt_table { display: table; border-collapse: collapse; line-height: normal; margin-left: auto; margin-right: auto; color: #333333; font-size: 16px; font-weight: normal; font-style: normal; background-color: #FFFFFF; width: auto; border-top-style: solid; border-top-width: 2px; border-top-color: #A8A8A8; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #A8A8A8; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; }
 #feynrjmttl .gt_caption { padding-top: 4px; padding-bottom: 4px; }
 #feynrjmttl .gt_title { color: #333333; font-size: 125%; font-weight: initial; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; border-bottom-color: #FFFFFF; border-bottom-width: 0; }
 #feynrjmttl .gt_subtitle { color: #333333; font-size: 85%; font-weight: initial; padding-top: 3px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; border-top-color: #FFFFFF; border-top-width: 0; }
 #feynrjmttl .gt_heading { background-color: #FFFFFF; text-align: center; border-bottom-color: #FFFFFF; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #feynrjmttl .gt_bottom_border { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #feynrjmttl .gt_col_headings { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #feynrjmttl .gt_col_heading { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; overflow-x: hidden; }
 #feynrjmttl .gt_column_spanner_outer { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; padding-top: 0; padding-bottom: 0; padding-left: 4px; padding-right: 4px; }
 #feynrjmttl .gt_column_spanner_outer:first-child { padding-left: 0; }
 #feynrjmttl .gt_column_spanner_outer:last-child { padding-right: 0; }
 #feynrjmttl .gt_column_spanner { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; overflow-x: hidden; display: inline-block; width: 100%; }
 #feynrjmttl .gt_spanner_row { border-bottom-style: hidden; }
 #feynrjmttl .gt_group_heading { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; text-align: left; }
 #feynrjmttl .gt_empty_group_heading { padding: 0.5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: middle; }
 #feynrjmttl .gt_from_md> :first-child { margin-top: 0; }
 #feynrjmttl .gt_from_md> :last-child { margin-bottom: 0; }
 #feynrjmttl .gt_row { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; margin: 10px; border-top-style: solid; border-top-width: 1px; border-top-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; overflow-x: hidden; }
 #feynrjmttl .gt_stub { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; }
 #feynrjmttl .gt_stub_row_group { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; vertical-align: top; }
 #feynrjmttl .gt_row_group_first td { border-top-width: 2px; }
 #feynrjmttl .gt_row_group_first th { border-top-width: 2px; }
 #feynrjmttl .gt_striped { color: #333333; background-color: #F4F4F4; }
 #feynrjmttl .gt_table_body { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #feynrjmttl .gt_grand_summary_row { color: #333333; background-color: #FFFFFF; text-transform: inherit; padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; }
 #feynrjmttl .gt_first_grand_summary_row_bottom { border-top-style: double; border-top-width: 6px; border-top-color: #D3D3D3; }
 #feynrjmttl .gt_last_grand_summary_row_top { border-bottom-style: double; border-bottom-width: 6px; border-bottom-color: #D3D3D3; }
 #feynrjmttl .gt_sourcenotes { color: #333333; background-color: #FFFFFF; border-bottom-style: none; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; }
 #feynrjmttl .gt_sourcenote { font-size: 90%; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; text-align: left; }
 #feynrjmttl .gt_left { text-align: left; }
 #feynrjmttl .gt_center { text-align: center; }
 #feynrjmttl .gt_right { text-align: right; font-variant-numeric: tabular-nums; }
 #feynrjmttl .gt_font_normal { font-weight: normal; }
 #feynrjmttl .gt_font_bold { font-weight: bold; }
 #feynrjmttl .gt_font_italic { font-style: italic; }
 #feynrjmttl .gt_super { font-size: 65%; }
 #feynrjmttl .gt_footnote_marks { font-size: 75%; vertical-align: 0.4em; position: initial; }
 #feynrjmttl .gt_asterisk { font-size: 100%; vertical-align: 0; }
 
</style>
<table class="gt_table" data-quarto-disable-processing="false" data-quarto-bootstrap="false">
<thead>

<tr class="gt_col_headings">
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="1" colspan="1" scope="col" id="name">name</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="lines">lines</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="case4">case4</th>
</tr>
</thead>
<tbody class="gt_table_body">
  <tr>
    <td class="gt_row gt_left">Argentine</td>
    <td class="gt_row gt_right">1</td>
    <td class="gt_row gt_right"><span style="white-space:nowrap;"><img src="https://posit-dev.github.io/great-tables/blog/rendering-images/data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHJvbGU9ImltZyIgdmlld0JveD0iMCAwIDEwNTAgMTA1MCIgc3R5bGU9ImhlaWdodDoxZW07d2lkdGg6MS4xM2VtO3ZlcnRpY2FsLWFsaWduOi0wLjEyNWVtO21hcmdpbi1sZWZ0OmF1dG87bWFyZ2luLXJpZ2h0OmF1dG87Zm9udC1zaXplOmluaGVyaXQ7b3ZlcmZsb3c6dmlzaWJsZTtwb3NpdGlvbjpyZWxhdGl2ZTsiPjxjaXJjbGUgZmlsbD0iI0ZFQ0UwMCIgY3g9IjUwMCIgY3k9IjUwMCIgcj0iNTAwIi8+PHBhdGggZmlsbD0iIzIyMUUyMCIgZD0iTTU3Ny4wMjYgNzYzLjk4N1YyMzQuMDIyaC05Mi4zNTJjLTIzLjkzOCAxOC43MTQtODEuMDE3IDU0LjAyNi0xNDIuNTY1IDgzLjI2NWwtMzIuMjg3IDE1LjE0NyAzNi4wMTQgODEuMDQyIDI3Ljk0Ni0xNC4zOGMxOS4zNzgtOS42MTEgNzIuNjE3LTM3LjM1NyA5MC42OC01MS43djQxNi41OTFoMTEyLjU2NCIvPjwvc3ZnPg==" style="height: 2em;vertical-align: middle;"></span></td>
  </tr>
  <tr>
    <td class="gt_row gt_left">Bastille</td>
    <td class="gt_row gt_right">1, 5, 8</td>
    <td class="gt_row gt_right"><span style="white-space:nowrap;"><img src="https://posit-dev.github.io/great-tables/blog/rendering-images/data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHJvbGU9ImltZyIgdmlld0JveD0iMCAwIDEwNTAgMTA1MCIgc3R5bGU9ImhlaWdodDoxZW07d2lkdGg6MS4xM2VtO3ZlcnRpY2FsLWFsaWduOi0wLjEyNWVtO21hcmdpbi1sZWZ0OmF1dG87bWFyZ2luLXJpZ2h0OmF1dG87Zm9udC1zaXplOmluaGVyaXQ7b3ZlcmZsb3c6dmlzaWJsZTtwb3NpdGlvbjpyZWxhdGl2ZTsiPjxjaXJjbGUgZmlsbD0iI0ZFQ0UwMCIgY3g9IjUwMCIgY3k9IjUwMCIgcj0iNTAwIi8+PHBhdGggZmlsbD0iIzIyMUUyMCIgZD0iTTU3Ny4wMjYgNzYzLjk4N1YyMzQuMDIyaC05Mi4zNTJjLTIzLjkzOCAxOC43MTQtODEuMDE3IDU0LjAyNi0xNDIuNTY1IDgzLjI2NWwtMzIuMjg3IDE1LjE0NyAzNi4wMTQgODEuMDQyIDI3Ljk0Ni0xNC4zOGMxOS4zNzgtOS42MTEgNzIuNjE3LTM3LjM1NyA5MC42OC01MS43djQxNi41OTFoMTEyLjU2NCIvPjwvc3ZnPg==" style="height: 2em;vertical-align: middle;"> <img src="https://posit-dev.github.io/great-tables/blog/rendering-images/data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHJvbGU9ImltZyIgdmlld0JveD0iMCAwIDEwNTAgMTA1MCIgc3R5bGU9ImhlaWdodDoxZW07d2lkdGg6MS4xM2VtO3ZlcnRpY2FsLWFsaWduOi0wLjEyNWVtO21hcmdpbi1sZWZ0OmF1dG87bWFyZ2luLXJpZ2h0OmF1dG87Zm9udC1zaXplOmluaGVyaXQ7b3ZlcmZsb3c6dmlzaWJsZTtwb3NpdGlvbjpyZWxhdGl2ZTsiPjxjaXJjbGUgZmlsbD0iI0YxOTA0MyIgY3g9IjUwMCIgY3k9IjUwMCIgcj0iNTAwIi8+PHBhdGggZmlsbD0iIzIzMUYyMCIgZD0iTTY3OS43MSA1OTIuNzVjMC03OS40ODYtNTguNDItMTU5LjY4LTIwMy4yNy0xNjcuMjVsLTE1LjEzMy0uNzEyIDcuNDE4LTEwMS4zNTFoMTkwLjc4di04Ny45MTNoLTI3OC41MmwtMjEuMDM2IDI3NS40OSA4Mi41NDIuNzEyYzk3LjYxMy45NzkgMTIyLjk3OSA1My4zMTcgMTIyLjk3OSA5MS42NSAwIDYyLjE2LTUxLjYyNyA4NS42MjktOTIuODY2IDg1LjYyOS00NS4xODggMC03NS4wMzctMTYuNjE1LTEwMC42MS0zMy45MTJsLTM4Ljg5NyA4Mi42OWM0MS4wOTMgMjMuMTcyIDg5LjI3NyAzOC4zMzMgMTQ1LjUgMzguMzMzIDEyMC43NzEtLjA0IDIwMS4xMi04Mi4wOCAyMDEuMTItMTgzLjM3Ii8+PC9zdmc+" style="height: 2em;vertical-align: middle;"> <img src="https://posit-dev.github.io/great-tables/blog/rendering-images/data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHJvbGU9ImltZyIgdmlld0JveD0iMCAwIDEwNTAgMTA1MCIgc3R5bGU9ImhlaWdodDoxZW07d2lkdGg6MS4xM2VtO3ZlcnRpY2FsLWFsaWduOi0wLjEyNWVtO21hcmdpbi1sZWZ0OmF1dG87bWFyZ2luLXJpZ2h0OmF1dG87Zm9udC1zaXplOmluaGVyaXQ7b3ZlcmZsb3c6dmlzaWJsZTtwb3NpdGlvbjpyZWxhdGl2ZTsiPjxjaXJjbGUgZmlsbD0iI0NEQUNDRiIgY3g9IjUwMCIgY3k9IjUwMCIgcj0iNTAwIi8+PHBhdGggZmlsbD0iIzIzMUYyMCIgZD0iTTY4OS4yMSA2MTQuOTJjMC02OS42MTctNDIuNzQyLTExMS44MS05MS41NzMtMTM0Ljg1IDQ5LjU2OC0zMC4xNzUgNzUuMjA2LTY4LjQ1NCA3NS4yMDYtMTE3LjkgMC05MC45ODYtNzcuMzc4LTEzNi44My0xNzAuNDYtMTM2LjgzLTkwLjg3NyAwLTE3MC40MSA2MC45My0xNzAuNDEgMTQ4LjY2IDAgNTQuODAxIDI4LjU0NSA4Ny4wMzEgNzQuMjM1IDExNS41NC01MS4wMjMgMjYuMjk2LTkwLjc3OSA2Ny43MTYtOTAuNzc5IDEzOC4xNSAwIDgwLjM5NyA2Ni42OTMgMTUwLjkwOSAxODQuNTggMTUwLjkwOSAxMDguODYtLjAyIDE4OS4xOS02Mi45NiAxODkuMTktMTYzLjY4TTU3MS40MDkgMzY4LjgzYzAgMzMuMTItMzAuMDIxIDYzLjY4Mi01Ny44MTIgNzYuNTU5LTMzLjcwNS0xNC4yNzItNzcuMzAyLTM3LjYyLTc3LjMwMi04MS4wNTkgMC0zNi42ODkgMjYuMjIxLTYyLjI4NiA2Ny41MjctNjIuMjg2IDQzLjUyOS4wMSA2Ny41OCAyOS45MSA2Ny41OCA2Ni43OWwuMDA3LS4wMDR6bTguMjIgMjU0LjQyYzAgNDIuMDQyLTI3Ljc3IDc3LjM3My03OC4wOTUgNzcuMzczLTUxLjEwMyAwLTc5LjU1LTQxLjQ1OS03OS41NS04NC44OTYgMC00MS4xODggMzQuNTM5LTc1LjcwNSA2OS4wNTgtODkuMzE4IDQ0Ljk5IDIyLjU0IDg4LjU5IDQ4LjggODguNTkgOTYuODVsLS4wMDMtLjAwOXoiLz48L3N2Zz4=" style="height: 2em;vertical-align: middle;"></span></td>
  </tr>
  <tr>
    <td class="gt_row gt_left">Bérault</td>
    <td class="gt_row gt_right">1</td>
    <td class="gt_row gt_right"><span style="white-space:nowrap;"><img src="https://posit-dev.github.io/great-tables/blog/rendering-images/data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHJvbGU9ImltZyIgdmlld0JveD0iMCAwIDEwNTAgMTA1MCIgc3R5bGU9ImhlaWdodDoxZW07d2lkdGg6MS4xM2VtO3ZlcnRpY2FsLWFsaWduOi0wLjEyNWVtO21hcmdpbi1sZWZ0OmF1dG87bWFyZ2luLXJpZ2h0OmF1dG87Zm9udC1zaXplOmluaGVyaXQ7b3ZlcmZsb3c6dmlzaWJsZTtwb3NpdGlvbjpyZWxhdGl2ZTsiPjxjaXJjbGUgZmlsbD0iI0ZFQ0UwMCIgY3g9IjUwMCIgY3k9IjUwMCIgcj0iNTAwIi8+PHBhdGggZmlsbD0iIzIyMUUyMCIgZD0iTTU3Ny4wMjYgNzYzLjk4N1YyMzQuMDIyaC05Mi4zNTJjLTIzLjkzOCAxOC43MTQtODEuMDE3IDU0LjAyNi0xNDIuNTY1IDgzLjI2NWwtMzIuMjg3IDE1LjE0NyAzNi4wMTQgODEuMDQyIDI3Ljk0Ni0xNC4zOGMxOS4zNzgtOS42MTEgNzIuNjE3LTM3LjM1NyA5MC42OC01MS43djQxNi41OTFoMTEyLjU2NCIvPjwvc3ZnPg==" style="height: 2em;vertical-align: middle;"></span></td>
  </tr>
  <tr>
    <td class="gt_row gt_left">Champs-Élysées—Clemenceau</td>
    <td class="gt_row gt_right">1, 13</td>
    <td class="gt_row gt_right"><span style="white-space:nowrap;"><img src="https://posit-dev.github.io/great-tables/blog/rendering-images/data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHJvbGU9ImltZyIgdmlld0JveD0iMCAwIDEwNTAgMTA1MCIgc3R5bGU9ImhlaWdodDoxZW07d2lkdGg6MS4xM2VtO3ZlcnRpY2FsLWFsaWduOi0wLjEyNWVtO21hcmdpbi1sZWZ0OmF1dG87bWFyZ2luLXJpZ2h0OmF1dG87Zm9udC1zaXplOmluaGVyaXQ7b3ZlcmZsb3c6dmlzaWJsZTtwb3NpdGlvbjpyZWxhdGl2ZTsiPjxjaXJjbGUgZmlsbD0iI0ZFQ0UwMCIgY3g9IjUwMCIgY3k9IjUwMCIgcj0iNTAwIi8+PHBhdGggZmlsbD0iIzIyMUUyMCIgZD0iTTU3Ny4wMjYgNzYzLjk4N1YyMzQuMDIyaC05Mi4zNTJjLTIzLjkzOCAxOC43MTQtODEuMDE3IDU0LjAyNi0xNDIuNTY1IDgzLjI2NWwtMzIuMjg3IDE1LjE0NyAzNi4wMTQgODEuMDQyIDI3Ljk0Ni0xNC4zOGMxOS4zNzgtOS42MTEgNzIuNjE3LTM3LjM1NyA5MC42OC01MS43djQxNi41OTFoMTEyLjU2NCIvPjwvc3ZnPg==" style="height: 2em;vertical-align: middle;"> <img src="https://posit-dev.github.io/great-tables/blog/rendering-images/data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHJvbGU9ImltZyIgdmlld0JveD0iMCAwIDEwNTAgMTA1MCIgc3R5bGU9ImhlaWdodDoxZW07d2lkdGg6MS4xM2VtO3ZlcnRpY2FsLWFsaWduOi0wLjEyNWVtO21hcmdpbi1sZWZ0OmF1dG87bWFyZ2luLXJpZ2h0OmF1dG87Zm9udC1zaXplOmluaGVyaXQ7b3ZlcmZsb3c6dmlzaWJsZTtwb3NpdGlvbjpyZWxhdGl2ZTsiPjxjaXJjbGUgZmlsbD0iIzk5RDRERSIgY3g9IjUwMCIgY3k9IjUwMCIgcj0iNTAwIi8+PHBhdGggZmlsbD0iIzIzMUYyMCIgZD0iTTM4Ny41IDc2NC4xMVYyMzQuMDNoLTkyLjM2MWMtMjQuMDkyIDE4LjY5NS04MS4xODkgNTMuODcxLTE0Mi43MyA4My4xMDVsLTMyLjI5MiAxNC45NzQgMzYuMDk2IDgxLjYgMjcuNzc2LTE0LjI2YzE5LjQ1Ni05Ljc0NSA3Mi44MjgtMzcuNDM1IDkwLjc3Ny01MS42MTN2NDE2LjI4aDExMi43Mk04MjEuMjIgNjA2LjkzYzAtNzQuMTUxLTQ0LjI5Ny0xMTcuNTY5LTEwMi44NTktMTI4Ljg1OXYtMS40NjVjNTYuMjY2LTIwLjk5NCA4NS40MjgtNjIuODYzIDg1LjQyOC0xMTcuNTcgMC03MS4xNDMtNjEuNDk1LTEzNC4wNC0xNjkuNTEtMTM0LjA0LTYyLjQ0NyAwLTExMy4zOCAxNy4yNy0xNTkuMTUgNDcuMjE3bDM2LjcxMSA3Ny44NzdjMTcuMjM2LTE0LjIyMSA0OS40NS0zOC4xODYgOTguMzQ2LTM4LjE4NiA1NS41OTMgMCA4MS4wMjkgMjkuOTg1IDgxLjAyOSA2My42OTQgMCA0MC4zMjQtMzIuMjEzIDY1Ljg3NS04NC4xMjEgNjUuODc1SDU1MS41OHY4Ny41OGg1NC44MDFjNTQuMjAzIDAgMTAwLjY0IDE5LjQ0OSAxMDAuNjQgODAuMDk3IDAgNDQuOTItMzguMTk3IDc4LjY3LTk5LjkzMiA3OC42Ny00NC43NzQgMC04MS42MDQtMTcuMjcxLTEwNC4xNy0zNC40NjRsLTQwLjU5NiA4MS42MDFjNDIuNzk0IDIzLjkyNiA4NC4wNjIgMzkuNjEzIDE1Mi4zNyAzOS42MTMgMTIzLjE0OS0uMDExIDIwNi41Mi03NC44ODEgMjA2LjUyLTE2Ny42NWwuMDA3LjAxeiIvPjwvc3ZnPg==" style="height: 2em;vertical-align: middle;"></span></td>
  </tr>
  <tr>
    <td class="gt_row gt_left">Charles de Gaulle—Étoile</td>
    <td class="gt_row gt_right">1, 2, 6</td>
    <td class="gt_row gt_right"><span style="white-space:nowrap;"><img src="https://posit-dev.github.io/great-tables/blog/rendering-images/data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHJvbGU9ImltZyIgdmlld0JveD0iMCAwIDEwNTAgMTA1MCIgc3R5bGU9ImhlaWdodDoxZW07d2lkdGg6MS4xM2VtO3ZlcnRpY2FsLWFsaWduOi0wLjEyNWVtO21hcmdpbi1sZWZ0OmF1dG87bWFyZ2luLXJpZ2h0OmF1dG87Zm9udC1zaXplOmluaGVyaXQ7b3ZlcmZsb3c6dmlzaWJsZTtwb3NpdGlvbjpyZWxhdGl2ZTsiPjxjaXJjbGUgZmlsbD0iI0ZFQ0UwMCIgY3g9IjUwMCIgY3k9IjUwMCIgcj0iNTAwIi8+PHBhdGggZmlsbD0iIzIyMUUyMCIgZD0iTTU3Ny4wMjYgNzYzLjk4N1YyMzQuMDIyaC05Mi4zNTJjLTIzLjkzOCAxOC43MTQtODEuMDE3IDU0LjAyNi0xNDIuNTY1IDgzLjI2NWwtMzIuMjg3IDE1LjE0NyAzNi4wMTQgODEuMDQyIDI3Ljk0Ni0xNC4zOGMxOS4zNzgtOS42MTEgNzIuNjE3LTM3LjM1NyA5MC42OC01MS43djQxNi41OTFoMTEyLjU2NCIvPjwvc3ZnPg==" style="height: 2em;vertical-align: middle;"> <img src="https://posit-dev.github.io/great-tables/blog/rendering-images/data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHJvbGU9ImltZyIgdmlld0JveD0iMCAwIDEwNTAgMTA1MCIgc3R5bGU9ImhlaWdodDoxZW07d2lkdGg6MS4xM2VtO3ZlcnRpY2FsLWFsaWduOi0wLjEyNWVtO21hcmdpbi1sZWZ0OmF1dG87bWFyZ2luLXJpZ2h0OmF1dG87Zm9udC1zaXplOmluaGVyaXQ7b3ZlcmZsb3c6dmlzaWJsZTtwb3NpdGlvbjpyZWxhdGl2ZTsiPjxjaXJjbGUgZmlsbD0iIzAwNjVBRSIgY3g9IjUwMCIgY3k9IjUwMCIgcj0iNTAwIi8+PHBhdGggZmlsbD0iI2ZmZiIgZD0iTTY3Ni40NCA3NDAuOTV2LTg4LjcwOUg0NTcuNzZjNi44ODgtMzAuNzEzIDYwLjEzMy03NS4wMzUgODcuMDg0LTk5Ljc1IDYzLjg1NS01Ny45OTcgMTIxLjYyLTk5LjE4OCAxMjEuNjItMTkwLjAxIDAtMTA4LjA1LTg3LjY3OC0xNjAuNjEtMTgwLjc2LTE2MC42MS03MS4zNjYgMC0xMTguNjIgMjAuOTkxLTE2OS43MiA2NS4zNzlsNTUuNzE3IDczLjU4NWMxMi42NTItMTQuMzM1IDQ0Ljk3NS00OC4xMTIgOTEuNDM0LTQ4LjExMiA1Ny43NiAwIDg3Ljc0MiAzNi43NzYgODcuNzQyIDgyLjQ4MiAwIDUxLjIwOS0zOC4wMjMgODcuODU0LTczLjM0NCAxMTguNjMtNzAuNzA5IDYxLjU5LTEzMS40NyAxMTUuNTctMTQ0Ljk0IDE3Ny4yOXY2OS44NjFoMzQzLjg1MSIvPjwvc3ZnPg==" style="height: 2em;vertical-align: middle;"> <img src="https://posit-dev.github.io/great-tables/blog/rendering-images/data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHJvbGU9ImltZyIgdmlld0JveD0iMCAwIDEwNTAgMTA1MCIgc3R5bGU9ImhlaWdodDoxZW07d2lkdGg6MS4xM2VtO3ZlcnRpY2FsLWFsaWduOi0wLjEyNWVtO21hcmdpbi1sZWZ0OmF1dG87bWFyZ2luLXJpZ2h0OmF1dG87Zm9udC1zaXplOmluaGVyaXQ7b3ZlcmZsb3c6dmlzaWJsZTtwb3NpdGlvbjpyZWxhdGl2ZTsiPjxjaXJjbGUgZmlsbD0iIzg0QzI4RSIgY3g9IjUwMCIgY3k9IjUwMCIgcj0iNTAwIi8+PHBhdGggZmlsbD0iIzIzMUYyMCIgZD0iTTY3Mi4xNiA1NzAuNTZjMC05OS4zMDUtNzAuNTE5LTE1Ny4wMS0xNTcuMTEtMTU3LjAxLTU1Ljk0NyAwLTg5Ljg4NyAyMC4yODctMTA3Ljc5IDM2LjA2OCA2LjY5OS0xMDYuNTIxIDYxLjQzOC0xNTkuODcgMTM0LjQxLTE1OS44NyAyOS43NjggMCA1Ni45NzMgNi43MDEgNzEuMDMxIDEyLjg5MWwxNi42Ni05MC4xMTVjLTIxLjcxMy01LjQxNy00OC45MTYtOC45MzQtNzguODMtOC45MzQtMTY2LjU5IDAtMjUxLjM2IDEyNS44OTEtMjUxLjM2IDMwOS44OTEgMCAxNDAuMzUgNTAuODk1IDI0MC4zMSAxOTMuNTggMjQwLjMxIDEwOC44OS0uMDAxIDE3OS40MS03Ny41NjEgMTc5LjQwOS0xODMuMjMxbS0xMDUuODA5IDExLjI4YzAgNDUuNjI1LTI2LjI1NCA4OC40My03Ny40MDEgODguNDMtNTIuNTc4IDAtODAuOTUzLTQ4Ljc3Mi04MC45NTMtOTkuMTIgMC0xNS42MzggMC0zNS45NTkgNi4wMDQtNDQuOTY4IDEwLjQ3MS0xNi41ODYgMzYuNzk3LTI5LjE4NCA2OS4wNTUtMjkuMTg0IDUwLjkyIDAgODMuMjkgMzUuMTkgODMuMjkgODQuODRsLjAwNS4wMDJ6Ii8+PC9zdmc+" style="height: 2em;vertical-align: middle;"></span></td>
  </tr>
</tbody>


</table>

</div>
</div>
</div>
</div>
</div>
</div>
<p><strong>Case 4</strong> is undoubtedly one of the most powerful features of Great Tables. While mastering it may take some practice, we hope this example helps you render images effortlessly and effectively.</p>
</section>
</section>
<section id="rendering-images-anywhere" class="level2">
<h2 class="anchored" data-anchor-id="rendering-images-anywhere">Rendering Images Anywhere</h2>
<p>While <a href="../../reference/GT.fmt_image.html#great_tables.GT.fmt_image" title="0"><code>GT.fmt_image()</code></a> is primarily designed for rendering images in the table body, what if you need to display images in other locations, such as the header? In such cases, you can turn to the versatile <a href="https://posit-dev.github.io/great-tables/reference/vals.fmt_image.html#great_tables.vals.fmt_image">vals.fmt_image()</a>.</p>
<p><a href="../../reference/vals.fmt_image.html#great_tables.vals.fmt_image" title="0"><code>vals.fmt_image()</code></a> is a hidden gem in Great Tables. Its usage is similar to <a href="../../reference/GT.fmt_image.html#great_tables.GT.fmt_image" title="0"><code>GT.fmt_image()</code></a>, but instead of working directly with DataFrame columns, it lets you pass a string or a list of strings as the first argument, returning a list of strings, each representing an image. You can then wrap these strings with <a href="https://posit-dev.github.io/great-tables/reference/html.html#great_tables.html">html()</a>, allowing Great Tables to render the images anywhere in the table.</p>
<section id="preparations-1" class="level3">
<h3 class="anchored" data-anchor-id="preparations-1">Preparations</h3>
<p>We will create a <code>Pandas</code> DataFrame named <code>metro_mini</code> using the <code>data</code> dictionary. This will be used for demonstration in the following examples:</p>
<div id="208db4bc" class="cell" data-execution_count="15">
<details class="code-fold">
<summary>Show the Code</summary>
<div class="code-copy-outer-scaffold"><div class="sourceCode cell-code" id="cb15" style="background: #f1f3f5;"><pre class="sourceCode python code-with-copy"><code class="sourceCode python"><span id="cb15-1">metro_mini <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> pd.DataFrame(data)</span>
<span id="cb15-2">metro_mini</span></code></pre></div></div>
</details>
<div class="cell-output cell-output-display" data-execution_count="14">
<div>

<table class="dataframe table table-sm table-striped small">
  <thead>
    <tr>
      <th></th>
      <th>name</th>
      <th>lines</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <th>0</th>
      <td>Argentine</td>
      <td>1</td>
    </tr>
    <tr>
      <th>1</th>
      <td>Bastille</td>
      <td>1, 5, 8</td>
    </tr>
    <tr>
      <th>2</th>
      <td>Bérault</td>
      <td>1</td>
    </tr>
    <tr>
      <th>3</th>
      <td>Champs-Élysées—Clemenceau</td>
      <td>1, 13</td>
    </tr>
    <tr>
      <th>4</th>
      <td>Charles de Gaulle—Étoile</td>
      <td>1, 2, 6</td>
    </tr>
  </tbody>
</table>
</div>
</div>
</div>
</section>
<section id="single-image" class="level3">
<h3 class="anchored" data-anchor-id="single-image">Single Image</h3>
<p>This example shows how to render a valid URL as an image in the title of the table header:</p>
<div id="ebb9e3ea" class="cell" data-execution_count="16">
<div class="code-copy-outer-scaffold"><div class="sourceCode cell-code" id="annotated-cell-14" style="background: #f1f3f5;"><pre class="sourceCode python code-annotation-code code-with-copy code-annotated"><code class="sourceCode python"><span id="annotated-cell-14-1">gt_logo_url <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"https://posit-dev.github.io/great-tables/assets/GT_logo.svg"</span></span>
<span id="annotated-cell-14-2"></span>
<a class="code-annotation-anchor" data-target-cell="annotated-cell-14" data-target-annotation="1" onclick="event.preventDefault();">1</a><span id="annotated-cell-14-3" class="code-annotation-target">_gt_logo, <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">*</span>_ <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> vals.fmt_image(gt_logo_url, height<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">100</span>)</span>
<span id="annotated-cell-14-4">gt_logo <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> html(_gt_logo)</span>
<span id="annotated-cell-14-5"></span>
<span id="annotated-cell-14-6">(</span>
<span id="annotated-cell-14-7">    GT(metro_mini)</span>
<span id="annotated-cell-14-8">    .fmt_image(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"lines"</span>, path<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>img_url_paths, file_pattern<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"metro_</span><span class="sc" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">{}</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">.svg"</span>)</span>
<span id="annotated-cell-14-9">    .tab_header(title<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>gt_logo)</span>
<span id="annotated-cell-14-10">    .cols_align(align<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"right"</span>, columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"lines"</span>)</span>
<span id="annotated-cell-14-11">    .opt_stylize(style<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">4</span>, color<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"gray"</span>)</span>
<span id="annotated-cell-14-12">)</span><div class="code-annotation-gutter-bg"></div><div class="code-annotation-gutter"></div></code></pre></div></div>
<div class="cell-annotation">
<dl class="code-annotation-container-grid">
<dt data-target-cell="annotated-cell-14" data-target-annotation="1">1</dt>
<dd>
<span data-code-cell="annotated-cell-14" data-code-lines="3" data-code-annotation="1"><a href="../../reference/vals.fmt_image.html#great_tables.vals.fmt_image" title="0"><code>vals.fmt_image()</code></a> returns a list of strings. Here, we use tuple unpacking to extract the first item from the list.</span>
</dd>
</dl>
</div>
<div class="cell-output cell-output-display" data-execution_count="15">
<div id="iljnztfzuo" style="padding-left:0px;padding-right:0px;padding-top:10px;padding-bottom:10px;overflow-x:auto;overflow-y:auto;width:auto;height:auto;">
<style>
#iljnztfzuo table {
          font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Helvetica Neue', 'Fira Sans', 'Droid Sans', Arial, sans-serif;
          -webkit-font-smoothing: antialiased;
          -moz-osx-font-smoothing: grayscale;
        }

#iljnztfzuo thead, tbody, tfoot, tr, td, th { border-style: none; }
 tr { background-color: transparent; }
#iljnztfzuo p { margin: 0; padding: 0; }
 #iljnztfzuo .gt_table { display: table; border-collapse: collapse; line-height: normal; margin-left: auto; margin-right: auto; color: #333333; font-size: 16px; font-weight: normal; font-style: normal; background-color: #FFFFFF; width: auto; border-top-style: solid; border-top-width: 3px; border-top-color: #D5D5D5; border-right-style: solid; border-right-width: 3px; border-right-color: #D5D5D5; border-bottom-style: solid; border-bottom-width: 3px; border-bottom-color: #D5D5D5; border-left-style: solid; border-left-width: 3px; border-left-color: #D5D5D5; }
 #iljnztfzuo .gt_caption { padding-top: 4px; padding-bottom: 4px; }
 #iljnztfzuo .gt_title { color: #333333; font-size: 125%; font-weight: initial; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; border-bottom-color: #FFFFFF; border-bottom-width: 0; }
 #iljnztfzuo .gt_subtitle { color: #333333; font-size: 85%; font-weight: initial; padding-top: 3px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; border-top-color: #FFFFFF; border-top-width: 0; }
 #iljnztfzuo .gt_heading { background-color: #FFFFFF; text-align: center; border-bottom-color: #FFFFFF; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #iljnztfzuo .gt_bottom_border { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D5D5D5; }
 #iljnztfzuo .gt_col_headings { border-top-style: solid; border-top-width: 2px; border-top-color: #D5D5D5; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D5D5D5; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #iljnztfzuo .gt_col_heading { color: #FFFFFF; background-color: #5F5F5F; font-size: 100%; font-weight: normal; text-transform: inherit; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; overflow-x: hidden; }
 #iljnztfzuo .gt_column_spanner_outer { color: #FFFFFF; background-color: #5F5F5F; font-size: 100%; font-weight: normal; text-transform: inherit; padding-top: 0; padding-bottom: 0; padding-left: 4px; padding-right: 4px; }
 #iljnztfzuo .gt_column_spanner_outer:first-child { padding-left: 0; }
 #iljnztfzuo .gt_column_spanner_outer:last-child { padding-right: 0; }
 #iljnztfzuo .gt_column_spanner { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D5D5D5; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; overflow-x: hidden; display: inline-block; width: 100%; }
 #iljnztfzuo .gt_spanner_row { border-bottom-style: hidden; }
 #iljnztfzuo .gt_group_heading { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-top-style: solid; border-top-width: 2px; border-top-color: #D5D5D5; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D5D5D5; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; text-align: left; }
 #iljnztfzuo .gt_empty_group_heading { padding: 0.5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; border-top-style: solid; border-top-width: 2px; border-top-color: #D5D5D5; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D5D5D5; vertical-align: middle; }
 #iljnztfzuo .gt_from_md> :first-child { margin-top: 0; }
 #iljnztfzuo .gt_from_md> :last-child { margin-bottom: 0; }
 #iljnztfzuo .gt_row { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; margin: 10px; border-top-style: dashed; border-top-width: 1px; border-top-color: #D5D5D5; border-left-style: dashed; border-left-width: 1px; border-left-color: #D5D5D5; border-right-style: dashed; border-right-width: 1px; border-right-color: #D5D5D5; vertical-align: middle; overflow-x: hidden; }
 #iljnztfzuo .gt_stub { color: #333333; background-color: #929292; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: dashed; border-right-width: 2px; border-right-color: #D5D5D5; padding-left: 5px; padding-right: 5px; }
 #iljnztfzuo .gt_stub_row_group { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; vertical-align: top; }
 #iljnztfzuo .gt_row_group_first td { border-top-width: 2px; }
 #iljnztfzuo .gt_row_group_first th { border-top-width: 2px; }
 #iljnztfzuo .gt_striped { color: #333333; background-color: #F4F4F4; }
 #iljnztfzuo .gt_table_body { border-top-style: solid; border-top-width: 2px; border-top-color: #D5D5D5; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D5D5D5; }
 #iljnztfzuo .gt_grand_summary_row { color: #FFFFFF; background-color: #5F5F5F; text-transform: inherit; padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; }
 #iljnztfzuo .gt_first_grand_summary_row_bottom { border-top-style: double; border-top-width: 6px; border-top-color: #D3D3D3; }
 #iljnztfzuo .gt_last_grand_summary_row_top { border-bottom-style: double; border-bottom-width: 6px; border-bottom-color: #D3D3D3; }
 #iljnztfzuo .gt_sourcenotes { color: #333333; background-color: #FFFFFF; border-bottom-style: none; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; }
 #iljnztfzuo .gt_sourcenote { font-size: 90%; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; text-align: left; }
 #iljnztfzuo .gt_left { text-align: left; }
 #iljnztfzuo .gt_center { text-align: center; }
 #iljnztfzuo .gt_right { text-align: right; font-variant-numeric: tabular-nums; }
 #iljnztfzuo .gt_font_normal { font-weight: normal; }
 #iljnztfzuo .gt_font_bold { font-weight: bold; }
 #iljnztfzuo .gt_font_italic { font-style: italic; }
 #iljnztfzuo .gt_super { font-size: 65%; }
 #iljnztfzuo .gt_footnote_marks { font-size: 75%; vertical-align: 0.4em; position: initial; }
 #iljnztfzuo .gt_asterisk { font-size: 100%; vertical-align: 0; }
 
</style>
<table class="gt_table" data-quarto-disable-processing="false" data-quarto-bootstrap="false">
<thead>

  <tr class="gt_heading">
    <td colspan="2" class="gt_heading gt_title gt_font_normal"><span style="white-space:nowrap;"><img src="https://posit-dev.github.io/great-tables/assets/GT_logo.svg" style="height: 100px;vertical-align: middle;"></span></td>
  </tr>
<tr class="gt_col_headings">
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="1" colspan="1" scope="col" id="name">name</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="lines">lines</th>
</tr>
</thead>
<tbody class="gt_table_body">
  <tr>
    <td class="gt_row gt_left">Argentine</td>
    <td class="gt_row gt_right"><span style="white-space:nowrap;"><img src="https://raw.githubusercontent.com/posit-dev/great-tables/refs/heads/main/great_tables/data/metro_images/metro_1.svg" style="height: 2em;vertical-align: middle;"></span></td>
  </tr>
  <tr>
    <td class="gt_row gt_left gt_striped">Bastille</td>
    <td class="gt_row gt_right gt_striped"><span style="white-space:nowrap;"><img src="https://raw.githubusercontent.com/posit-dev/great-tables/refs/heads/main/great_tables/data/metro_images/metro_1.svg" style="height: 2em;vertical-align: middle;"> <img src="https://raw.githubusercontent.com/posit-dev/great-tables/refs/heads/main/great_tables/data/metro_images/metro_5.svg" style="height: 2em;vertical-align: middle;"> <img src="https://raw.githubusercontent.com/posit-dev/great-tables/refs/heads/main/great_tables/data/metro_images/metro_8.svg" style="height: 2em;vertical-align: middle;"></span></td>
  </tr>
  <tr>
    <td class="gt_row gt_left">Bérault</td>
    <td class="gt_row gt_right"><span style="white-space:nowrap;"><img src="https://raw.githubusercontent.com/posit-dev/great-tables/refs/heads/main/great_tables/data/metro_images/metro_1.svg" style="height: 2em;vertical-align: middle;"></span></td>
  </tr>
  <tr>
    <td class="gt_row gt_left gt_striped">Champs-Élysées—Clemenceau</td>
    <td class="gt_row gt_right gt_striped"><span style="white-space:nowrap;"><img src="https://raw.githubusercontent.com/posit-dev/great-tables/refs/heads/main/great_tables/data/metro_images/metro_1.svg" style="height: 2em;vertical-align: middle;"> <img src="https://raw.githubusercontent.com/posit-dev/great-tables/refs/heads/main/great_tables/data/metro_images/metro_13.svg" style="height: 2em;vertical-align: middle;"></span></td>
  </tr>
  <tr>
    <td class="gt_row gt_left">Charles de Gaulle—Étoile</td>
    <td class="gt_row gt_right"><span style="white-space:nowrap;"><img src="https://raw.githubusercontent.com/posit-dev/great-tables/refs/heads/main/great_tables/data/metro_images/metro_1.svg" style="height: 2em;vertical-align: middle;"> <img src="https://raw.githubusercontent.com/posit-dev/great-tables/refs/heads/main/great_tables/data/metro_images/metro_2.svg" style="height: 2em;vertical-align: middle;"> <img src="https://raw.githubusercontent.com/posit-dev/great-tables/refs/heads/main/great_tables/data/metro_images/metro_6.svg" style="height: 2em;vertical-align: middle;"></span></td>
  </tr>
</tbody>


</table>

</div>
</div>
</div>
</section>
<section id="multiple-images" class="level3">
<h3 class="anchored" data-anchor-id="multiple-images">Multiple Images</h3>
<p>This example demonstrates how to render two valid URLs as images in the title and subtitle of the table header:</p>
<div id="ffd85e5b" class="cell" data-execution_count="17">
<div class="code-copy-outer-scaffold"><div class="sourceCode cell-code" id="annotated-cell-15" style="background: #f1f3f5;"><pre class="sourceCode python code-annotation-code code-with-copy code-annotated"><code class="sourceCode python"><span id="annotated-cell-15-1">metro_logo_url <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"https://raw.githubusercontent.com/rstudio/gt/master/images/dataset_metro.svg"</span></span>
<span id="annotated-cell-15-2">logo_urls <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> [gt_logo_url, metro_logo_url]</span>
<span id="annotated-cell-15-3"></span>
<a class="code-annotation-anchor" data-target-cell="annotated-cell-15" data-target-annotation="1" onclick="event.preventDefault();">1</a><span id="annotated-cell-15-4" class="code-annotation-target">_gt_logo, _metro_logo <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> vals.fmt_image(logo_urls, height<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">100</span>)</span>
<span id="annotated-cell-15-5">gt_logo, metro_logo <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> html(_gt_logo), html(_metro_logo)</span>
<span id="annotated-cell-15-6"></span>
<span id="annotated-cell-15-7">(</span>
<span id="annotated-cell-15-8">    GT(metro_mini)</span>
<span id="annotated-cell-15-9">    .fmt_image(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"lines"</span>, path<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>img_url_paths, file_pattern<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"metro_</span><span class="sc" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">{}</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">.svg"</span>)</span>
<span id="annotated-cell-15-10">    .tab_header(title<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>gt_logo, subtitle<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>metro_logo)</span>
<span id="annotated-cell-15-11">    .cols_align(align<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"right"</span>, columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"lines"</span>)</span>
<span id="annotated-cell-15-12">    .opt_stylize(style<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">4</span>, color<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"gray"</span>)</span>
<span id="annotated-cell-15-13">)</span><div class="code-annotation-gutter-bg"></div><div class="code-annotation-gutter"></div></code></pre></div></div>
<div class="cell-annotation">
<dl class="code-annotation-container-grid">
<dt data-target-cell="annotated-cell-15" data-target-annotation="1">1</dt>
<dd>
<span data-code-cell="annotated-cell-15" data-code-lines="4" data-code-annotation="1">Note that if you need to render images with different <code>height</code> or <code>width</code>, you might need to make two separate calls to <a href="../../reference/vals.fmt_image.html#great_tables.vals.fmt_image" title="0"><code>vals.fmt_image()</code></a>.</span>
</dd>
</dl>
</div>
<div class="cell-output cell-output-display" data-execution_count="16">
<div id="mlnaiqsadv" style="padding-left:0px;padding-right:0px;padding-top:10px;padding-bottom:10px;overflow-x:auto;overflow-y:auto;width:auto;height:auto;">
<style>
#mlnaiqsadv table {
          font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Helvetica Neue', 'Fira Sans', 'Droid Sans', Arial, sans-serif;
          -webkit-font-smoothing: antialiased;
          -moz-osx-font-smoothing: grayscale;
        }

#mlnaiqsadv thead, tbody, tfoot, tr, td, th { border-style: none; }
 tr { background-color: transparent; }
#mlnaiqsadv p { margin: 0; padding: 0; }
 #mlnaiqsadv .gt_table { display: table; border-collapse: collapse; line-height: normal; margin-left: auto; margin-right: auto; color: #333333; font-size: 16px; font-weight: normal; font-style: normal; background-color: #FFFFFF; width: auto; border-top-style: solid; border-top-width: 3px; border-top-color: #D5D5D5; border-right-style: solid; border-right-width: 3px; border-right-color: #D5D5D5; border-bottom-style: solid; border-bottom-width: 3px; border-bottom-color: #D5D5D5; border-left-style: solid; border-left-width: 3px; border-left-color: #D5D5D5; }
 #mlnaiqsadv .gt_caption { padding-top: 4px; padding-bottom: 4px; }
 #mlnaiqsadv .gt_title { color: #333333; font-size: 125%; font-weight: initial; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; border-bottom-color: #FFFFFF; border-bottom-width: 0; }
 #mlnaiqsadv .gt_subtitle { color: #333333; font-size: 85%; font-weight: initial; padding-top: 3px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; border-top-color: #FFFFFF; border-top-width: 0; }
 #mlnaiqsadv .gt_heading { background-color: #FFFFFF; text-align: center; border-bottom-color: #FFFFFF; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #mlnaiqsadv .gt_bottom_border { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D5D5D5; }
 #mlnaiqsadv .gt_col_headings { border-top-style: solid; border-top-width: 2px; border-top-color: #D5D5D5; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D5D5D5; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #mlnaiqsadv .gt_col_heading { color: #FFFFFF; background-color: #5F5F5F; font-size: 100%; font-weight: normal; text-transform: inherit; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; overflow-x: hidden; }
 #mlnaiqsadv .gt_column_spanner_outer { color: #FFFFFF; background-color: #5F5F5F; font-size: 100%; font-weight: normal; text-transform: inherit; padding-top: 0; padding-bottom: 0; padding-left: 4px; padding-right: 4px; }
 #mlnaiqsadv .gt_column_spanner_outer:first-child { padding-left: 0; }
 #mlnaiqsadv .gt_column_spanner_outer:last-child { padding-right: 0; }
 #mlnaiqsadv .gt_column_spanner { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D5D5D5; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; overflow-x: hidden; display: inline-block; width: 100%; }
 #mlnaiqsadv .gt_spanner_row { border-bottom-style: hidden; }
 #mlnaiqsadv .gt_group_heading { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-top-style: solid; border-top-width: 2px; border-top-color: #D5D5D5; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D5D5D5; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; text-align: left; }
 #mlnaiqsadv .gt_empty_group_heading { padding: 0.5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; border-top-style: solid; border-top-width: 2px; border-top-color: #D5D5D5; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D5D5D5; vertical-align: middle; }
 #mlnaiqsadv .gt_from_md> :first-child { margin-top: 0; }
 #mlnaiqsadv .gt_from_md> :last-child { margin-bottom: 0; }
 #mlnaiqsadv .gt_row { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; margin: 10px; border-top-style: dashed; border-top-width: 1px; border-top-color: #D5D5D5; border-left-style: dashed; border-left-width: 1px; border-left-color: #D5D5D5; border-right-style: dashed; border-right-width: 1px; border-right-color: #D5D5D5; vertical-align: middle; overflow-x: hidden; }
 #mlnaiqsadv .gt_stub { color: #333333; background-color: #929292; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: dashed; border-right-width: 2px; border-right-color: #D5D5D5; padding-left: 5px; padding-right: 5px; }
 #mlnaiqsadv .gt_stub_row_group { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; vertical-align: top; }
 #mlnaiqsadv .gt_row_group_first td { border-top-width: 2px; }
 #mlnaiqsadv .gt_row_group_first th { border-top-width: 2px; }
 #mlnaiqsadv .gt_striped { color: #333333; background-color: #F4F4F4; }
 #mlnaiqsadv .gt_table_body { border-top-style: solid; border-top-width: 2px; border-top-color: #D5D5D5; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D5D5D5; }
 #mlnaiqsadv .gt_grand_summary_row { color: #FFFFFF; background-color: #5F5F5F; text-transform: inherit; padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; }
 #mlnaiqsadv .gt_first_grand_summary_row_bottom { border-top-style: double; border-top-width: 6px; border-top-color: #D3D3D3; }
 #mlnaiqsadv .gt_last_grand_summary_row_top { border-bottom-style: double; border-bottom-width: 6px; border-bottom-color: #D3D3D3; }
 #mlnaiqsadv .gt_sourcenotes { color: #333333; background-color: #FFFFFF; border-bottom-style: none; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; }
 #mlnaiqsadv .gt_sourcenote { font-size: 90%; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; text-align: left; }
 #mlnaiqsadv .gt_left { text-align: left; }
 #mlnaiqsadv .gt_center { text-align: center; }
 #mlnaiqsadv .gt_right { text-align: right; font-variant-numeric: tabular-nums; }
 #mlnaiqsadv .gt_font_normal { font-weight: normal; }
 #mlnaiqsadv .gt_font_bold { font-weight: bold; }
 #mlnaiqsadv .gt_font_italic { font-style: italic; }
 #mlnaiqsadv .gt_super { font-size: 65%; }
 #mlnaiqsadv .gt_footnote_marks { font-size: 75%; vertical-align: 0.4em; position: initial; }
 #mlnaiqsadv .gt_asterisk { font-size: 100%; vertical-align: 0; }
 
</style>
<table class="gt_table" data-quarto-disable-processing="false" data-quarto-bootstrap="false">
<thead>

  <tr class="gt_heading">
    <td colspan="2" class="gt_heading gt_title gt_font_normal"><span style="white-space:nowrap;"><img src="https://posit-dev.github.io/great-tables/assets/GT_logo.svg" style="height: 100px;vertical-align: middle;"></span></td>
  </tr>
  <tr class="gt_heading">
    <td colspan="2" class="gt_heading gt_subtitle gt_font_normal gt_bottom_border"><span style="white-space:nowrap;"><img src="https://raw.githubusercontent.com/rstudio/gt/master/images/dataset_metro.svg" style="height: 100px;vertical-align: middle;"></span></td>
  </tr>
<tr class="gt_col_headings">
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="1" colspan="1" scope="col" id="name">name</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="lines">lines</th>
</tr>
</thead>
<tbody class="gt_table_body">
  <tr>
    <td class="gt_row gt_left">Argentine</td>
    <td class="gt_row gt_right"><span style="white-space:nowrap;"><img src="https://raw.githubusercontent.com/posit-dev/great-tables/refs/heads/main/great_tables/data/metro_images/metro_1.svg" style="height: 2em;vertical-align: middle;"></span></td>
  </tr>
  <tr>
    <td class="gt_row gt_left gt_striped">Bastille</td>
    <td class="gt_row gt_right gt_striped"><span style="white-space:nowrap;"><img src="https://raw.githubusercontent.com/posit-dev/great-tables/refs/heads/main/great_tables/data/metro_images/metro_1.svg" style="height: 2em;vertical-align: middle;"> <img src="https://raw.githubusercontent.com/posit-dev/great-tables/refs/heads/main/great_tables/data/metro_images/metro_5.svg" style="height: 2em;vertical-align: middle;"> <img src="https://raw.githubusercontent.com/posit-dev/great-tables/refs/heads/main/great_tables/data/metro_images/metro_8.svg" style="height: 2em;vertical-align: middle;"></span></td>
  </tr>
  <tr>
    <td class="gt_row gt_left">Bérault</td>
    <td class="gt_row gt_right"><span style="white-space:nowrap;"><img src="https://raw.githubusercontent.com/posit-dev/great-tables/refs/heads/main/great_tables/data/metro_images/metro_1.svg" style="height: 2em;vertical-align: middle;"></span></td>
  </tr>
  <tr>
    <td class="gt_row gt_left gt_striped">Champs-Élysées—Clemenceau</td>
    <td class="gt_row gt_right gt_striped"><span style="white-space:nowrap;"><img src="https://raw.githubusercontent.com/posit-dev/great-tables/refs/heads/main/great_tables/data/metro_images/metro_1.svg" style="height: 2em;vertical-align: middle;"> <img src="https://raw.githubusercontent.com/posit-dev/great-tables/refs/heads/main/great_tables/data/metro_images/metro_13.svg" style="height: 2em;vertical-align: middle;"></span></td>
  </tr>
  <tr>
    <td class="gt_row gt_left">Charles de Gaulle—Étoile</td>
    <td class="gt_row gt_right"><span style="white-space:nowrap;"><img src="https://raw.githubusercontent.com/posit-dev/great-tables/refs/heads/main/great_tables/data/metro_images/metro_1.svg" style="height: 2em;vertical-align: middle;"> <img src="https://raw.githubusercontent.com/posit-dev/great-tables/refs/heads/main/great_tables/data/metro_images/metro_2.svg" style="height: 2em;vertical-align: middle;"> <img src="https://raw.githubusercontent.com/posit-dev/great-tables/refs/heads/main/great_tables/data/metro_images/metro_6.svg" style="height: 2em;vertical-align: middle;"></span></td>
  </tr>
</tbody>


</table>

</div>
</div>
</div>
</section>
</section>
<section id="manually-rendering-images-anywhere" class="level2">
<h2 class="anchored" data-anchor-id="manually-rendering-images-anywhere">Manually Rendering Images Anywhere</h2>
<p>Remember, you can always use <a href="../../reference/html.html#great_tables.html" title="0"><code>html()</code></a> to manually construct your desired output. For example, the previous table can be created without relying on <a href="../../reference/vals.fmt_image.html#great_tables.vals.fmt_image" title="0"><code>vals.fmt_image()</code></a> like this:</p>
<div id="d522eeb8" class="cell" data-execution_count="18">
<div class="code-copy-outer-scaffold"><div class="sourceCode cell-code" id="cb16" style="background: #f1f3f5;"><pre class="sourceCode python code-with-copy"><code class="sourceCode python"><span id="cb16-1">(</span>
<span id="cb16-2">    GT(metro_mini)</span>
<span id="cb16-3">    .fmt_image(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"lines"</span>, path<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>img_url_paths, file_pattern<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"metro_</span><span class="sc" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">{}</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">.svg"</span>)</span>
<span id="cb16-4">    .tab_header(</span>
<span id="cb16-5">        title<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>html(<span class="ss" style="color: #20794D;
background-color: null;
font-style: inherit;">f'&lt;img src="</span><span class="sc" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">{</span>gt_logo_url<span class="sc" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">}</span><span class="ss" style="color: #20794D;
background-color: null;
font-style: inherit;">" height="100"&gt;'</span>),</span>
<span id="cb16-6">        subtitle<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>html(<span class="ss" style="color: #20794D;
background-color: null;
font-style: inherit;">f'&lt;img src="</span><span class="sc" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">{</span>metro_logo_url<span class="sc" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">}</span><span class="ss" style="color: #20794D;
background-color: null;
font-style: inherit;">" height="100"&gt;'</span>),</span>
<span id="cb16-7">    )</span>
<span id="cb16-8">    .cols_align(align<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"right"</span>, columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"lines"</span>)</span>
<span id="cb16-9">    .opt_stylize(style<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">4</span>, color<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"gray"</span>)</span>
<span id="cb16-10">)</span></code></pre></div></div>
</div>
<p>Alternatively, you can manually encode the image using Python’s built-in <a href="https://docs.python.org/3/library/base64.html">base64</a> module, specify the appropriate MIME type and HTML attributes, and then wrap it in <a href="../../reference/html.html#great_tables.html" title="0"><code>html()</code></a> to display the table.</p>
</section>
<section id="final-words" class="level2">
<h2 class="anchored" data-anchor-id="final-words">Final Words</h2>
<p>In this post, we focused on the most common use cases for rendering images in Great Tables, deliberately avoiding excessive DataFrame operations. Including such details could have overwhelmed the post with examples of string manipulations and the complexities of working with various DataFrame libraries.</p>
<p>We hope you found this guide helpful and enjoyed the structured approach. Until next time, happy table creation with Great Tables!</p>
<div class="callout callout-style-default callout-note callout-titled">
<div class="callout-header d-flex align-content-center">
<div class="callout-icon-container">
<i class="callout-icon"></i>
</div>
<div class="callout-title-container flex-fill">
<span class="screen-reader-only">Note</span>Appendix: Related PRs
</div>
</div>
<div class="callout-body-container callout-body">
<p>If you’re interested in the recent enhancements we’ve made to image rendering, be sure to check out <a href="https://github.com/posit-dev/great-tables/pull/444">#444</a>, <a href="https://github.com/posit-dev/great-tables/pull/451">#451</a> and <a href="https://github.com/posit-dev/great-tables/pull/520">#520</a> for all the details.</p>
</div>
</div>


</section>

 ]]></description>
  <guid>https://posit-dev.github.io/great-tables/blog/rendering-images/</guid>
  <pubDate>Fri, 13 Dec 2024 00:00:00 GMT</pubDate>
</item>
<item>
  <title>Great Tables: Generating LaTeX Output for PDF</title>
  <dc:creator>Rich Iannone</dc:creator>
  <link>https://posit-dev.github.io/great-tables/blog/latex-output-tables/</link>
  <description><![CDATA[ 




<p>We’ve been doing quite a bit of work on getting <strong>Great Tables</strong> to produce LaTeX table code and <code>v0.14.0</code> introduces the <code>as_latex()</code> method to make this possible. For those publishing workflows involving LaTeX documents, it’s useful to have a reproducible solution for generating data tables as native LaTeX tables.</p>
<p>In this post, we will go over the following:</p>
<ul>
<li>generating LaTeX table code: how we handle the different parts of a table</li>
<li>rendering to PDF with Quarto: integrating LaTeX table code into PDFs</li>
<li>current limitations and roadmap: what has been implemented, and what is left</li>
</ul>
<section id="generating-a-latex-table-with-great-tables" class="level2">
<h2 class="anchored" data-anchor-id="generating-a-latex-table-with-great-tables">Generating a LaTeX table with Great Tables</h2>
<p>We can use the <a href="../../reference/GT.as_latex.html#great_tables.GT.as_latex" title="0"><code>GT.as_latex()</code></a> method to generate LaTeX table code. This code includes important structural pieces like titles, spanners, and value formatting. For example, here’s a simple table output as LaTeX code:</p>
<div id="98baab87" class="cell" data-execution_count="1">
<details class="code-fold">
<summary>Show the Code</summary>
<div class="code-copy-outer-scaffold"><div class="sourceCode cell-code" id="cb1" style="background: #f1f3f5;"><pre class="sourceCode python code-with-copy"><code class="sourceCode python"><span id="cb1-1"><span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">from</span> great_tables <span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">import</span> GT</span>
<span id="cb1-2"><span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">from</span> great_tables.data <span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">import</span> gtcars</span>
<span id="cb1-3"><span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">import</span> polars <span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">as</span> pl</span>
<span id="cb1-4"></span>
<span id="cb1-5">gtcars_pl <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> (</span>
<span id="cb1-6">    pl.from_pandas(gtcars)</span>
<span id="cb1-7">    .select([<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"mfr"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"model"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"hp"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"trq"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"mpg_c"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"msrp"</span>])</span>
<span id="cb1-8">)</span>
<span id="cb1-9"></span>
<span id="cb1-10">gt_tbl <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> (</span>
<span id="cb1-11">    GT(</span>
<span id="cb1-12">        gtcars[[<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"mfr"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"model"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"hp"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"trq"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"msrp"</span>]].head(<span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">5</span>),</span>
<span id="cb1-13">    )</span>
<span id="cb1-14">    .tab_header(</span>
<span id="cb1-15">        title<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Some Cars from the gtcars Dataset"</span>,</span>
<span id="cb1-16">        subtitle<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Five Cars are shown here"</span></span>
<span id="cb1-17">    )</span>
<span id="cb1-18">    .tab_spanner(</span>
<span id="cb1-19">        label<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Make and Model"</span>,</span>
<span id="cb1-20">        columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>[<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"mfr"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"model"</span>],</span>
<span id="cb1-21">        <span class="bu" style="color: null;
background-color: null;
font-style: inherit;">id</span><span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"make_model"</span></span>
<span id="cb1-22">    )</span>
<span id="cb1-23">    .tab_spanner(</span>
<span id="cb1-24">        label<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Performance"</span>,</span>
<span id="cb1-25">        columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>[<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"hp"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"trq"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"msrp"</span>]</span>
<span id="cb1-26">    )</span>
<span id="cb1-27">    .tab_spanner(</span>
<span id="cb1-28">        label<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Everything but the cost"</span>,</span>
<span id="cb1-29">        columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>[<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"mfr"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"model"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"hp"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"trq"</span>]</span>
<span id="cb1-30">    )</span>
<span id="cb1-31">    .fmt_integer(columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>[<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"hp"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"trq"</span>])</span>
<span id="cb1-32">    .fmt_currency(columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"msrp"</span>)</span>
<span id="cb1-33">    .tab_source_note(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Cars are all 2015 models."</span>)</span>
<span id="cb1-34">    .tab_source_note(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Horsepower and Torque values are estimates."</span>)</span>
<span id="cb1-35">)</span>
<span id="cb1-36"></span>
<span id="cb1-37"><span class="bu" style="color: null;
background-color: null;
font-style: inherit;">print</span>(gt_tbl.as_latex())</span></code></pre></div></div>
</details>
</div>
<div class="code-copy-outer-scaffold"><div class="sourceCode" id="cb2" style="background: #f1f3f5;"><pre class="sourceCode numberSource latex number-lines code-with-copy"><code class="sourceCode latex"><span id="cb2-1"><span class="kw" style="color: #003B4F;
background-color: null;
font-weight: bold;
font-style: inherit;">\begin</span>{<span class="ex" style="color: null;
background-color: null;
font-style: inherit;">table</span>}</span>
<span id="cb2-2"><span class="fu" style="color: #4758AB;
background-color: null;
font-style: inherit;">\caption*</span>{</span>
<span id="cb2-3">{<span class="fu" style="color: #4758AB;
background-color: null;
font-style: inherit;">\large</span> Some Cars from the gtcars Dataset} <span class="fu" style="color: #4758AB;
background-color: null;
font-style: inherit;">\\</span></span>
<span id="cb2-4">{<span class="fu" style="color: #4758AB;
background-color: null;
font-style: inherit;">\small</span> Five Cars are shown here}</span>
<span id="cb2-5">}</span>
<span id="cb2-6"></span>
<span id="cb2-7"><span class="fu" style="color: #4758AB;
background-color: null;
font-style: inherit;">\fontsize</span>{12.0pt}{14.4pt}<span class="fu" style="color: #4758AB;
background-color: null;
font-style: inherit;">\selectfont</span></span>
<span id="cb2-8"></span>
<span id="cb2-9"><span class="kw" style="color: #003B4F;
background-color: null;
font-weight: bold;
font-style: inherit;">\begin</span>{<span class="ex" style="color: null;
background-color: null;
font-style: inherit;">tabular*</span>}{<span class="fu" style="color: #4758AB;
background-color: null;
font-style: inherit;">\linewidth</span>}{<span class="ch" style="color: #20794D;
background-color: null;
font-style: inherit;">@{\extracolsep{\fill}}</span>llrrr}</span>
<span id="cb2-10"><span class="fu" style="color: #4758AB;
background-color: null;
font-style: inherit;">\toprule</span></span>
<span id="cb2-11"><span class="fu" style="color: #4758AB;
background-color: null;
font-style: inherit;">\multicolumn</span>{4}{c}{Everything but the cost} <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">&amp;</span>  <span class="fu" style="color: #4758AB;
background-color: null;
font-style: inherit;">\\</span></span>
<span id="cb2-12"><span class="fu" style="color: #4758AB;
background-color: null;
font-style: inherit;">\cmidrule</span>(lr){1-4}</span>
<span id="cb2-13"><span class="fu" style="color: #4758AB;
background-color: null;
font-style: inherit;">\multicolumn</span>{2}{c}{Make and Model} <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">&amp;</span> <span class="fu" style="color: #4758AB;
background-color: null;
font-style: inherit;">\multicolumn</span>{3}{c}{Performance} <span class="fu" style="color: #4758AB;
background-color: null;
font-style: inherit;">\\</span></span>
<span id="cb2-14"><span class="fu" style="color: #4758AB;
background-color: null;
font-style: inherit;">\cmidrule</span>(lr){1-2} <span class="fu" style="color: #4758AB;
background-color: null;
font-style: inherit;">\cmidrule</span>(lr){3-5}</span>
<span id="cb2-15">mfr <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">&amp;</span> model <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">&amp;</span> hp <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">&amp;</span> trq <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">&amp;</span> msrp <span class="fu" style="color: #4758AB;
background-color: null;
font-style: inherit;">\\</span></span>
<span id="cb2-16"><span class="fu" style="color: #4758AB;
background-color: null;
font-style: inherit;">\midrule\addlinespace</span>[2.5pt]</span>
<span id="cb2-17">Ford <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">&amp;</span> GT <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">&amp;</span> 647 <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">&amp;</span> 550 <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">&amp;</span> <span class="fu" style="color: #4758AB;
background-color: null;
font-style: inherit;">\$</span>447,000.00 <span class="fu" style="color: #4758AB;
background-color: null;
font-style: inherit;">\\</span></span>
<span id="cb2-18">Ferrari <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">&amp;</span> 458 Speciale <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">&amp;</span> 597 <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">&amp;</span> 398 <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">&amp;</span> <span class="fu" style="color: #4758AB;
background-color: null;
font-style: inherit;">\$</span>291,744.00 <span class="fu" style="color: #4758AB;
background-color: null;
font-style: inherit;">\\</span></span>
<span id="cb2-19">Ferrari <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">&amp;</span> 458 Spider <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">&amp;</span> 562 <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">&amp;</span> 398 <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">&amp;</span> <span class="fu" style="color: #4758AB;
background-color: null;
font-style: inherit;">\$</span>263,553.00 <span class="fu" style="color: #4758AB;
background-color: null;
font-style: inherit;">\\</span></span>
<span id="cb2-20">Ferrari <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">&amp;</span> 458 Italia <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">&amp;</span> 562 <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">&amp;</span> 398 <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">&amp;</span> <span class="fu" style="color: #4758AB;
background-color: null;
font-style: inherit;">\$</span>233,509.00 <span class="fu" style="color: #4758AB;
background-color: null;
font-style: inherit;">\\</span></span>
<span id="cb2-21">Ferrari <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">&amp;</span> 488 GTB <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">&amp;</span> 661 <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">&amp;</span> 561 <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">&amp;</span> <span class="fu" style="color: #4758AB;
background-color: null;
font-style: inherit;">\$</span>245,400.00 <span class="fu" style="color: #4758AB;
background-color: null;
font-style: inherit;">\\</span></span>
<span id="cb2-22"><span class="fu" style="color: #4758AB;
background-color: null;
font-style: inherit;">\bottomrule</span></span>
<span id="cb2-23"><span class="kw" style="color: #003B4F;
background-color: null;
font-weight: bold;
font-style: inherit;">\end</span>{<span class="ex" style="color: null;
background-color: null;
font-style: inherit;">tabular*</span>}</span>
<span id="cb2-24"><span class="kw" style="color: #003B4F;
background-color: null;
font-weight: bold;
font-style: inherit;">\begin</span>{<span class="ex" style="color: null;
background-color: null;
font-style: inherit;">minipage</span>}{<span class="fu" style="color: #4758AB;
background-color: null;
font-style: inherit;">\linewidth</span>}</span>
<span id="cb2-25">Cars are all 2015 models.<span class="fu" style="color: #4758AB;
background-color: null;
font-style: inherit;">\\</span></span>
<span id="cb2-26">Horsepower and Torque values are estimates.<span class="fu" style="color: #4758AB;
background-color: null;
font-style: inherit;">\\</span></span>
<span id="cb2-27"><span class="kw" style="color: #003B4F;
background-color: null;
font-weight: bold;
font-style: inherit;">\end</span>{<span class="ex" style="color: null;
background-color: null;
font-style: inherit;">minipage</span>}</span>
<span id="cb2-28"><span class="kw" style="color: #003B4F;
background-color: null;
font-weight: bold;
font-style: inherit;">\end</span>{<span class="ex" style="color: null;
background-color: null;
font-style: inherit;">table</span>}</span></code></pre></div></div>
<p>The returned LaTeX table code shows how some of Great Tables’ structural components are represented in LaTeX. Note these three important pieces of LaTeX code:</p>
<ul>
<li><code>\caption*{</code> produces our title and subtitle (line 2)</li>
<li>the <code>\multicolumn{</code> statements produce spanners (i.e., labels on top of multiple column labels) (line 11)</li>
<li>the values in the data are escaped, using <code>\</code> (e.g., <code>\$</code> represents a literal dollar sign) (line 17)</li>
</ul>
<p>A frequent issue with any programmatic generation of LaTeX table code is LaTeX escaping. Not doing so can lead to LaTeX rendering errors, potentially breaking an entire publishing workflow. Great Tables will automatically escape characters in LaTeX, limiting such errors.</p>
</section>
<section id="using-latex-output-from-great-tables-in-quarto" class="level2">
<h2 class="anchored" data-anchor-id="using-latex-output-from-great-tables-in-quarto">Using LaTeX output from Great Tables in Quarto</h2>
<p>Producing LaTeX table code is especially handy when using <a href="https://quarto.org">Quarto</a> to generate PDF documents. Quarto is a tool for publishing documents, websites, books, etc., with an emphasis on running Python code. It uses the .qmd file format, which is a superset of Markdown (.md).</p>
<p>Here’s an example .qmd file with these pieces in place:</p>
<div class="code-copy-outer-scaffold"><div class="sourceCode" id="cb3" style="background: #f1f3f5;"><pre class="sourceCode markdown code-with-copy"><code class="sourceCode markdown"><span id="cb3-1"><span class="co" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">---</span></span>
<span id="cb3-2"><span class="an" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">format:</span><span class="co" style="color: #5E5E5E;
background-color: null;
font-style: inherit;"> pdf</span></span>
<span id="cb3-3"><span class="co" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">---</span></span>
<span id="cb3-4"></span>
<span id="cb3-5">Using Great Tables in a Quarto PDF document.</span>
<span id="cb3-6"></span>
<span id="cb3-7"><span class="in" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">```{python}</span></span>
<span id="cb3-8"><span class="co" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">#| output: asis</span></span>
<span id="cb3-9"></span>
<span id="cb3-10"><span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">from</span> great_tables <span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">import</span> GT, exibble</span>
<span id="cb3-11"></span>
<span id="cb3-12">gt_tbl <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> GT(exibble)</span>
<span id="cb3-13"></span>
<span id="cb3-14"><span class="bu" style="color: null;
background-color: null;
font-style: inherit;">print</span>(gt_tbl.as_latex())</span>
<span id="cb3-15"><span class="in" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">```</span></span></code></pre></div></div>
<p>Notice that in the .qmd above we needed to have the following pieces to generate a PDF:</p>
<ol type="1">
<li>set <code>"format: pdf"</code> in YAML header</li>
<li>set <code>"output: asis"</code> in the code cell that’s outputting LaTeX table code</li>
<li>use the <code>as_latex()</code> method on a GT object and <code>print()</code> the text</li>
</ol>
<p>The example above used a very simple table, but here’s the table from the previous example rendered to PDF in Quarto:</p>
<details>
<summary>
.qmd content
</summary>
<div class="code-copy-outer-scaffold"><div class="sourceCode" id="cb4" style="background: #f1f3f5;"><pre class="sourceCode markdown code-with-copy"><code class="sourceCode markdown"><span id="cb4-1"><span class="co" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">---</span></span>
<span id="cb4-2"><span class="an" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">format:</span><span class="co" style="color: #5E5E5E;
background-color: null;
font-style: inherit;"> pdf</span></span>
<span id="cb4-3"><span class="co" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">---</span></span>
<span id="cb4-4"></span>
<span id="cb4-5">Example using the <span class="in" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">`gtcars`</span> dataset.</span>
<span id="cb4-6"></span>
<span id="cb4-7"><span class="in" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">```{python}</span></span>
<span id="cb4-8"><span class="co" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">#| output: asis</span></span>
<span id="cb4-9"></span>
<span id="cb4-10"><span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">from</span> great_tables <span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">import</span> GT</span>
<span id="cb4-11"><span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">from</span> great_tables.data <span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">import</span> gtcars</span>
<span id="cb4-12"><span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">import</span> polars <span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">as</span> pl</span>
<span id="cb4-13"></span>
<span id="cb4-14">gtcars_pl <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> (</span>
<span id="cb4-15">    pl.from_pandas(gtcars)</span>
<span id="cb4-16">    .select([<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"mfr"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"model"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"hp"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"trq"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"mpg_c"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"msrp"</span>])</span>
<span id="cb4-17">)</span>
<span id="cb4-18"></span>
<span id="cb4-19">gt_tbl <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> (</span>
<span id="cb4-20">    GT(</span>
<span id="cb4-21">        gtcars[[<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"mfr"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"model"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"hp"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"trq"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"msrp"</span>]].head(<span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">5</span>),</span>
<span id="cb4-22">    )</span>
<span id="cb4-23">    .tab_header(</span>
<span id="cb4-24">        title<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Some Cars from the gtcars Dataset"</span>,</span>
<span id="cb4-25">        subtitle<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Five Cars are shown here"</span></span>
<span id="cb4-26">    )</span>
<span id="cb4-27">    .tab_spanner(</span>
<span id="cb4-28">        label<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Make and Model"</span>,</span>
<span id="cb4-29">        columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>[<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"mfr"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"model"</span>],</span>
<span id="cb4-30">        <span class="bu" style="color: null;
background-color: null;
font-style: inherit;">id</span><span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"make_model"</span></span>
<span id="cb4-31">    )</span>
<span id="cb4-32">    .tab_spanner(</span>
<span id="cb4-33">        label<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Performance"</span>,</span>
<span id="cb4-34">        columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>[<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"hp"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"trq"</span>]</span>
<span id="cb4-35">    )</span>
<span id="cb4-36">    .tab_spanner(</span>
<span id="cb4-37">        label<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Everything but the cost"</span>,</span>
<span id="cb4-38">        columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>[<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"mfr"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"model"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"hp"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"trq"</span>]</span>
<span id="cb4-39">    )</span>
<span id="cb4-40">    .fmt_integer(columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>[<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"hp"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"trq"</span>])</span>
<span id="cb4-41">    .fmt_currency(columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"msrp"</span>)</span>
<span id="cb4-42">    .tab_source_note(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Cars are all 2015 models."</span>)</span>
<span id="cb4-43">    .tab_source_note(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Horsepower and Torque values are estimates."</span>)</span>
<span id="cb4-44">    .tab_options(table_width<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"600pt"</span>)</span>
<span id="cb4-45">)</span>
<span id="cb4-46"></span>
<span id="cb4-47"><span class="bu" style="color: null;
background-color: null;
font-style: inherit;">print</span>(gt_tbl.as_latex())</span>
<span id="cb4-48"><span class="in" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">```</span></span></code></pre></div></div>
</details>
<p><img src="https://posit-dev.github.io/great-tables/blog/latex-output-tables/gtcars_latex_table.png" class="img-fluid"></p>
<p>If you’d like to experiment with Great Tables’ LaTeX rendering, you can get the text of a working .qmd file in the details below. Make sure your installation of Quarto is <a href="https://quarto.org/docs/get-started/">up to date</a> and that you have Great Tables upgraded to <code>v0.14.0</code>.</p>
</section>
<section id="current-limitations-of-latex-table-output" class="level2">
<h2 class="anchored" data-anchor-id="current-limitations-of-latex-table-output">Current limitations of LaTeX table output</h2>
<p>The <code>as_latex()</code> method is still experimental and has some limitations. The following table lists the work epics that have been done and those planned:</p>
<div id="49753a65" class="cell" data-execution_count="2">
<div class="cell-output cell-output-display" data-execution_count="1">
<div id="obaocheaul" style="padding-left:0px;padding-right:0px;padding-top:10px;padding-bottom:10px;overflow-x:auto;overflow-y:auto;width:auto;height:auto;">
<style>
@import url('https://fonts.googleapis.com/css2?family=Atkinson+Hyperlegible&display=swap');
#obaocheaul table {
          font-family: 'Atkinson Hyperlegible', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Helvetica Neue', 'Fira Sans', 'Droid Sans', Arial, sans-serif;
          -webkit-font-smoothing: antialiased;
          -moz-osx-font-smoothing: grayscale;
        }

#obaocheaul thead, tbody, tfoot, tr, td, th { border-style: none; }
 tr { background-color: transparent; }
#obaocheaul p { margin: 0; padding: 0; }
 #obaocheaul .gt_table { display: table; border-collapse: collapse; line-height: normal; margin-left: auto; margin-right: auto; color: #333333; font-size: 16px; font-weight: normal; font-style: normal; background-color: #FFFFFF; width: 450px; border-top-style: solid; border-top-width: 2px; border-top-color: #A8A8A8; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #A8A8A8; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; }
 #obaocheaul .gt_caption { padding-top: 4px; padding-bottom: 4px; }
 #obaocheaul .gt_title { color: #333333; font-size: 125%; font-weight: initial; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; border-bottom-color: #FFFFFF; border-bottom-width: 0; }
 #obaocheaul .gt_subtitle { color: #333333; font-size: 85%; font-weight: initial; padding-top: 3px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; border-top-color: #FFFFFF; border-top-width: 0; }
 #obaocheaul .gt_heading { background-color: #FFFFFF; text-align: center; border-bottom-color: #FFFFFF; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #obaocheaul .gt_bottom_border { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #obaocheaul .gt_col_headings { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #obaocheaul .gt_col_heading { color: #333333; background-color: #FFFFFF; font-size: 18px; font-weight: bolder; text-transform: uppercase; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; overflow-x: hidden; }
 #obaocheaul .gt_column_spanner_outer { color: #333333; background-color: #FFFFFF; font-size: 18px; font-weight: bolder; text-transform: uppercase; padding-top: 0; padding-bottom: 0; padding-left: 4px; padding-right: 4px; }
 #obaocheaul .gt_column_spanner_outer:first-child { padding-left: 0; }
 #obaocheaul .gt_column_spanner_outer:last-child { padding-right: 0; }
 #obaocheaul .gt_column_spanner { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; overflow-x: hidden; display: inline-block; width: 100%; }
 #obaocheaul .gt_spanner_row { border-bottom-style: hidden; }
 #obaocheaul .gt_group_heading { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; color: #333333; background-color: #FFFFFF; font-size: 80%; font-weight: bolder; text-transform: uppercase; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; text-align: left; }
 #obaocheaul .gt_empty_group_heading { padding: 0.5px; color: #333333; background-color: #FFFFFF; font-size: 80%; font-weight: bolder; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: middle; }
 #obaocheaul .gt_from_md> :first-child { margin-top: 0; }
 #obaocheaul .gt_from_md> :last-child { margin-bottom: 0; }
 #obaocheaul .gt_row { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; margin: 10px; border-top-style: solid; border-top-width: 1px; border-top-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; overflow-x: hidden; }
 #obaocheaul .gt_stub { color: #333333; background-color: #FFFFFF; font-size: 80%; font-weight: bolder; text-transform: uppercase; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; }
 #obaocheaul .gt_stub_row_group { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; vertical-align: top; }
 #obaocheaul .gt_row_group_first td { border-top-width: 2px; }
 #obaocheaul .gt_row_group_first th { border-top-width: 2px; }
 #obaocheaul .gt_striped { color: #333333; background-color: #F4F4F4; }
 #obaocheaul .gt_table_body { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #obaocheaul .gt_grand_summary_row { color: #333333; background-color: #FFFFFF; text-transform: inherit; padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; }
 #obaocheaul .gt_first_grand_summary_row_bottom { border-top-style: double; border-top-width: 6px; border-top-color: #D3D3D3; }
 #obaocheaul .gt_last_grand_summary_row_top { border-bottom-style: double; border-bottom-width: 6px; border-bottom-color: #D3D3D3; }
 #obaocheaul .gt_sourcenotes { color: #333333; background-color: #FFFFFF; border-bottom-style: none; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; }
 #obaocheaul .gt_sourcenote { font-size: 90%; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; text-align: left; }
 #obaocheaul .gt_left { text-align: left; }
 #obaocheaul .gt_center { text-align: center; }
 #obaocheaul .gt_right { text-align: right; font-variant-numeric: tabular-nums; }
 #obaocheaul .gt_font_normal { font-weight: normal; }
 #obaocheaul .gt_font_bold { font-weight: bold; }
 #obaocheaul .gt_font_italic { font-style: italic; }
 #obaocheaul .gt_super { font-size: 65%; }
 #obaocheaul .gt_footnote_marks { font-size: 75%; vertical-align: 0.4em; position: initial; }
 #obaocheaul .gt_asterisk { font-size: 100%; vertical-align: 0; }
 
</style>
<table class="gt_table" data-quarto-disable-processing="false" data-quarto-bootstrap="false">
<thead>

<tr class="gt_col_headings">
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="1" colspan="1" scope="col" id="LaTeX-Support">LaTeX Support</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_center" rowspan="1" colspan="1" scope="col" id="status">status</th>
</tr>
</thead>
<tbody class="gt_table_body">
  <tr>
    <td class="gt_row gt_left">Escaping</td>
    <td class="gt_row gt_center">✅</td>
  </tr>
  <tr>
    <td class="gt_row gt_left">Most <code>fmt_*()</code> methods</td>
    <td class="gt_row gt_center">✅</td>
  </tr>
  <tr>
    <td class="gt_row gt_left"><code>as_latex()</code> table code generation</td>
    <td class="gt_row gt_center">✅</td>
  </tr>
  <tr>
    <td class="gt_row gt_left"><code>tab_stub()</code> for row and group labels</td>
    <td class="gt_row gt_center">🚧</td>
  </tr>
  <tr>
    <td class="gt_row gt_left"><code>md()</code> to render Markdown to LaTeX</td>
    <td class="gt_row gt_center">🚧</td>
  </tr>
  <tr>
    <td class="gt_row gt_left">Implementation of Units Notation</td>
    <td class="gt_row gt_center">🚧</td>
  </tr>
  <tr>
    <td class="gt_row gt_left">Allow <code>fmt_markdown()</code>, <code>fmt_units()</code>, <code>fmt_image()</code>, and <code>fmt_nanoplot()</code></td>
    <td class="gt_row gt_center">🚧</td>
  </tr>
  <tr>
    <td class="gt_row gt_left"><code>sub_missing()</code> and <code>sub_zero()</code> methods</td>
    <td class="gt_row gt_center">🚧</td>
  </tr>
  <tr>
    <td class="gt_row gt_left"><code>tab_style()</code> method</td>
    <td class="gt_row gt_center">🚧</td>
  </tr>
</tbody>


</table>

</div>
</div>
</div>
<p>Some of these TODOs are short-term, notably the ones dealing with the use of the table stub and row groups. We plan to address this soon but having those structural components in a table currently will raise an error when using <code>as_latex()</code>.</p>
<p>We don’t yet see an obvious solution for Markdown-to-LaTeX conversion. We depend on the <code>commonmark</code> library to perform Markdown-to-HTML transformation but the library doesn’t support LaTeX output.</p>
<p>Styling a LaTeX table is currently not possible. Having a <code>tab_style()</code> statement in your GT code and subsequently using <code>as_latex()</code> won’t raise an error, but it will warn and essentially no-op. Many of the options available in <code>tab_options()</code> are those that perform styling</p>
<p>As development continues, we will work to expand the capabilities of the <code>as_latex()</code> method to reduce these limitations and more clearly document what is and is not supported.</p>
</section>
<section id="lets-latex" class="level2">
<h2 class="anchored" data-anchor-id="lets-latex">Let’s LaTeX!</h2>
<p>While this is an early preview of a new rendering capability in Great Tables, we are optimistic that it can be greatly improved in due course. If you’re experimenting with this feature, please let us know about any problems you bump into by using the Great Tables <a href="https://github.com/posit-dev/great-tables/issues">issue tracker</a>.</p>
<p>The goal is to make LaTeX output dependable, work within several common LaTeX-publishing workflows, and be fully featured enough to make this table-making route in LaTeX preferable to other solutions in this space.</p>


</section>

 ]]></description>
  <guid>https://posit-dev.github.io/great-tables/blog/latex-output-tables/</guid>
  <pubDate>Wed, 13 Nov 2024 00:00:00 GMT</pubDate>
</item>
<item>
  <title>Great Tables v0.13.0: Applying styles to all table locations</title>
  <dc:creator>Rich Iannone and Michael Chow</dc:creator>
  <link>https://posit-dev.github.io/great-tables/blog/introduction-0.13.0/</link>
  <description><![CDATA[ 




<p>We did something in Great Tables (<code>0.13.0</code>) that’ll make your tables that much more customizable: super <em>fine-grained</em> ways of setting styles throughout the table. Before you were largely constrained to styling through the following strategies:</p>
<ol type="1">
<li>use a limited set of styles (e.g., background color, font weight, etc.) to different table locations like the stub, the column labels, etc., through <code>tab_options()</code></li>
<li>use <code>tab_style()</code> with a larger set of styling options for the table body cells (specified by <a href="../../reference/loc.body.html#great_tables.loc.body" title="0"><code>loc.body()</code></a>)</li>
</ol>
<p>In <code>v0.13.0</code>, we can target much more than just the table body! Here is the expanded set of <code>loc.*()</code> methods along with the locations that they can target.</p>
<p><img src="https://posit-dev.github.io/great-tables/blog/introduction-0.13.0/GT-locations-map.png" class="img-fluid"></p>
<p>This augmentation of the <code>loc</code> module to include all locations in the table means that there won’t be a spot in the table to which you can’t add styling. This is terrific because it gives you free rein to fully customize the look of your table.</p>
<p>Let’s make a table and see how this new feature could be used.</p>
<section id="starting-things-off-with-a-big-gt-table" class="level3">
<h3 class="anchored" data-anchor-id="starting-things-off-with-a-big-gt-table">Starting things off with a big GT table</h3>
<p>The table we’ll make uses the <code>nuclides</code> dataset (available in the <code>great_tables.data</code> module). Through use of the <code>tab_*()</code> methods, quite a few table components (hence <em>locations</em>) will be added. We have hidden the code here because it is quite lengthy but you’re encouraged to check it out to glean some interesting GT tricks.</p>
<div id="c6236600" class="cell" data-execution_count="1">
<details class="code-fold">
<summary>Show the code</summary>
<div class="code-copy-outer-scaffold"><div class="sourceCode cell-code" id="cb1" style="background: #f1f3f5;"><pre class="sourceCode python code-with-copy"><code class="sourceCode python"><span id="cb1-1"><span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">from</span> great_tables <span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">import</span> GT, md, style, loc, google_font</span>
<span id="cb1-2"><span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">from</span> great_tables.data <span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">import</span> nuclides</span>
<span id="cb1-3"><span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">import</span> polars <span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">as</span> pl</span>
<span id="cb1-4"><span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">import</span> polars.selectors <span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">as</span> cs</span>
<span id="cb1-5"></span>
<span id="cb1-6">nuclides_mini <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> (</span>
<span id="cb1-7">    pl.from_pandas(nuclides)</span>
<span id="cb1-8">    .<span class="bu" style="color: null;
background-color: null;
font-style: inherit;">filter</span>(pl.col(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"element"</span>) <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">==</span> <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"C"</span>)</span>
<span id="cb1-9">    .with_columns(pl.col(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"nuclide"</span>).<span class="bu" style="color: null;
background-color: null;
font-style: inherit;">str</span>.replace(<span class="vs" style="color: #20794D;
background-color: null;
font-style: inherit;">r"</span><span class="pp" style="color: #AD0000;
background-color: null;
font-style: inherit;">[0-9]</span><span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">+</span><span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">$</span><span class="vs" style="color: #20794D;
background-color: null;
font-style: inherit;">"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">""</span>))</span>
<span id="cb1-10">    .with_columns(mass_number<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>pl.col(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"z"</span>) <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">+</span> pl.col(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"n"</span>))</span>
<span id="cb1-11">    .with_columns(</span>
<span id="cb1-12">        isotope<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>pl.concat_str(pl.col(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"element"</span>) <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">+</span> <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"-"</span> <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">+</span> pl.col(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"mass_number"</span>).cast(pl.String))</span>
<span id="cb1-13">    )</span>
<span id="cb1-14">    .select([<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"isotope"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"atomic_mass"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"half_life"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"isospin"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"decay_1"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"decay_2"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"decay_3"</span>])</span>
<span id="cb1-15">)</span>
<span id="cb1-16"></span>
<span id="cb1-17">gt_tbl <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> (</span>
<span id="cb1-18">    GT(nuclides_mini, rowname_col<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"isotope"</span>)</span>
<span id="cb1-19">    .tab_header(</span>
<span id="cb1-20">        title<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Isotopes of Carbon"</span>,</span>
<span id="cb1-21">        subtitle<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"There are two stable isotopes of carbon and twelve that are unstable."</span>,</span>
<span id="cb1-22">    )</span>
<span id="cb1-23">    .tab_spanner(label<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Decay Mode"</span>, columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>cs.starts_with(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"decay"</span>))</span>
<span id="cb1-24">    .tab_source_note(md(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Data obtained from the *nuclides* dataset."</span>))</span>
<span id="cb1-25">    .tab_stubhead(label<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Isotope"</span>)</span>
<span id="cb1-26">    .fmt_scientific(columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"half_life"</span>)</span>
<span id="cb1-27">    .fmt_number(</span>
<span id="cb1-28">        columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"atomic_mass"</span>,</span>
<span id="cb1-29">        decimals<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">4</span>,</span>
<span id="cb1-30">        scale_by<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">1</span> <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">/</span> <span class="fl" style="color: #AD0000;
background-color: null;
font-style: inherit;">1e6</span>,</span>
<span id="cb1-31">    )</span>
<span id="cb1-32">    .sub_missing(columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"half_life"</span>, missing_text<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>md(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"**STABLE**"</span>))</span>
<span id="cb1-33">    .sub_missing(columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>cs.starts_with(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"decay"</span>))</span>
<span id="cb1-34">    .cols_label(</span>
<span id="cb1-35">        atomic_mass<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Atomic Mass"</span>,</span>
<span id="cb1-36">        half_life<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Half Life, s"</span>,</span>
<span id="cb1-37">        isospin<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Isospin"</span>,</span>
<span id="cb1-38">        decay_1<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"1"</span>,</span>
<span id="cb1-39">        decay_2<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"2"</span>,</span>
<span id="cb1-40">        decay_3<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"3"</span>,</span>
<span id="cb1-41">    )</span>
<span id="cb1-42">    .cols_align(align<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"center"</span>, columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>[cs.starts_with(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"decay"</span>), <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"isospin"</span>])</span>
<span id="cb1-43">    .opt_align_table_header(align<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"left"</span>)</span>
<span id="cb1-44">    .opt_table_font(font<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>google_font(name<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"IBM Plex Sans"</span>))</span>
<span id="cb1-45">    .opt_vertical_padding(scale<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="fl" style="color: #AD0000;
background-color: null;
font-style: inherit;">0.5</span>)</span>
<span id="cb1-46">    .opt_horizontal_padding(scale<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">2</span>)</span>
<span id="cb1-47">)</span>
<span id="cb1-48"></span>
<span id="cb1-49">gt_tbl</span></code></pre></div></div>
</details>
<div class="cell-output cell-output-display" data-execution_count="1">
<div id="uzvnzugcwg" style="padding-left:0px;padding-right:0px;padding-top:10px;padding-bottom:10px;overflow-x:auto;overflow-y:auto;width:auto;height:auto;">
<style>
@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans&display=swap');
#uzvnzugcwg table {
          font-family: 'IBM Plex Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Helvetica Neue', 'Fira Sans', 'Droid Sans', Arial, sans-serif;
          -webkit-font-smoothing: antialiased;
          -moz-osx-font-smoothing: grayscale;
        }

#uzvnzugcwg thead, tbody, tfoot, tr, td, th { border-style: none; }
 tr { background-color: transparent; }
#uzvnzugcwg p { margin: 0; padding: 0; }
 #uzvnzugcwg .gt_table { display: table; border-collapse: collapse; line-height: normal; margin-left: auto; margin-right: auto; color: #333333; font-size: 16px; font-weight: normal; font-style: normal; background-color: #FFFFFF; width: auto; border-top-style: solid; border-top-width: 2px; border-top-color: #A8A8A8; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #A8A8A8; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; }
 #uzvnzugcwg .gt_caption { padding-top: 4px; padding-bottom: 4px; }
 #uzvnzugcwg .gt_title { color: #333333; font-size: 125%; font-weight: initial; padding-top: 2px; padding-bottom: 2px; padding-left: 10px; padding-right: 10px; border-bottom-color: #FFFFFF; border-bottom-width: 0; }
 #uzvnzugcwg .gt_subtitle { color: #333333; font-size: 85%; font-weight: initial; padding-top: 1px; padding-bottom: 3px; padding-left: 10px; padding-right: 10px; border-top-color: #FFFFFF; border-top-width: 0; }
 #uzvnzugcwg .gt_heading { background-color: #FFFFFF; text-align: left; border-bottom-color: #FFFFFF; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #uzvnzugcwg .gt_bottom_border { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #uzvnzugcwg .gt_col_headings { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #uzvnzugcwg .gt_col_heading { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: bottom; padding-top: 2px; padding-bottom: 3px; padding-left: 10px; padding-right: 10px; overflow-x: hidden; }
 #uzvnzugcwg .gt_column_spanner_outer { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; padding-top: 0; padding-bottom: 0; padding-left: 4px; padding-right: 4px; }
 #uzvnzugcwg .gt_column_spanner_outer:first-child { padding-left: 0; }
 #uzvnzugcwg .gt_column_spanner_outer:last-child { padding-right: 0; }
 #uzvnzugcwg .gt_column_spanner { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: bottom; padding-top: 2px; padding-bottom: 2px; overflow-x: hidden; display: inline-block; width: 100%; }
 #uzvnzugcwg .gt_spanner_row { border-bottom-style: hidden; }
 #uzvnzugcwg .gt_group_heading { padding-top: 4px; padding-bottom: 4px; padding-left: 10px; padding-right: 10px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; text-align: left; }
 #uzvnzugcwg .gt_empty_group_heading { padding: 0.5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: middle; }
 #uzvnzugcwg .gt_from_md> :first-child { margin-top: 0; }
 #uzvnzugcwg .gt_from_md> :last-child { margin-bottom: 0; }
 #uzvnzugcwg .gt_row { padding-top: 4px; padding-bottom: 4px; padding-left: 10px; padding-right: 10px; margin: 10px; border-top-style: solid; border-top-width: 1px; border-top-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; overflow-x: hidden; }
 #uzvnzugcwg .gt_stub { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 10px; padding-right: 10px; }
 #uzvnzugcwg .gt_stub_row_group { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 10px; padding-right: 10px; vertical-align: top; }
 #uzvnzugcwg .gt_row_group_first td { border-top-width: 2px; }
 #uzvnzugcwg .gt_row_group_first th { border-top-width: 2px; }
 #uzvnzugcwg .gt_striped { color: #333333; background-color: #F4F4F4; }
 #uzvnzugcwg .gt_table_body { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #uzvnzugcwg .gt_grand_summary_row { color: #333333; background-color: #FFFFFF; text-transform: inherit; padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; }
 #uzvnzugcwg .gt_first_grand_summary_row_bottom { border-top-style: double; border-top-width: 6px; border-top-color: #D3D3D3; }
 #uzvnzugcwg .gt_last_grand_summary_row_top { border-bottom-style: double; border-bottom-width: 6px; border-bottom-color: #D3D3D3; }
 #uzvnzugcwg .gt_sourcenotes { color: #333333; background-color: #FFFFFF; border-bottom-style: none; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; }
 #uzvnzugcwg .gt_sourcenote { font-size: 90%; padding-top: 2px; padding-bottom: 2px; padding-left: 10px; padding-right: 10px; text-align: left; }
 #uzvnzugcwg .gt_left { text-align: left; }
 #uzvnzugcwg .gt_center { text-align: center; }
 #uzvnzugcwg .gt_right { text-align: right; font-variant-numeric: tabular-nums; }
 #uzvnzugcwg .gt_font_normal { font-weight: normal; }
 #uzvnzugcwg .gt_font_bold { font-weight: bold; }
 #uzvnzugcwg .gt_font_italic { font-style: italic; }
 #uzvnzugcwg .gt_super { font-size: 65%; }
 #uzvnzugcwg .gt_footnote_marks { font-size: 75%; vertical-align: 0.4em; position: initial; }
 #uzvnzugcwg .gt_asterisk { font-size: 100%; vertical-align: 0; }
 
</style>
<table class="gt_table" data-quarto-disable-processing="false" data-quarto-bootstrap="false">
<thead>

  <tr class="gt_heading">
    <td colspan="7" class="gt_heading gt_title gt_font_normal">Isotopes of Carbon</td>
  </tr>
  <tr class="gt_heading">
    <td colspan="7" class="gt_heading gt_subtitle gt_font_normal gt_bottom_border">There are two stable isotopes of carbon and twelve that are unstable.</td>
  </tr>
<tr class="gt_col_headings gt_spanner_row">
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="2" colspan="1" scope="col" id="Isotope">Isotope</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="2" colspan="1" scope="col" id="atomic_mass">Atomic Mass</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="2" colspan="1" scope="col" id="half_life">Half Life, s</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_center" rowspan="2" colspan="1" scope="col" id="isospin">Isospin</th>
  <th class="gt_center gt_columns_top_border gt_column_spanner_outer" rowspan="1" colspan="3" scope="colgroup" id="Decay-Mode">
    <span class="gt_column_spanner">Decay Mode</span>
  </th>
</tr>
<tr class="gt_col_headings">
  <th class="gt_col_heading gt_columns_bottom_border gt_center" rowspan="1" colspan="1" scope="col" id="decay_1">1</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_center" rowspan="1" colspan="1" scope="col" id="decay_2">2</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_center" rowspan="1" colspan="1" scope="col" id="decay_3">3</th>
</tr>
</thead>
<tbody class="gt_table_body">
  <tr>
    <th class="gt_row gt_left gt_stub">C-8</th>
    <td class="gt_row gt_right">8.0376</td>
    <td class="gt_row gt_right">3.51 × 10<sup style="font-size: 65%;">−21</sup></td>
    <td class="gt_row gt_center">2</td>
    <td class="gt_row gt_center">2P</td>
    <td class="gt_row gt_center">—</td>
    <td class="gt_row gt_center">—</td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">C-9</th>
    <td class="gt_row gt_right">9.0310</td>
    <td class="gt_row gt_right">1.26 × 10<sup style="font-size: 65%;">−1</sup></td>
    <td class="gt_row gt_center">3/2</td>
    <td class="gt_row gt_center">EC+B+</td>
    <td class="gt_row gt_center">B+P</td>
    <td class="gt_row gt_center">B+A</td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">C-10</th>
    <td class="gt_row gt_right">10.0169</td>
    <td class="gt_row gt_right">1.93 × 10<sup style="font-size: 65%;">1</sup></td>
    <td class="gt_row gt_center">1</td>
    <td class="gt_row gt_center">EC+B+</td>
    <td class="gt_row gt_center">—</td>
    <td class="gt_row gt_center">—</td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">C-11</th>
    <td class="gt_row gt_right">11.0114</td>
    <td class="gt_row gt_right">1.22 × 10<sup style="font-size: 65%;">3</sup></td>
    <td class="gt_row gt_center">1/2</td>
    <td class="gt_row gt_center">EC+B+</td>
    <td class="gt_row gt_center">—</td>
    <td class="gt_row gt_center">—</td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">C-12</th>
    <td class="gt_row gt_right">12.0000</td>
    <td class="gt_row gt_right"><strong>STABLE</strong></td>
    <td class="gt_row gt_center">0</td>
    <td class="gt_row gt_center">—</td>
    <td class="gt_row gt_center">—</td>
    <td class="gt_row gt_center">—</td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">C-13</th>
    <td class="gt_row gt_right">13.0034</td>
    <td class="gt_row gt_right"><strong>STABLE</strong></td>
    <td class="gt_row gt_center">1/2</td>
    <td class="gt_row gt_center">—</td>
    <td class="gt_row gt_center">—</td>
    <td class="gt_row gt_center">—</td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">C-14</th>
    <td class="gt_row gt_right">14.0032</td>
    <td class="gt_row gt_right">1.80 × 10<sup style="font-size: 65%;">11</sup></td>
    <td class="gt_row gt_center">1</td>
    <td class="gt_row gt_center">B-</td>
    <td class="gt_row gt_center">—</td>
    <td class="gt_row gt_center">—</td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">C-15</th>
    <td class="gt_row gt_right">15.0106</td>
    <td class="gt_row gt_right">2.45</td>
    <td class="gt_row gt_center">3/2</td>
    <td class="gt_row gt_center">B-</td>
    <td class="gt_row gt_center">—</td>
    <td class="gt_row gt_center">—</td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">C-16</th>
    <td class="gt_row gt_right">16.0147</td>
    <td class="gt_row gt_right">7.47 × 10<sup style="font-size: 65%;">−1</sup></td>
    <td class="gt_row gt_center">2</td>
    <td class="gt_row gt_center">B-</td>
    <td class="gt_row gt_center">B-N</td>
    <td class="gt_row gt_center">—</td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">C-17</th>
    <td class="gt_row gt_right">17.0226</td>
    <td class="gt_row gt_right">1.93 × 10<sup style="font-size: 65%;">−1</sup></td>
    <td class="gt_row gt_center">None</td>
    <td class="gt_row gt_center">B-</td>
    <td class="gt_row gt_center">B-N</td>
    <td class="gt_row gt_center">—</td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">C-18</th>
    <td class="gt_row gt_right">18.0268</td>
    <td class="gt_row gt_right">9.20 × 10<sup style="font-size: 65%;">−2</sup></td>
    <td class="gt_row gt_center">3</td>
    <td class="gt_row gt_center">B-</td>
    <td class="gt_row gt_center">B-N</td>
    <td class="gt_row gt_center">—</td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">C-19</th>
    <td class="gt_row gt_right">19.0348</td>
    <td class="gt_row gt_right">4.63 × 10<sup style="font-size: 65%;">−2</sup></td>
    <td class="gt_row gt_center">None</td>
    <td class="gt_row gt_center">B-</td>
    <td class="gt_row gt_center">B-N</td>
    <td class="gt_row gt_center">B-2N</td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">C-20</th>
    <td class="gt_row gt_right">20.0403</td>
    <td class="gt_row gt_right">1.63 × 10<sup style="font-size: 65%;">−2</sup></td>
    <td class="gt_row gt_center">None</td>
    <td class="gt_row gt_center">B-</td>
    <td class="gt_row gt_center">B-N</td>
    <td class="gt_row gt_center">B-2N</td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">C-22</th>
    <td class="gt_row gt_right">22.0576</td>
    <td class="gt_row gt_right">6.10 × 10<sup style="font-size: 65%;">−3</sup></td>
    <td class="gt_row gt_center">None</td>
    <td class="gt_row gt_center">B-</td>
    <td class="gt_row gt_center">B-N</td>
    <td class="gt_row gt_center">B-2N</td>
  </tr>
</tbody>
  <tfoot class="gt_sourcenotes">
  
  <tr>
    <td class="gt_sourcenote" colspan="7">Data obtained from the <em>nuclides</em> dataset.</td>
  </tr>

</tfoot>

</table>

</div>
</div>
</div>
<p>This table will serve as a great starting point for demonstrating all the things you can now do with <code>tab_style()</code>. And the following checklist will serve as a rough plan for how we will style the table:</p>
<ul>
<li>use <a href="../../reference/loc.body.html#great_tables.loc.body" title="0"><code>loc.body()</code></a> to emphasize isotope half-life values</li>
<li>employ <a href="../../reference/loc.stub.html#great_tables.loc.stub" title="0"><code>loc.stub()</code></a> to draw attention to isotope names (and also point out the ‘STABLE’ rows)</li>
<li>use <a href="../../reference/style.css.html#great_tables.style.css" title="0"><code>style.css()</code></a> for creating custom CSS styles (e.g., to indent row labels for stable isotopes)</li>
<li>work with composite locations and style the whole header and footer quite simply</li>
<li>set the default table body fill with <code>tab_options()</code></li>
</ul>
<p>Really this’ll be <code>tab_style()</code> like you’ve never seen it before, so let’s get on with it.</p>
</section>
<section id="styling-the-body" class="level3">
<h3 class="anchored" data-anchor-id="styling-the-body">Styling the body</h3>
<p>First, we’ll use <a href="../../reference/loc.body.html#great_tables.loc.body" title="0"><code>loc.body()</code></a> to emphasize half life values in two ways:</p>
<ul>
<li>Make the values in the <code>atomic_mass</code> and <code>half_life</code> use a monospace font.</li>
<li>fill the background of isotopes with STABLE half lives to be PaleTurquoise.</li>
</ul>
<div id="a3b5a82b" class="cell" data-execution_count="2">
<div class="code-copy-outer-scaffold"><div class="sourceCode cell-code" id="cb2" style="background: #f1f3f5;"><pre class="sourceCode python code-with-copy"><code class="sourceCode python"><span id="cb2-1">gt_tbl <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> (</span>
<span id="cb2-2">    gt_tbl</span>
<span id="cb2-3">    .tab_style(</span>
<span id="cb2-4">        style<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>style.text(font<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>google_font(name<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"IBM Plex Mono"</span>)),</span>
<span id="cb2-5">        locations<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>loc.body(columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>[<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"atomic_mass"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"half_life"</span>])</span>
<span id="cb2-6">    )</span>
<span id="cb2-7">    .tab_style(</span>
<span id="cb2-8">        style<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>[style.text(color<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Navy"</span>), style.fill(color<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"PaleTurquoise"</span>)],</span>
<span id="cb2-9">        locations<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>loc.body(columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"half_life"</span>, rows<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>pl.col(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"half_life"</span>).is_not_null())</span>
<span id="cb2-10">    )</span>
<span id="cb2-11">)</span>
<span id="cb2-12"></span>
<span id="cb2-13">gt_tbl</span></code></pre></div></div>
<div class="cell-output cell-output-display" data-execution_count="2">
<div id="xmzmlejapr" style="padding-left:0px;padding-right:0px;padding-top:10px;padding-bottom:10px;overflow-x:auto;overflow-y:auto;width:auto;height:auto;">
<style>
@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Mono&display=swap');
@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans&display=swap');
#xmzmlejapr table {
          font-family: 'IBM Plex Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Helvetica Neue', 'Fira Sans', 'Droid Sans', Arial, sans-serif;
          -webkit-font-smoothing: antialiased;
          -moz-osx-font-smoothing: grayscale;
        }

#xmzmlejapr thead, tbody, tfoot, tr, td, th { border-style: none; }
 tr { background-color: transparent; }
#xmzmlejapr p { margin: 0; padding: 0; }
 #xmzmlejapr .gt_table { display: table; border-collapse: collapse; line-height: normal; margin-left: auto; margin-right: auto; color: #333333; font-size: 16px; font-weight: normal; font-style: normal; background-color: #FFFFFF; width: auto; border-top-style: solid; border-top-width: 2px; border-top-color: #A8A8A8; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #A8A8A8; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; }
 #xmzmlejapr .gt_caption { padding-top: 4px; padding-bottom: 4px; }
 #xmzmlejapr .gt_title { color: #333333; font-size: 125%; font-weight: initial; padding-top: 2px; padding-bottom: 2px; padding-left: 10px; padding-right: 10px; border-bottom-color: #FFFFFF; border-bottom-width: 0; }
 #xmzmlejapr .gt_subtitle { color: #333333; font-size: 85%; font-weight: initial; padding-top: 1px; padding-bottom: 3px; padding-left: 10px; padding-right: 10px; border-top-color: #FFFFFF; border-top-width: 0; }
 #xmzmlejapr .gt_heading { background-color: #FFFFFF; text-align: left; border-bottom-color: #FFFFFF; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #xmzmlejapr .gt_bottom_border { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #xmzmlejapr .gt_col_headings { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #xmzmlejapr .gt_col_heading { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: bottom; padding-top: 2px; padding-bottom: 3px; padding-left: 10px; padding-right: 10px; overflow-x: hidden; }
 #xmzmlejapr .gt_column_spanner_outer { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; padding-top: 0; padding-bottom: 0; padding-left: 4px; padding-right: 4px; }
 #xmzmlejapr .gt_column_spanner_outer:first-child { padding-left: 0; }
 #xmzmlejapr .gt_column_spanner_outer:last-child { padding-right: 0; }
 #xmzmlejapr .gt_column_spanner { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: bottom; padding-top: 2px; padding-bottom: 2px; overflow-x: hidden; display: inline-block; width: 100%; }
 #xmzmlejapr .gt_spanner_row { border-bottom-style: hidden; }
 #xmzmlejapr .gt_group_heading { padding-top: 4px; padding-bottom: 4px; padding-left: 10px; padding-right: 10px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; text-align: left; }
 #xmzmlejapr .gt_empty_group_heading { padding: 0.5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: middle; }
 #xmzmlejapr .gt_from_md> :first-child { margin-top: 0; }
 #xmzmlejapr .gt_from_md> :last-child { margin-bottom: 0; }
 #xmzmlejapr .gt_row { padding-top: 4px; padding-bottom: 4px; padding-left: 10px; padding-right: 10px; margin: 10px; border-top-style: solid; border-top-width: 1px; border-top-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; overflow-x: hidden; }
 #xmzmlejapr .gt_stub { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 10px; padding-right: 10px; }
 #xmzmlejapr .gt_stub_row_group { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 10px; padding-right: 10px; vertical-align: top; }
 #xmzmlejapr .gt_row_group_first td { border-top-width: 2px; }
 #xmzmlejapr .gt_row_group_first th { border-top-width: 2px; }
 #xmzmlejapr .gt_striped { color: #333333; background-color: #F4F4F4; }
 #xmzmlejapr .gt_table_body { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #xmzmlejapr .gt_grand_summary_row { color: #333333; background-color: #FFFFFF; text-transform: inherit; padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; }
 #xmzmlejapr .gt_first_grand_summary_row_bottom { border-top-style: double; border-top-width: 6px; border-top-color: #D3D3D3; }
 #xmzmlejapr .gt_last_grand_summary_row_top { border-bottom-style: double; border-bottom-width: 6px; border-bottom-color: #D3D3D3; }
 #xmzmlejapr .gt_sourcenotes { color: #333333; background-color: #FFFFFF; border-bottom-style: none; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; }
 #xmzmlejapr .gt_sourcenote { font-size: 90%; padding-top: 2px; padding-bottom: 2px; padding-left: 10px; padding-right: 10px; text-align: left; }
 #xmzmlejapr .gt_left { text-align: left; }
 #xmzmlejapr .gt_center { text-align: center; }
 #xmzmlejapr .gt_right { text-align: right; font-variant-numeric: tabular-nums; }
 #xmzmlejapr .gt_font_normal { font-weight: normal; }
 #xmzmlejapr .gt_font_bold { font-weight: bold; }
 #xmzmlejapr .gt_font_italic { font-style: italic; }
 #xmzmlejapr .gt_super { font-size: 65%; }
 #xmzmlejapr .gt_footnote_marks { font-size: 75%; vertical-align: 0.4em; position: initial; }
 #xmzmlejapr .gt_asterisk { font-size: 100%; vertical-align: 0; }
 
</style>
<table class="gt_table" data-quarto-disable-processing="false" data-quarto-bootstrap="false">
<thead>

  <tr class="gt_heading">
    <td colspan="7" class="gt_heading gt_title gt_font_normal">Isotopes of Carbon</td>
  </tr>
  <tr class="gt_heading">
    <td colspan="7" class="gt_heading gt_subtitle gt_font_normal gt_bottom_border">There are two stable isotopes of carbon and twelve that are unstable.</td>
  </tr>
<tr class="gt_col_headings gt_spanner_row">
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="2" colspan="1" scope="col" id="Isotope">Isotope</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="2" colspan="1" scope="col" id="atomic_mass">Atomic Mass</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="2" colspan="1" scope="col" id="half_life">Half Life, s</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_center" rowspan="2" colspan="1" scope="col" id="isospin">Isospin</th>
  <th class="gt_center gt_columns_top_border gt_column_spanner_outer" rowspan="1" colspan="3" scope="colgroup" id="Decay-Mode">
    <span class="gt_column_spanner">Decay Mode</span>
  </th>
</tr>
<tr class="gt_col_headings">
  <th class="gt_col_heading gt_columns_bottom_border gt_center" rowspan="1" colspan="1" scope="col" id="decay_1">1</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_center" rowspan="1" colspan="1" scope="col" id="decay_2">2</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_center" rowspan="1" colspan="1" scope="col" id="decay_3">3</th>
</tr>
</thead>
<tbody class="gt_table_body">
  <tr>
    <th class="gt_row gt_left gt_stub">C-8</th>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">8.0376</td>
    <td style="font-family: IBM Plex Mono; color: Navy; background-color: PaleTurquoise;" class="gt_row gt_right">3.51 × 10<sup style="font-size: 65%;">−21</sup></td>
    <td class="gt_row gt_center">2</td>
    <td class="gt_row gt_center">2P</td>
    <td class="gt_row gt_center">—</td>
    <td class="gt_row gt_center">—</td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">C-9</th>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">9.0310</td>
    <td style="font-family: IBM Plex Mono; color: Navy; background-color: PaleTurquoise;" class="gt_row gt_right">1.26 × 10<sup style="font-size: 65%;">−1</sup></td>
    <td class="gt_row gt_center">3/2</td>
    <td class="gt_row gt_center">EC+B+</td>
    <td class="gt_row gt_center">B+P</td>
    <td class="gt_row gt_center">B+A</td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">C-10</th>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">10.0169</td>
    <td style="font-family: IBM Plex Mono; color: Navy; background-color: PaleTurquoise;" class="gt_row gt_right">1.93 × 10<sup style="font-size: 65%;">1</sup></td>
    <td class="gt_row gt_center">1</td>
    <td class="gt_row gt_center">EC+B+</td>
    <td class="gt_row gt_center">—</td>
    <td class="gt_row gt_center">—</td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">C-11</th>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">11.0114</td>
    <td style="font-family: IBM Plex Mono; color: Navy; background-color: PaleTurquoise;" class="gt_row gt_right">1.22 × 10<sup style="font-size: 65%;">3</sup></td>
    <td class="gt_row gt_center">1/2</td>
    <td class="gt_row gt_center">EC+B+</td>
    <td class="gt_row gt_center">—</td>
    <td class="gt_row gt_center">—</td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">C-12</th>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">12.0000</td>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right"><strong>STABLE</strong></td>
    <td class="gt_row gt_center">0</td>
    <td class="gt_row gt_center">—</td>
    <td class="gt_row gt_center">—</td>
    <td class="gt_row gt_center">—</td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">C-13</th>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">13.0034</td>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right"><strong>STABLE</strong></td>
    <td class="gt_row gt_center">1/2</td>
    <td class="gt_row gt_center">—</td>
    <td class="gt_row gt_center">—</td>
    <td class="gt_row gt_center">—</td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">C-14</th>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">14.0032</td>
    <td style="font-family: IBM Plex Mono; color: Navy; background-color: PaleTurquoise;" class="gt_row gt_right">1.80 × 10<sup style="font-size: 65%;">11</sup></td>
    <td class="gt_row gt_center">1</td>
    <td class="gt_row gt_center">B-</td>
    <td class="gt_row gt_center">—</td>
    <td class="gt_row gt_center">—</td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">C-15</th>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">15.0106</td>
    <td style="font-family: IBM Plex Mono; color: Navy; background-color: PaleTurquoise;" class="gt_row gt_right">2.45</td>
    <td class="gt_row gt_center">3/2</td>
    <td class="gt_row gt_center">B-</td>
    <td class="gt_row gt_center">—</td>
    <td class="gt_row gt_center">—</td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">C-16</th>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">16.0147</td>
    <td style="font-family: IBM Plex Mono; color: Navy; background-color: PaleTurquoise;" class="gt_row gt_right">7.47 × 10<sup style="font-size: 65%;">−1</sup></td>
    <td class="gt_row gt_center">2</td>
    <td class="gt_row gt_center">B-</td>
    <td class="gt_row gt_center">B-N</td>
    <td class="gt_row gt_center">—</td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">C-17</th>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">17.0226</td>
    <td style="font-family: IBM Plex Mono; color: Navy; background-color: PaleTurquoise;" class="gt_row gt_right">1.93 × 10<sup style="font-size: 65%;">−1</sup></td>
    <td class="gt_row gt_center">None</td>
    <td class="gt_row gt_center">B-</td>
    <td class="gt_row gt_center">B-N</td>
    <td class="gt_row gt_center">—</td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">C-18</th>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">18.0268</td>
    <td style="font-family: IBM Plex Mono; color: Navy; background-color: PaleTurquoise;" class="gt_row gt_right">9.20 × 10<sup style="font-size: 65%;">−2</sup></td>
    <td class="gt_row gt_center">3</td>
    <td class="gt_row gt_center">B-</td>
    <td class="gt_row gt_center">B-N</td>
    <td class="gt_row gt_center">—</td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">C-19</th>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">19.0348</td>
    <td style="font-family: IBM Plex Mono; color: Navy; background-color: PaleTurquoise;" class="gt_row gt_right">4.63 × 10<sup style="font-size: 65%;">−2</sup></td>
    <td class="gt_row gt_center">None</td>
    <td class="gt_row gt_center">B-</td>
    <td class="gt_row gt_center">B-N</td>
    <td class="gt_row gt_center">B-2N</td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">C-20</th>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">20.0403</td>
    <td style="font-family: IBM Plex Mono; color: Navy; background-color: PaleTurquoise;" class="gt_row gt_right">1.63 × 10<sup style="font-size: 65%;">−2</sup></td>
    <td class="gt_row gt_center">None</td>
    <td class="gt_row gt_center">B-</td>
    <td class="gt_row gt_center">B-N</td>
    <td class="gt_row gt_center">B-2N</td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">C-22</th>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">22.0576</td>
    <td style="font-family: IBM Plex Mono; color: Navy; background-color: PaleTurquoise;" class="gt_row gt_right">6.10 × 10<sup style="font-size: 65%;">−3</sup></td>
    <td class="gt_row gt_center">None</td>
    <td class="gt_row gt_center">B-</td>
    <td class="gt_row gt_center">B-N</td>
    <td class="gt_row gt_center">B-2N</td>
  </tr>
</tbody>
  <tfoot class="gt_sourcenotes">
  
  <tr>
    <td class="gt_sourcenote" colspan="7">Data obtained from the <em>nuclides</em> dataset.</td>
  </tr>

</tfoot>

</table>

</div>
</div>
</div>
<p>Note these important pieces in the code:</p>
<ul>
<li>setting monospace font: we used <a href="../../reference/google_font.html"><span><code>google_font()</code></span></a> (added in the previous release) to apply the monospaced font IBM Plex Mono.</li>
<li>filling unstable half lives to turquoise: because the half life cells with the value STABLE are actually missing in the underlying data, and filled in using <a href="../../reference/GT.sub_missing.html#great_tables.GT.sub_missing" title="0"><code>GT.sub_missing()</code></a>, we used the polars expression <code>pl.col("half_life").is_not_null()</code> to target everything that isn’t STABLE.</li>
</ul>
<p>This is mainly a reminder that Polars expressions are quite something. And targeting cells in the body with <code>loc.body(rows=...)</code> can be powerful by extension.</p>
</section>
<section id="dont-forget-the-stub" class="level3">
<h3 class="anchored" data-anchor-id="dont-forget-the-stub">Don’t forget the stub!</h3>
<p>We mustn’t forget the stub. It’s a totally separate location, being off to the side and having the important responsibility of holding the row labels. Here, we are going to do two things:</p>
<ol type="1">
<li>Change the fill color (to ‘Linen’) and make the text bold for the <em>entire stub</em></li>
<li>Highlight the rows where we have stable isotopes (the extent is both for the stub and the body cells)</li>
</ol>
<div id="d1501c7b" class="cell" data-execution_count="3">
<div class="code-copy-outer-scaffold"><div class="sourceCode cell-code" id="cb3" style="background: #f1f3f5;"><pre class="sourceCode python code-with-copy"><code class="sourceCode python"><span id="cb3-1">gt_tbl <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> (</span>
<span id="cb3-2">    gt_tbl</span>
<span id="cb3-3">    .tab_style(</span>
<span id="cb3-4">        style<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>[style.fill(color<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Linen"</span>), style.text(weight<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"bold"</span>)],</span>
<span id="cb3-5">        locations<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>loc.stub()</span>
<span id="cb3-6">    )</span>
<span id="cb3-7">    .tab_style(</span>
<span id="cb3-8">        style<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>style.fill(color<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"LightCyan"</span>),</span>
<span id="cb3-9">        locations<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>[</span>
<span id="cb3-10">            loc.body(rows<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>pl.col(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"half_life"</span>).is_null()),</span>
<span id="cb3-11">            loc.stub(rows<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>pl.col(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"half_life"</span>).is_null())</span>
<span id="cb3-12">        ]</span>
<span id="cb3-13">    )</span>
<span id="cb3-14"> )</span>
<span id="cb3-15"></span>
<span id="cb3-16">gt_tbl</span></code></pre></div></div>
<div class="cell-output cell-output-display" data-execution_count="3">
<div id="obudsrvlaq" style="padding-left:0px;padding-right:0px;padding-top:10px;padding-bottom:10px;overflow-x:auto;overflow-y:auto;width:auto;height:auto;">
<style>
@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Mono&display=swap');
@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans&display=swap');
#obudsrvlaq table {
          font-family: 'IBM Plex Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Helvetica Neue', 'Fira Sans', 'Droid Sans', Arial, sans-serif;
          -webkit-font-smoothing: antialiased;
          -moz-osx-font-smoothing: grayscale;
        }

#obudsrvlaq thead, tbody, tfoot, tr, td, th { border-style: none; }
 tr { background-color: transparent; }
#obudsrvlaq p { margin: 0; padding: 0; }
 #obudsrvlaq .gt_table { display: table; border-collapse: collapse; line-height: normal; margin-left: auto; margin-right: auto; color: #333333; font-size: 16px; font-weight: normal; font-style: normal; background-color: #FFFFFF; width: auto; border-top-style: solid; border-top-width: 2px; border-top-color: #A8A8A8; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #A8A8A8; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; }
 #obudsrvlaq .gt_caption { padding-top: 4px; padding-bottom: 4px; }
 #obudsrvlaq .gt_title { color: #333333; font-size: 125%; font-weight: initial; padding-top: 2px; padding-bottom: 2px; padding-left: 10px; padding-right: 10px; border-bottom-color: #FFFFFF; border-bottom-width: 0; }
 #obudsrvlaq .gt_subtitle { color: #333333; font-size: 85%; font-weight: initial; padding-top: 1px; padding-bottom: 3px; padding-left: 10px; padding-right: 10px; border-top-color: #FFFFFF; border-top-width: 0; }
 #obudsrvlaq .gt_heading { background-color: #FFFFFF; text-align: left; border-bottom-color: #FFFFFF; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #obudsrvlaq .gt_bottom_border { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #obudsrvlaq .gt_col_headings { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #obudsrvlaq .gt_col_heading { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: bottom; padding-top: 2px; padding-bottom: 3px; padding-left: 10px; padding-right: 10px; overflow-x: hidden; }
 #obudsrvlaq .gt_column_spanner_outer { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; padding-top: 0; padding-bottom: 0; padding-left: 4px; padding-right: 4px; }
 #obudsrvlaq .gt_column_spanner_outer:first-child { padding-left: 0; }
 #obudsrvlaq .gt_column_spanner_outer:last-child { padding-right: 0; }
 #obudsrvlaq .gt_column_spanner { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: bottom; padding-top: 2px; padding-bottom: 2px; overflow-x: hidden; display: inline-block; width: 100%; }
 #obudsrvlaq .gt_spanner_row { border-bottom-style: hidden; }
 #obudsrvlaq .gt_group_heading { padding-top: 4px; padding-bottom: 4px; padding-left: 10px; padding-right: 10px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; text-align: left; }
 #obudsrvlaq .gt_empty_group_heading { padding: 0.5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: middle; }
 #obudsrvlaq .gt_from_md> :first-child { margin-top: 0; }
 #obudsrvlaq .gt_from_md> :last-child { margin-bottom: 0; }
 #obudsrvlaq .gt_row { padding-top: 4px; padding-bottom: 4px; padding-left: 10px; padding-right: 10px; margin: 10px; border-top-style: solid; border-top-width: 1px; border-top-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; overflow-x: hidden; }
 #obudsrvlaq .gt_stub { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 10px; padding-right: 10px; }
 #obudsrvlaq .gt_stub_row_group { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 10px; padding-right: 10px; vertical-align: top; }
 #obudsrvlaq .gt_row_group_first td { border-top-width: 2px; }
 #obudsrvlaq .gt_row_group_first th { border-top-width: 2px; }
 #obudsrvlaq .gt_striped { color: #333333; background-color: #F4F4F4; }
 #obudsrvlaq .gt_table_body { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #obudsrvlaq .gt_grand_summary_row { color: #333333; background-color: #FFFFFF; text-transform: inherit; padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; }
 #obudsrvlaq .gt_first_grand_summary_row_bottom { border-top-style: double; border-top-width: 6px; border-top-color: #D3D3D3; }
 #obudsrvlaq .gt_last_grand_summary_row_top { border-bottom-style: double; border-bottom-width: 6px; border-bottom-color: #D3D3D3; }
 #obudsrvlaq .gt_sourcenotes { color: #333333; background-color: #FFFFFF; border-bottom-style: none; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; }
 #obudsrvlaq .gt_sourcenote { font-size: 90%; padding-top: 2px; padding-bottom: 2px; padding-left: 10px; padding-right: 10px; text-align: left; }
 #obudsrvlaq .gt_left { text-align: left; }
 #obudsrvlaq .gt_center { text-align: center; }
 #obudsrvlaq .gt_right { text-align: right; font-variant-numeric: tabular-nums; }
 #obudsrvlaq .gt_font_normal { font-weight: normal; }
 #obudsrvlaq .gt_font_bold { font-weight: bold; }
 #obudsrvlaq .gt_font_italic { font-style: italic; }
 #obudsrvlaq .gt_super { font-size: 65%; }
 #obudsrvlaq .gt_footnote_marks { font-size: 75%; vertical-align: 0.4em; position: initial; }
 #obudsrvlaq .gt_asterisk { font-size: 100%; vertical-align: 0; }
 
</style>
<table class="gt_table" data-quarto-disable-processing="false" data-quarto-bootstrap="false">
<thead>

  <tr class="gt_heading">
    <td colspan="7" class="gt_heading gt_title gt_font_normal">Isotopes of Carbon</td>
  </tr>
  <tr class="gt_heading">
    <td colspan="7" class="gt_heading gt_subtitle gt_font_normal gt_bottom_border">There are two stable isotopes of carbon and twelve that are unstable.</td>
  </tr>
<tr class="gt_col_headings gt_spanner_row">
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="2" colspan="1" scope="col" id="Isotope">Isotope</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="2" colspan="1" scope="col" id="atomic_mass">Atomic Mass</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="2" colspan="1" scope="col" id="half_life">Half Life, s</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_center" rowspan="2" colspan="1" scope="col" id="isospin">Isospin</th>
  <th class="gt_center gt_columns_top_border gt_column_spanner_outer" rowspan="1" colspan="3" scope="colgroup" id="Decay-Mode">
    <span class="gt_column_spanner">Decay Mode</span>
  </th>
</tr>
<tr class="gt_col_headings">
  <th class="gt_col_heading gt_columns_bottom_border gt_center" rowspan="1" colspan="1" scope="col" id="decay_1">1</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_center" rowspan="1" colspan="1" scope="col" id="decay_2">2</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_center" rowspan="1" colspan="1" scope="col" id="decay_3">3</th>
</tr>
</thead>
<tbody class="gt_table_body">
  <tr>
    <th style="background-color: Linen; font-weight: bold;" class="gt_row gt_left gt_stub">C-8</th>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">8.0376</td>
    <td style="font-family: IBM Plex Mono; color: Navy; background-color: PaleTurquoise;" class="gt_row gt_right">3.51 × 10<sup style="font-size: 65%;">−21</sup></td>
    <td class="gt_row gt_center">2</td>
    <td class="gt_row gt_center">2P</td>
    <td class="gt_row gt_center">—</td>
    <td class="gt_row gt_center">—</td>
  </tr>
  <tr>
    <th style="background-color: Linen; font-weight: bold;" class="gt_row gt_left gt_stub">C-9</th>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">9.0310</td>
    <td style="font-family: IBM Plex Mono; color: Navy; background-color: PaleTurquoise;" class="gt_row gt_right">1.26 × 10<sup style="font-size: 65%;">−1</sup></td>
    <td class="gt_row gt_center">3/2</td>
    <td class="gt_row gt_center">EC+B+</td>
    <td class="gt_row gt_center">B+P</td>
    <td class="gt_row gt_center">B+A</td>
  </tr>
  <tr>
    <th style="background-color: Linen; font-weight: bold;" class="gt_row gt_left gt_stub">C-10</th>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">10.0169</td>
    <td style="font-family: IBM Plex Mono; color: Navy; background-color: PaleTurquoise;" class="gt_row gt_right">1.93 × 10<sup style="font-size: 65%;">1</sup></td>
    <td class="gt_row gt_center">1</td>
    <td class="gt_row gt_center">EC+B+</td>
    <td class="gt_row gt_center">—</td>
    <td class="gt_row gt_center">—</td>
  </tr>
  <tr>
    <th style="background-color: Linen; font-weight: bold;" class="gt_row gt_left gt_stub">C-11</th>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">11.0114</td>
    <td style="font-family: IBM Plex Mono; color: Navy; background-color: PaleTurquoise;" class="gt_row gt_right">1.22 × 10<sup style="font-size: 65%;">3</sup></td>
    <td class="gt_row gt_center">1/2</td>
    <td class="gt_row gt_center">EC+B+</td>
    <td class="gt_row gt_center">—</td>
    <td class="gt_row gt_center">—</td>
  </tr>
  <tr>
    <th style="background-color: Linen; font-weight: bold; background-color: LightCyan;" class="gt_row gt_left gt_stub">C-12</th>
    <td style="font-family: IBM Plex Mono; background-color: LightCyan;" class="gt_row gt_right">12.0000</td>
    <td style="font-family: IBM Plex Mono; background-color: LightCyan;" class="gt_row gt_right"><strong>STABLE</strong></td>
    <td style="background-color: LightCyan;" class="gt_row gt_center">0</td>
    <td style="background-color: LightCyan;" class="gt_row gt_center">—</td>
    <td style="background-color: LightCyan;" class="gt_row gt_center">—</td>
    <td style="background-color: LightCyan;" class="gt_row gt_center">—</td>
  </tr>
  <tr>
    <th style="background-color: Linen; font-weight: bold; background-color: LightCyan;" class="gt_row gt_left gt_stub">C-13</th>
    <td style="font-family: IBM Plex Mono; background-color: LightCyan;" class="gt_row gt_right">13.0034</td>
    <td style="font-family: IBM Plex Mono; background-color: LightCyan;" class="gt_row gt_right"><strong>STABLE</strong></td>
    <td style="background-color: LightCyan;" class="gt_row gt_center">1/2</td>
    <td style="background-color: LightCyan;" class="gt_row gt_center">—</td>
    <td style="background-color: LightCyan;" class="gt_row gt_center">—</td>
    <td style="background-color: LightCyan;" class="gt_row gt_center">—</td>
  </tr>
  <tr>
    <th style="background-color: Linen; font-weight: bold;" class="gt_row gt_left gt_stub">C-14</th>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">14.0032</td>
    <td style="font-family: IBM Plex Mono; color: Navy; background-color: PaleTurquoise;" class="gt_row gt_right">1.80 × 10<sup style="font-size: 65%;">11</sup></td>
    <td class="gt_row gt_center">1</td>
    <td class="gt_row gt_center">B-</td>
    <td class="gt_row gt_center">—</td>
    <td class="gt_row gt_center">—</td>
  </tr>
  <tr>
    <th style="background-color: Linen; font-weight: bold;" class="gt_row gt_left gt_stub">C-15</th>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">15.0106</td>
    <td style="font-family: IBM Plex Mono; color: Navy; background-color: PaleTurquoise;" class="gt_row gt_right">2.45</td>
    <td class="gt_row gt_center">3/2</td>
    <td class="gt_row gt_center">B-</td>
    <td class="gt_row gt_center">—</td>
    <td class="gt_row gt_center">—</td>
  </tr>
  <tr>
    <th style="background-color: Linen; font-weight: bold;" class="gt_row gt_left gt_stub">C-16</th>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">16.0147</td>
    <td style="font-family: IBM Plex Mono; color: Navy; background-color: PaleTurquoise;" class="gt_row gt_right">7.47 × 10<sup style="font-size: 65%;">−1</sup></td>
    <td class="gt_row gt_center">2</td>
    <td class="gt_row gt_center">B-</td>
    <td class="gt_row gt_center">B-N</td>
    <td class="gt_row gt_center">—</td>
  </tr>
  <tr>
    <th style="background-color: Linen; font-weight: bold;" class="gt_row gt_left gt_stub">C-17</th>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">17.0226</td>
    <td style="font-family: IBM Plex Mono; color: Navy; background-color: PaleTurquoise;" class="gt_row gt_right">1.93 × 10<sup style="font-size: 65%;">−1</sup></td>
    <td class="gt_row gt_center">None</td>
    <td class="gt_row gt_center">B-</td>
    <td class="gt_row gt_center">B-N</td>
    <td class="gt_row gt_center">—</td>
  </tr>
  <tr>
    <th style="background-color: Linen; font-weight: bold;" class="gt_row gt_left gt_stub">C-18</th>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">18.0268</td>
    <td style="font-family: IBM Plex Mono; color: Navy; background-color: PaleTurquoise;" class="gt_row gt_right">9.20 × 10<sup style="font-size: 65%;">−2</sup></td>
    <td class="gt_row gt_center">3</td>
    <td class="gt_row gt_center">B-</td>
    <td class="gt_row gt_center">B-N</td>
    <td class="gt_row gt_center">—</td>
  </tr>
  <tr>
    <th style="background-color: Linen; font-weight: bold;" class="gt_row gt_left gt_stub">C-19</th>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">19.0348</td>
    <td style="font-family: IBM Plex Mono; color: Navy; background-color: PaleTurquoise;" class="gt_row gt_right">4.63 × 10<sup style="font-size: 65%;">−2</sup></td>
    <td class="gt_row gt_center">None</td>
    <td class="gt_row gt_center">B-</td>
    <td class="gt_row gt_center">B-N</td>
    <td class="gt_row gt_center">B-2N</td>
  </tr>
  <tr>
    <th style="background-color: Linen; font-weight: bold;" class="gt_row gt_left gt_stub">C-20</th>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">20.0403</td>
    <td style="font-family: IBM Plex Mono; color: Navy; background-color: PaleTurquoise;" class="gt_row gt_right">1.63 × 10<sup style="font-size: 65%;">−2</sup></td>
    <td class="gt_row gt_center">None</td>
    <td class="gt_row gt_center">B-</td>
    <td class="gt_row gt_center">B-N</td>
    <td class="gt_row gt_center">B-2N</td>
  </tr>
  <tr>
    <th style="background-color: Linen; font-weight: bold;" class="gt_row gt_left gt_stub">C-22</th>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">22.0576</td>
    <td style="font-family: IBM Plex Mono; color: Navy; background-color: PaleTurquoise;" class="gt_row gt_right">6.10 × 10<sup style="font-size: 65%;">−3</sup></td>
    <td class="gt_row gt_center">None</td>
    <td class="gt_row gt_center">B-</td>
    <td class="gt_row gt_center">B-N</td>
    <td class="gt_row gt_center">B-2N</td>
  </tr>
</tbody>
  <tfoot class="gt_sourcenotes">
  
  <tr>
    <td class="gt_sourcenote" colspan="7">Data obtained from the <em>nuclides</em> dataset.</td>
  </tr>

</tfoot>

</table>

</div>
</div>
</div>
<p>For task #1, a simple <code>.tab_style(..., locations=loc.stub())</code> targeted the entire stub.</p>
<p>Task #2 is more interesting. Like <a href="../../reference/loc.body.html#great_tables.loc.body" title="0"><code>loc.body()</code></a>, <a href="../../reference/loc.stub.html#great_tables.loc.stub" title="0"><code>loc.stub()</code></a> has a <code>rows=</code> argument that can target specific rows with Polars expressions. We used the same Polars expression as in the previous section to target those rows that belong to the stable isotopes.</p>
<p>We’ve dressed up the stub so that it is that much more prominent. And that linen-colored stub goes so well with the light-cyan rows, representative of carbon-12 and carbon-13!</p>
</section>
<section id="using-custom-style-rules-with-the-new-style.css" class="level3">
<h3 class="anchored" data-anchor-id="using-custom-style-rules-with-the-new-style.css">Using custom style rules with the new <a href="../../reference/style.css.html#great_tables.style.css" title="0"><code>style.css()</code></a></h3>
<p>Aside from decking out the <code>loc</code> module with all manner of location methods, we’ve added a little something to the <code>style</code> module: <a href="../../reference/style.css.html#great_tables.style.css" title="0"><code>style.css()</code></a>! What’s it for? It lets you supply style declarations to its single <code>rule=</code> argument.</p>
<p>As an example, I might want to indent some text in one or more table cells. You can’t really do that with the <a href="../../reference/style.text.html#great_tables.style.text" title="0"><code>style.text()</code></a> method since it doesn’t have an <code>indent=</code> argument. So, in Great Tables <code>0.13.0</code> you can manually indent the row label text for the ‘STABLE’ rows using a CSS style rule:</p>
<div id="817291bc" class="cell" data-execution_count="4">
<div class="code-copy-outer-scaffold"><div class="sourceCode cell-code" id="cb4" style="background: #f1f3f5;"><pre class="sourceCode python code-with-copy"><code class="sourceCode python"><span id="cb4-1">gt_tbl <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> (</span>
<span id="cb4-2">    gt_tbl</span>
<span id="cb4-3">    .tab_style(</span>
<span id="cb4-4">        style<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>style.css(rule<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"text-indent: 4px;"</span>),</span>
<span id="cb4-5">        locations<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>loc.stub(rows<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>pl.col(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"half_life"</span>).is_null())</span>
<span id="cb4-6">    )</span>
<span id="cb4-7">)</span>
<span id="cb4-8"></span>
<span id="cb4-9">gt_tbl</span></code></pre></div></div>
<div class="cell-output cell-output-display" data-execution_count="4">
<div id="ragkptxiar" style="padding-left:0px;padding-right:0px;padding-top:10px;padding-bottom:10px;overflow-x:auto;overflow-y:auto;width:auto;height:auto;">
<style>
@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Mono&display=swap');
@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans&display=swap');
#ragkptxiar table {
          font-family: 'IBM Plex Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Helvetica Neue', 'Fira Sans', 'Droid Sans', Arial, sans-serif;
          -webkit-font-smoothing: antialiased;
          -moz-osx-font-smoothing: grayscale;
        }

#ragkptxiar thead, tbody, tfoot, tr, td, th { border-style: none; }
 tr { background-color: transparent; }
#ragkptxiar p { margin: 0; padding: 0; }
 #ragkptxiar .gt_table { display: table; border-collapse: collapse; line-height: normal; margin-left: auto; margin-right: auto; color: #333333; font-size: 16px; font-weight: normal; font-style: normal; background-color: #FFFFFF; width: auto; border-top-style: solid; border-top-width: 2px; border-top-color: #A8A8A8; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #A8A8A8; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; }
 #ragkptxiar .gt_caption { padding-top: 4px; padding-bottom: 4px; }
 #ragkptxiar .gt_title { color: #333333; font-size: 125%; font-weight: initial; padding-top: 2px; padding-bottom: 2px; padding-left: 10px; padding-right: 10px; border-bottom-color: #FFFFFF; border-bottom-width: 0; }
 #ragkptxiar .gt_subtitle { color: #333333; font-size: 85%; font-weight: initial; padding-top: 1px; padding-bottom: 3px; padding-left: 10px; padding-right: 10px; border-top-color: #FFFFFF; border-top-width: 0; }
 #ragkptxiar .gt_heading { background-color: #FFFFFF; text-align: left; border-bottom-color: #FFFFFF; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #ragkptxiar .gt_bottom_border { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #ragkptxiar .gt_col_headings { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #ragkptxiar .gt_col_heading { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: bottom; padding-top: 2px; padding-bottom: 3px; padding-left: 10px; padding-right: 10px; overflow-x: hidden; }
 #ragkptxiar .gt_column_spanner_outer { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; padding-top: 0; padding-bottom: 0; padding-left: 4px; padding-right: 4px; }
 #ragkptxiar .gt_column_spanner_outer:first-child { padding-left: 0; }
 #ragkptxiar .gt_column_spanner_outer:last-child { padding-right: 0; }
 #ragkptxiar .gt_column_spanner { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: bottom; padding-top: 2px; padding-bottom: 2px; overflow-x: hidden; display: inline-block; width: 100%; }
 #ragkptxiar .gt_spanner_row { border-bottom-style: hidden; }
 #ragkptxiar .gt_group_heading { padding-top: 4px; padding-bottom: 4px; padding-left: 10px; padding-right: 10px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; text-align: left; }
 #ragkptxiar .gt_empty_group_heading { padding: 0.5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: middle; }
 #ragkptxiar .gt_from_md> :first-child { margin-top: 0; }
 #ragkptxiar .gt_from_md> :last-child { margin-bottom: 0; }
 #ragkptxiar .gt_row { padding-top: 4px; padding-bottom: 4px; padding-left: 10px; padding-right: 10px; margin: 10px; border-top-style: solid; border-top-width: 1px; border-top-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; overflow-x: hidden; }
 #ragkptxiar .gt_stub { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 10px; padding-right: 10px; }
 #ragkptxiar .gt_stub_row_group { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 10px; padding-right: 10px; vertical-align: top; }
 #ragkptxiar .gt_row_group_first td { border-top-width: 2px; }
 #ragkptxiar .gt_row_group_first th { border-top-width: 2px; }
 #ragkptxiar .gt_striped { color: #333333; background-color: #F4F4F4; }
 #ragkptxiar .gt_table_body { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #ragkptxiar .gt_grand_summary_row { color: #333333; background-color: #FFFFFF; text-transform: inherit; padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; }
 #ragkptxiar .gt_first_grand_summary_row_bottom { border-top-style: double; border-top-width: 6px; border-top-color: #D3D3D3; }
 #ragkptxiar .gt_last_grand_summary_row_top { border-bottom-style: double; border-bottom-width: 6px; border-bottom-color: #D3D3D3; }
 #ragkptxiar .gt_sourcenotes { color: #333333; background-color: #FFFFFF; border-bottom-style: none; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; }
 #ragkptxiar .gt_sourcenote { font-size: 90%; padding-top: 2px; padding-bottom: 2px; padding-left: 10px; padding-right: 10px; text-align: left; }
 #ragkptxiar .gt_left { text-align: left; }
 #ragkptxiar .gt_center { text-align: center; }
 #ragkptxiar .gt_right { text-align: right; font-variant-numeric: tabular-nums; }
 #ragkptxiar .gt_font_normal { font-weight: normal; }
 #ragkptxiar .gt_font_bold { font-weight: bold; }
 #ragkptxiar .gt_font_italic { font-style: italic; }
 #ragkptxiar .gt_super { font-size: 65%; }
 #ragkptxiar .gt_footnote_marks { font-size: 75%; vertical-align: 0.4em; position: initial; }
 #ragkptxiar .gt_asterisk { font-size: 100%; vertical-align: 0; }
 
</style>
<table class="gt_table" data-quarto-disable-processing="false" data-quarto-bootstrap="false">
<thead>

  <tr class="gt_heading">
    <td colspan="7" class="gt_heading gt_title gt_font_normal">Isotopes of Carbon</td>
  </tr>
  <tr class="gt_heading">
    <td colspan="7" class="gt_heading gt_subtitle gt_font_normal gt_bottom_border">There are two stable isotopes of carbon and twelve that are unstable.</td>
  </tr>
<tr class="gt_col_headings gt_spanner_row">
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="2" colspan="1" scope="col" id="Isotope">Isotope</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="2" colspan="1" scope="col" id="atomic_mass">Atomic Mass</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="2" colspan="1" scope="col" id="half_life">Half Life, s</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_center" rowspan="2" colspan="1" scope="col" id="isospin">Isospin</th>
  <th class="gt_center gt_columns_top_border gt_column_spanner_outer" rowspan="1" colspan="3" scope="colgroup" id="Decay-Mode">
    <span class="gt_column_spanner">Decay Mode</span>
  </th>
</tr>
<tr class="gt_col_headings">
  <th class="gt_col_heading gt_columns_bottom_border gt_center" rowspan="1" colspan="1" scope="col" id="decay_1">1</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_center" rowspan="1" colspan="1" scope="col" id="decay_2">2</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_center" rowspan="1" colspan="1" scope="col" id="decay_3">3</th>
</tr>
</thead>
<tbody class="gt_table_body">
  <tr>
    <th style="background-color: Linen; font-weight: bold;" class="gt_row gt_left gt_stub">C-8</th>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">8.0376</td>
    <td style="font-family: IBM Plex Mono; color: Navy; background-color: PaleTurquoise;" class="gt_row gt_right">3.51 × 10<sup style="font-size: 65%;">−21</sup></td>
    <td class="gt_row gt_center">2</td>
    <td class="gt_row gt_center">2P</td>
    <td class="gt_row gt_center">—</td>
    <td class="gt_row gt_center">—</td>
  </tr>
  <tr>
    <th style="background-color: Linen; font-weight: bold;" class="gt_row gt_left gt_stub">C-9</th>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">9.0310</td>
    <td style="font-family: IBM Plex Mono; color: Navy; background-color: PaleTurquoise;" class="gt_row gt_right">1.26 × 10<sup style="font-size: 65%;">−1</sup></td>
    <td class="gt_row gt_center">3/2</td>
    <td class="gt_row gt_center">EC+B+</td>
    <td class="gt_row gt_center">B+P</td>
    <td class="gt_row gt_center">B+A</td>
  </tr>
  <tr>
    <th style="background-color: Linen; font-weight: bold;" class="gt_row gt_left gt_stub">C-10</th>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">10.0169</td>
    <td style="font-family: IBM Plex Mono; color: Navy; background-color: PaleTurquoise;" class="gt_row gt_right">1.93 × 10<sup style="font-size: 65%;">1</sup></td>
    <td class="gt_row gt_center">1</td>
    <td class="gt_row gt_center">EC+B+</td>
    <td class="gt_row gt_center">—</td>
    <td class="gt_row gt_center">—</td>
  </tr>
  <tr>
    <th style="background-color: Linen; font-weight: bold;" class="gt_row gt_left gt_stub">C-11</th>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">11.0114</td>
    <td style="font-family: IBM Plex Mono; color: Navy; background-color: PaleTurquoise;" class="gt_row gt_right">1.22 × 10<sup style="font-size: 65%;">3</sup></td>
    <td class="gt_row gt_center">1/2</td>
    <td class="gt_row gt_center">EC+B+</td>
    <td class="gt_row gt_center">—</td>
    <td class="gt_row gt_center">—</td>
  </tr>
  <tr>
    <th style="background-color: Linen; font-weight: bold; background-color: LightCyan; text-indent: 4px;" class="gt_row gt_left gt_stub">C-12</th>
    <td style="font-family: IBM Plex Mono; background-color: LightCyan;" class="gt_row gt_right">12.0000</td>
    <td style="font-family: IBM Plex Mono; background-color: LightCyan;" class="gt_row gt_right"><strong>STABLE</strong></td>
    <td style="background-color: LightCyan;" class="gt_row gt_center">0</td>
    <td style="background-color: LightCyan;" class="gt_row gt_center">—</td>
    <td style="background-color: LightCyan;" class="gt_row gt_center">—</td>
    <td style="background-color: LightCyan;" class="gt_row gt_center">—</td>
  </tr>
  <tr>
    <th style="background-color: Linen; font-weight: bold; background-color: LightCyan; text-indent: 4px;" class="gt_row gt_left gt_stub">C-13</th>
    <td style="font-family: IBM Plex Mono; background-color: LightCyan;" class="gt_row gt_right">13.0034</td>
    <td style="font-family: IBM Plex Mono; background-color: LightCyan;" class="gt_row gt_right"><strong>STABLE</strong></td>
    <td style="background-color: LightCyan;" class="gt_row gt_center">1/2</td>
    <td style="background-color: LightCyan;" class="gt_row gt_center">—</td>
    <td style="background-color: LightCyan;" class="gt_row gt_center">—</td>
    <td style="background-color: LightCyan;" class="gt_row gt_center">—</td>
  </tr>
  <tr>
    <th style="background-color: Linen; font-weight: bold;" class="gt_row gt_left gt_stub">C-14</th>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">14.0032</td>
    <td style="font-family: IBM Plex Mono; color: Navy; background-color: PaleTurquoise;" class="gt_row gt_right">1.80 × 10<sup style="font-size: 65%;">11</sup></td>
    <td class="gt_row gt_center">1</td>
    <td class="gt_row gt_center">B-</td>
    <td class="gt_row gt_center">—</td>
    <td class="gt_row gt_center">—</td>
  </tr>
  <tr>
    <th style="background-color: Linen; font-weight: bold;" class="gt_row gt_left gt_stub">C-15</th>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">15.0106</td>
    <td style="font-family: IBM Plex Mono; color: Navy; background-color: PaleTurquoise;" class="gt_row gt_right">2.45</td>
    <td class="gt_row gt_center">3/2</td>
    <td class="gt_row gt_center">B-</td>
    <td class="gt_row gt_center">—</td>
    <td class="gt_row gt_center">—</td>
  </tr>
  <tr>
    <th style="background-color: Linen; font-weight: bold;" class="gt_row gt_left gt_stub">C-16</th>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">16.0147</td>
    <td style="font-family: IBM Plex Mono; color: Navy; background-color: PaleTurquoise;" class="gt_row gt_right">7.47 × 10<sup style="font-size: 65%;">−1</sup></td>
    <td class="gt_row gt_center">2</td>
    <td class="gt_row gt_center">B-</td>
    <td class="gt_row gt_center">B-N</td>
    <td class="gt_row gt_center">—</td>
  </tr>
  <tr>
    <th style="background-color: Linen; font-weight: bold;" class="gt_row gt_left gt_stub">C-17</th>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">17.0226</td>
    <td style="font-family: IBM Plex Mono; color: Navy; background-color: PaleTurquoise;" class="gt_row gt_right">1.93 × 10<sup style="font-size: 65%;">−1</sup></td>
    <td class="gt_row gt_center">None</td>
    <td class="gt_row gt_center">B-</td>
    <td class="gt_row gt_center">B-N</td>
    <td class="gt_row gt_center">—</td>
  </tr>
  <tr>
    <th style="background-color: Linen; font-weight: bold;" class="gt_row gt_left gt_stub">C-18</th>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">18.0268</td>
    <td style="font-family: IBM Plex Mono; color: Navy; background-color: PaleTurquoise;" class="gt_row gt_right">9.20 × 10<sup style="font-size: 65%;">−2</sup></td>
    <td class="gt_row gt_center">3</td>
    <td class="gt_row gt_center">B-</td>
    <td class="gt_row gt_center">B-N</td>
    <td class="gt_row gt_center">—</td>
  </tr>
  <tr>
    <th style="background-color: Linen; font-weight: bold;" class="gt_row gt_left gt_stub">C-19</th>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">19.0348</td>
    <td style="font-family: IBM Plex Mono; color: Navy; background-color: PaleTurquoise;" class="gt_row gt_right">4.63 × 10<sup style="font-size: 65%;">−2</sup></td>
    <td class="gt_row gt_center">None</td>
    <td class="gt_row gt_center">B-</td>
    <td class="gt_row gt_center">B-N</td>
    <td class="gt_row gt_center">B-2N</td>
  </tr>
  <tr>
    <th style="background-color: Linen; font-weight: bold;" class="gt_row gt_left gt_stub">C-20</th>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">20.0403</td>
    <td style="font-family: IBM Plex Mono; color: Navy; background-color: PaleTurquoise;" class="gt_row gt_right">1.63 × 10<sup style="font-size: 65%;">−2</sup></td>
    <td class="gt_row gt_center">None</td>
    <td class="gt_row gt_center">B-</td>
    <td class="gt_row gt_center">B-N</td>
    <td class="gt_row gt_center">B-2N</td>
  </tr>
  <tr>
    <th style="background-color: Linen; font-weight: bold;" class="gt_row gt_left gt_stub">C-22</th>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">22.0576</td>
    <td style="font-family: IBM Plex Mono; color: Navy; background-color: PaleTurquoise;" class="gt_row gt_right">6.10 × 10<sup style="font-size: 65%;">−3</sup></td>
    <td class="gt_row gt_center">None</td>
    <td class="gt_row gt_center">B-</td>
    <td class="gt_row gt_center">B-N</td>
    <td class="gt_row gt_center">B-2N</td>
  </tr>
</tbody>
  <tfoot class="gt_sourcenotes">
  
  <tr>
    <td class="gt_sourcenote" colspan="7">Data obtained from the <em>nuclides</em> dataset.</td>
  </tr>

</tfoot>

</table>

</div>
</div>
</div>
<p>We targeted the cells in the stub that corresponded to the stable isotopes (carbon-12 and -13) with a Polars expression (same one as in the previous code cell) and now we have a 4px indentation of the ‘C-12’ and ‘C-13’ text! This new bonus functionality really allows almost any type of styling possible, provided you have those CSS skillz.</p>
</section>
<section id="the-combined-location-helpers-loc.column_header-and-loc.footer" class="level3">
<h3 class="anchored" data-anchor-id="the-combined-location-helpers-loc.column_header-and-loc.footer">The <em>combined</em> location helpers: <a href="../../reference/loc.column_header.html#great_tables.loc.column_header" title="0"><code>loc.column_header()</code></a> and <a href="../../reference/loc.footer.html#great_tables.loc.footer" title="0"><code>loc.footer()</code></a></h3>
<p>Look, I know we brought up the expression <em>fine-grained</em> before—right in the first paragraph—but sometimes you need just the opposite. There are lots of little locations in a GT table and some make for logical groupings. To that end, we have the concept of <em>combined</em> location helpers.</p>
<p>Let’s set a grey background fill on the stubhead, column header, and footer:</p>
<div id="707d8926" class="cell" data-execution_count="5">
<div class="code-copy-outer-scaffold"><div class="sourceCode cell-code" id="cb5" style="background: #f1f3f5;"><pre class="sourceCode python code-with-copy"><code class="sourceCode python"><span id="cb5-1">gt_tbl <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> (</span>
<span id="cb5-2">    gt_tbl</span>
<span id="cb5-3">    .tab_style(</span>
<span id="cb5-4">        style<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>[style.text(v_align<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"middle"</span>), style.fill(color<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"#EEEEEE"</span>)],</span>
<span id="cb5-5">        locations<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>[loc.stubhead(), loc.column_header(), loc.footer()]</span>
<span id="cb5-6">    )</span>
<span id="cb5-7">)</span>
<span id="cb5-8"></span>
<span id="cb5-9">gt_tbl</span></code></pre></div></div>
<div class="cell-output cell-output-display" data-execution_count="5">
<div id="moarbocyzu" style="padding-left:0px;padding-right:0px;padding-top:10px;padding-bottom:10px;overflow-x:auto;overflow-y:auto;width:auto;height:auto;">
<style>
@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Mono&display=swap');
@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans&display=swap');
#moarbocyzu table {
          font-family: 'IBM Plex Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Helvetica Neue', 'Fira Sans', 'Droid Sans', Arial, sans-serif;
          -webkit-font-smoothing: antialiased;
          -moz-osx-font-smoothing: grayscale;
        }

#moarbocyzu thead, tbody, tfoot, tr, td, th { border-style: none; }
 tr { background-color: transparent; }
#moarbocyzu p { margin: 0; padding: 0; }
 #moarbocyzu .gt_table { display: table; border-collapse: collapse; line-height: normal; margin-left: auto; margin-right: auto; color: #333333; font-size: 16px; font-weight: normal; font-style: normal; background-color: #FFFFFF; width: auto; border-top-style: solid; border-top-width: 2px; border-top-color: #A8A8A8; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #A8A8A8; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; }
 #moarbocyzu .gt_caption { padding-top: 4px; padding-bottom: 4px; }
 #moarbocyzu .gt_title { color: #333333; font-size: 125%; font-weight: initial; padding-top: 2px; padding-bottom: 2px; padding-left: 10px; padding-right: 10px; border-bottom-color: #FFFFFF; border-bottom-width: 0; }
 #moarbocyzu .gt_subtitle { color: #333333; font-size: 85%; font-weight: initial; padding-top: 1px; padding-bottom: 3px; padding-left: 10px; padding-right: 10px; border-top-color: #FFFFFF; border-top-width: 0; }
 #moarbocyzu .gt_heading { background-color: #FFFFFF; text-align: left; border-bottom-color: #FFFFFF; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #moarbocyzu .gt_bottom_border { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #moarbocyzu .gt_col_headings { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #moarbocyzu .gt_col_heading { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: bottom; padding-top: 2px; padding-bottom: 3px; padding-left: 10px; padding-right: 10px; overflow-x: hidden; }
 #moarbocyzu .gt_column_spanner_outer { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; padding-top: 0; padding-bottom: 0; padding-left: 4px; padding-right: 4px; }
 #moarbocyzu .gt_column_spanner_outer:first-child { padding-left: 0; }
 #moarbocyzu .gt_column_spanner_outer:last-child { padding-right: 0; }
 #moarbocyzu .gt_column_spanner { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: bottom; padding-top: 2px; padding-bottom: 2px; overflow-x: hidden; display: inline-block; width: 100%; }
 #moarbocyzu .gt_spanner_row { border-bottom-style: hidden; }
 #moarbocyzu .gt_group_heading { padding-top: 4px; padding-bottom: 4px; padding-left: 10px; padding-right: 10px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; text-align: left; }
 #moarbocyzu .gt_empty_group_heading { padding: 0.5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: middle; }
 #moarbocyzu .gt_from_md> :first-child { margin-top: 0; }
 #moarbocyzu .gt_from_md> :last-child { margin-bottom: 0; }
 #moarbocyzu .gt_row { padding-top: 4px; padding-bottom: 4px; padding-left: 10px; padding-right: 10px; margin: 10px; border-top-style: solid; border-top-width: 1px; border-top-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; overflow-x: hidden; }
 #moarbocyzu .gt_stub { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 10px; padding-right: 10px; }
 #moarbocyzu .gt_stub_row_group { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 10px; padding-right: 10px; vertical-align: top; }
 #moarbocyzu .gt_row_group_first td { border-top-width: 2px; }
 #moarbocyzu .gt_row_group_first th { border-top-width: 2px; }
 #moarbocyzu .gt_striped { color: #333333; background-color: #F4F4F4; }
 #moarbocyzu .gt_table_body { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #moarbocyzu .gt_grand_summary_row { color: #333333; background-color: #FFFFFF; text-transform: inherit; padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; }
 #moarbocyzu .gt_first_grand_summary_row_bottom { border-top-style: double; border-top-width: 6px; border-top-color: #D3D3D3; }
 #moarbocyzu .gt_last_grand_summary_row_top { border-bottom-style: double; border-bottom-width: 6px; border-bottom-color: #D3D3D3; }
 #moarbocyzu .gt_sourcenotes { color: #333333; background-color: #FFFFFF; border-bottom-style: none; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; }
 #moarbocyzu .gt_sourcenote { font-size: 90%; padding-top: 2px; padding-bottom: 2px; padding-left: 10px; padding-right: 10px; text-align: left; }
 #moarbocyzu .gt_left { text-align: left; }
 #moarbocyzu .gt_center { text-align: center; }
 #moarbocyzu .gt_right { text-align: right; font-variant-numeric: tabular-nums; }
 #moarbocyzu .gt_font_normal { font-weight: normal; }
 #moarbocyzu .gt_font_bold { font-weight: bold; }
 #moarbocyzu .gt_font_italic { font-style: italic; }
 #moarbocyzu .gt_super { font-size: 65%; }
 #moarbocyzu .gt_footnote_marks { font-size: 75%; vertical-align: 0.4em; position: initial; }
 #moarbocyzu .gt_asterisk { font-size: 100%; vertical-align: 0; }
 
</style>
<table class="gt_table" data-quarto-disable-processing="false" data-quarto-bootstrap="false">
<thead>

  <tr class="gt_heading">
    <td colspan="7" class="gt_heading gt_title gt_font_normal">Isotopes of Carbon</td>
  </tr>
  <tr class="gt_heading">
    <td colspan="7" class="gt_heading gt_subtitle gt_font_normal gt_bottom_border">There are two stable isotopes of carbon and twelve that are unstable.</td>
  </tr>
<tr class="gt_col_headings gt_spanner_row">
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="2" colspan="1" style="vertical-align: middle; background-color: #EEEEEE;" scope="col" id="Isotope">Isotope</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="2" colspan="1" style="vertical-align: middle; background-color: #EEEEEE;" scope="col" id="atomic_mass">Atomic Mass</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="2" colspan="1" style="vertical-align: middle; background-color: #EEEEEE;" scope="col" id="half_life">Half Life, s</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_center" rowspan="2" colspan="1" style="vertical-align: middle; background-color: #EEEEEE;" scope="col" id="isospin">Isospin</th>
  <th class="gt_center gt_columns_top_border gt_column_spanner_outer" rowspan="1" colspan="3" style="vertical-align: middle; background-color: #EEEEEE;" scope="colgroup" id="Decay-Mode">
    <span class="gt_column_spanner">Decay Mode</span>
  </th>
</tr>
<tr class="gt_col_headings">
  <th class="gt_col_heading gt_columns_bottom_border gt_center" rowspan="1" colspan="1" style="vertical-align: middle; background-color: #EEEEEE;" scope="col" id="decay_1">1</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_center" rowspan="1" colspan="1" style="vertical-align: middle; background-color: #EEEEEE;" scope="col" id="decay_2">2</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_center" rowspan="1" colspan="1" style="vertical-align: middle; background-color: #EEEEEE;" scope="col" id="decay_3">3</th>
</tr>
</thead>
<tbody class="gt_table_body">
  <tr>
    <th style="background-color: Linen; font-weight: bold;" class="gt_row gt_left gt_stub">C-8</th>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">8.0376</td>
    <td style="font-family: IBM Plex Mono; color: Navy; background-color: PaleTurquoise;" class="gt_row gt_right">3.51 × 10<sup style="font-size: 65%;">−21</sup></td>
    <td class="gt_row gt_center">2</td>
    <td class="gt_row gt_center">2P</td>
    <td class="gt_row gt_center">—</td>
    <td class="gt_row gt_center">—</td>
  </tr>
  <tr>
    <th style="background-color: Linen; font-weight: bold;" class="gt_row gt_left gt_stub">C-9</th>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">9.0310</td>
    <td style="font-family: IBM Plex Mono; color: Navy; background-color: PaleTurquoise;" class="gt_row gt_right">1.26 × 10<sup style="font-size: 65%;">−1</sup></td>
    <td class="gt_row gt_center">3/2</td>
    <td class="gt_row gt_center">EC+B+</td>
    <td class="gt_row gt_center">B+P</td>
    <td class="gt_row gt_center">B+A</td>
  </tr>
  <tr>
    <th style="background-color: Linen; font-weight: bold;" class="gt_row gt_left gt_stub">C-10</th>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">10.0169</td>
    <td style="font-family: IBM Plex Mono; color: Navy; background-color: PaleTurquoise;" class="gt_row gt_right">1.93 × 10<sup style="font-size: 65%;">1</sup></td>
    <td class="gt_row gt_center">1</td>
    <td class="gt_row gt_center">EC+B+</td>
    <td class="gt_row gt_center">—</td>
    <td class="gt_row gt_center">—</td>
  </tr>
  <tr>
    <th style="background-color: Linen; font-weight: bold;" class="gt_row gt_left gt_stub">C-11</th>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">11.0114</td>
    <td style="font-family: IBM Plex Mono; color: Navy; background-color: PaleTurquoise;" class="gt_row gt_right">1.22 × 10<sup style="font-size: 65%;">3</sup></td>
    <td class="gt_row gt_center">1/2</td>
    <td class="gt_row gt_center">EC+B+</td>
    <td class="gt_row gt_center">—</td>
    <td class="gt_row gt_center">—</td>
  </tr>
  <tr>
    <th style="background-color: Linen; font-weight: bold; background-color: LightCyan; text-indent: 4px;" class="gt_row gt_left gt_stub">C-12</th>
    <td style="font-family: IBM Plex Mono; background-color: LightCyan;" class="gt_row gt_right">12.0000</td>
    <td style="font-family: IBM Plex Mono; background-color: LightCyan;" class="gt_row gt_right"><strong>STABLE</strong></td>
    <td style="background-color: LightCyan;" class="gt_row gt_center">0</td>
    <td style="background-color: LightCyan;" class="gt_row gt_center">—</td>
    <td style="background-color: LightCyan;" class="gt_row gt_center">—</td>
    <td style="background-color: LightCyan;" class="gt_row gt_center">—</td>
  </tr>
  <tr>
    <th style="background-color: Linen; font-weight: bold; background-color: LightCyan; text-indent: 4px;" class="gt_row gt_left gt_stub">C-13</th>
    <td style="font-family: IBM Plex Mono; background-color: LightCyan;" class="gt_row gt_right">13.0034</td>
    <td style="font-family: IBM Plex Mono; background-color: LightCyan;" class="gt_row gt_right"><strong>STABLE</strong></td>
    <td style="background-color: LightCyan;" class="gt_row gt_center">1/2</td>
    <td style="background-color: LightCyan;" class="gt_row gt_center">—</td>
    <td style="background-color: LightCyan;" class="gt_row gt_center">—</td>
    <td style="background-color: LightCyan;" class="gt_row gt_center">—</td>
  </tr>
  <tr>
    <th style="background-color: Linen; font-weight: bold;" class="gt_row gt_left gt_stub">C-14</th>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">14.0032</td>
    <td style="font-family: IBM Plex Mono; color: Navy; background-color: PaleTurquoise;" class="gt_row gt_right">1.80 × 10<sup style="font-size: 65%;">11</sup></td>
    <td class="gt_row gt_center">1</td>
    <td class="gt_row gt_center">B-</td>
    <td class="gt_row gt_center">—</td>
    <td class="gt_row gt_center">—</td>
  </tr>
  <tr>
    <th style="background-color: Linen; font-weight: bold;" class="gt_row gt_left gt_stub">C-15</th>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">15.0106</td>
    <td style="font-family: IBM Plex Mono; color: Navy; background-color: PaleTurquoise;" class="gt_row gt_right">2.45</td>
    <td class="gt_row gt_center">3/2</td>
    <td class="gt_row gt_center">B-</td>
    <td class="gt_row gt_center">—</td>
    <td class="gt_row gt_center">—</td>
  </tr>
  <tr>
    <th style="background-color: Linen; font-weight: bold;" class="gt_row gt_left gt_stub">C-16</th>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">16.0147</td>
    <td style="font-family: IBM Plex Mono; color: Navy; background-color: PaleTurquoise;" class="gt_row gt_right">7.47 × 10<sup style="font-size: 65%;">−1</sup></td>
    <td class="gt_row gt_center">2</td>
    <td class="gt_row gt_center">B-</td>
    <td class="gt_row gt_center">B-N</td>
    <td class="gt_row gt_center">—</td>
  </tr>
  <tr>
    <th style="background-color: Linen; font-weight: bold;" class="gt_row gt_left gt_stub">C-17</th>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">17.0226</td>
    <td style="font-family: IBM Plex Mono; color: Navy; background-color: PaleTurquoise;" class="gt_row gt_right">1.93 × 10<sup style="font-size: 65%;">−1</sup></td>
    <td class="gt_row gt_center">None</td>
    <td class="gt_row gt_center">B-</td>
    <td class="gt_row gt_center">B-N</td>
    <td class="gt_row gt_center">—</td>
  </tr>
  <tr>
    <th style="background-color: Linen; font-weight: bold;" class="gt_row gt_left gt_stub">C-18</th>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">18.0268</td>
    <td style="font-family: IBM Plex Mono; color: Navy; background-color: PaleTurquoise;" class="gt_row gt_right">9.20 × 10<sup style="font-size: 65%;">−2</sup></td>
    <td class="gt_row gt_center">3</td>
    <td class="gt_row gt_center">B-</td>
    <td class="gt_row gt_center">B-N</td>
    <td class="gt_row gt_center">—</td>
  </tr>
  <tr>
    <th style="background-color: Linen; font-weight: bold;" class="gt_row gt_left gt_stub">C-19</th>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">19.0348</td>
    <td style="font-family: IBM Plex Mono; color: Navy; background-color: PaleTurquoise;" class="gt_row gt_right">4.63 × 10<sup style="font-size: 65%;">−2</sup></td>
    <td class="gt_row gt_center">None</td>
    <td class="gt_row gt_center">B-</td>
    <td class="gt_row gt_center">B-N</td>
    <td class="gt_row gt_center">B-2N</td>
  </tr>
  <tr>
    <th style="background-color: Linen; font-weight: bold;" class="gt_row gt_left gt_stub">C-20</th>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">20.0403</td>
    <td style="font-family: IBM Plex Mono; color: Navy; background-color: PaleTurquoise;" class="gt_row gt_right">1.63 × 10<sup style="font-size: 65%;">−2</sup></td>
    <td class="gt_row gt_center">None</td>
    <td class="gt_row gt_center">B-</td>
    <td class="gt_row gt_center">B-N</td>
    <td class="gt_row gt_center">B-2N</td>
  </tr>
  <tr>
    <th style="background-color: Linen; font-weight: bold;" class="gt_row gt_left gt_stub">C-22</th>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">22.0576</td>
    <td style="font-family: IBM Plex Mono; color: Navy; background-color: PaleTurquoise;" class="gt_row gt_right">6.10 × 10<sup style="font-size: 65%;">−3</sup></td>
    <td class="gt_row gt_center">None</td>
    <td class="gt_row gt_center">B-</td>
    <td class="gt_row gt_center">B-N</td>
    <td class="gt_row gt_center">B-2N</td>
  </tr>
</tbody>
  <tfoot class="gt_sourcenotes">
  
  <tr>
    <td class="gt_sourcenote" colspan="7" style="vertical-align: middle; background-color: #EEEEEE;">Data obtained from the <em>nuclides</em> dataset.</td>
  </tr>

</tfoot>

</table>

</div>
</div>
</div>
<p>The <a href="../../reference/loc.column_header.html"><span><code>loc.column_header()</code></span></a> location always targets both <a href="../../reference/loc.column_labels.html#great_tables.loc.column_labels" title="0"><code>loc.column_labels()</code></a> and <a href="../../reference/loc.spanner_labels.html#great_tables.loc.spanner_labels" title="0"><code>loc.spanner_labels()</code></a>.</p>
<p>A good strategy for your tables would be to style with combined location helpers first and then drill into the specific cells of those super locations with more fine-grained styles in a later <code>tab_style()</code> call.</p>
</section>
<section id="styling-the-title-and-the-subtitle" class="level3">
<h3 class="anchored" data-anchor-id="styling-the-title-and-the-subtitle">Styling the title and the subtitle</h3>
<p>Although it really doesn’t appear to have separate locations, the table header (produced by way of <code>tab_header()</code>) can have two of them: the title and the subtitle (the latter is optional). These can be targeted via <a href="../../reference/loc.title.html#great_tables.loc.title" title="0"><code>loc.title()</code></a> and <a href="../../reference/loc.subtitle.html#great_tables.loc.subtitle" title="0"><code>loc.subtitle()</code></a>. Let’s focus in on the title location and set an aliceblue background fill on the title, along with some font and border adjustments.</p>
<div id="91aed1d7" class="cell" data-execution_count="6">
<div class="code-copy-outer-scaffold"><div class="sourceCode cell-code" id="cb6" style="background: #f1f3f5;"><pre class="sourceCode python code-with-copy"><code class="sourceCode python"><span id="cb6-1">gt_tbl <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> (</span>
<span id="cb6-2">    gt_tbl</span>
<span id="cb6-3">    .tab_style(</span>
<span id="cb6-4">        style<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>[</span>
<span id="cb6-5">            style.text(size<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"24px"</span>),</span>
<span id="cb6-6">            style.fill(color<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"aliceblue"</span>),</span>
<span id="cb6-7">            style.borders(sides<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"bottom"</span>, color<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"#BFDFF6"</span>, weight<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"2px"</span>)</span>
<span id="cb6-8">        ],</span>
<span id="cb6-9">        locations<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>loc.title()</span>
<span id="cb6-10">    )</span>
<span id="cb6-11">)</span>
<span id="cb6-12"></span>
<span id="cb6-13">gt_tbl</span></code></pre></div></div>
<div class="cell-output cell-output-display" data-execution_count="6">
<div id="udwemvxsss" style="padding-left:0px;padding-right:0px;padding-top:10px;padding-bottom:10px;overflow-x:auto;overflow-y:auto;width:auto;height:auto;">
<style>
@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Mono&display=swap');
@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans&display=swap');
#udwemvxsss table {
          font-family: 'IBM Plex Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Helvetica Neue', 'Fira Sans', 'Droid Sans', Arial, sans-serif;
          -webkit-font-smoothing: antialiased;
          -moz-osx-font-smoothing: grayscale;
        }

#udwemvxsss thead, tbody, tfoot, tr, td, th { border-style: none; }
 tr { background-color: transparent; }
#udwemvxsss p { margin: 0; padding: 0; }
 #udwemvxsss .gt_table { display: table; border-collapse: collapse; line-height: normal; margin-left: auto; margin-right: auto; color: #333333; font-size: 16px; font-weight: normal; font-style: normal; background-color: #FFFFFF; width: auto; border-top-style: solid; border-top-width: 2px; border-top-color: #A8A8A8; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #A8A8A8; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; }
 #udwemvxsss .gt_caption { padding-top: 4px; padding-bottom: 4px; }
 #udwemvxsss .gt_title { color: #333333; font-size: 125%; font-weight: initial; padding-top: 2px; padding-bottom: 2px; padding-left: 10px; padding-right: 10px; border-bottom-color: #FFFFFF; border-bottom-width: 0; }
 #udwemvxsss .gt_subtitle { color: #333333; font-size: 85%; font-weight: initial; padding-top: 1px; padding-bottom: 3px; padding-left: 10px; padding-right: 10px; border-top-color: #FFFFFF; border-top-width: 0; }
 #udwemvxsss .gt_heading { background-color: #FFFFFF; text-align: left; border-bottom-color: #FFFFFF; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #udwemvxsss .gt_bottom_border { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #udwemvxsss .gt_col_headings { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #udwemvxsss .gt_col_heading { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: bottom; padding-top: 2px; padding-bottom: 3px; padding-left: 10px; padding-right: 10px; overflow-x: hidden; }
 #udwemvxsss .gt_column_spanner_outer { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; padding-top: 0; padding-bottom: 0; padding-left: 4px; padding-right: 4px; }
 #udwemvxsss .gt_column_spanner_outer:first-child { padding-left: 0; }
 #udwemvxsss .gt_column_spanner_outer:last-child { padding-right: 0; }
 #udwemvxsss .gt_column_spanner { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: bottom; padding-top: 2px; padding-bottom: 2px; overflow-x: hidden; display: inline-block; width: 100%; }
 #udwemvxsss .gt_spanner_row { border-bottom-style: hidden; }
 #udwemvxsss .gt_group_heading { padding-top: 4px; padding-bottom: 4px; padding-left: 10px; padding-right: 10px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; text-align: left; }
 #udwemvxsss .gt_empty_group_heading { padding: 0.5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: middle; }
 #udwemvxsss .gt_from_md> :first-child { margin-top: 0; }
 #udwemvxsss .gt_from_md> :last-child { margin-bottom: 0; }
 #udwemvxsss .gt_row { padding-top: 4px; padding-bottom: 4px; padding-left: 10px; padding-right: 10px; margin: 10px; border-top-style: solid; border-top-width: 1px; border-top-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; overflow-x: hidden; }
 #udwemvxsss .gt_stub { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 10px; padding-right: 10px; }
 #udwemvxsss .gt_stub_row_group { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 10px; padding-right: 10px; vertical-align: top; }
 #udwemvxsss .gt_row_group_first td { border-top-width: 2px; }
 #udwemvxsss .gt_row_group_first th { border-top-width: 2px; }
 #udwemvxsss .gt_striped { color: #333333; background-color: #F4F4F4; }
 #udwemvxsss .gt_table_body { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #udwemvxsss .gt_grand_summary_row { color: #333333; background-color: #FFFFFF; text-transform: inherit; padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; }
 #udwemvxsss .gt_first_grand_summary_row_bottom { border-top-style: double; border-top-width: 6px; border-top-color: #D3D3D3; }
 #udwemvxsss .gt_last_grand_summary_row_top { border-bottom-style: double; border-bottom-width: 6px; border-bottom-color: #D3D3D3; }
 #udwemvxsss .gt_sourcenotes { color: #333333; background-color: #FFFFFF; border-bottom-style: none; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; }
 #udwemvxsss .gt_sourcenote { font-size: 90%; padding-top: 2px; padding-bottom: 2px; padding-left: 10px; padding-right: 10px; text-align: left; }
 #udwemvxsss .gt_left { text-align: left; }
 #udwemvxsss .gt_center { text-align: center; }
 #udwemvxsss .gt_right { text-align: right; font-variant-numeric: tabular-nums; }
 #udwemvxsss .gt_font_normal { font-weight: normal; }
 #udwemvxsss .gt_font_bold { font-weight: bold; }
 #udwemvxsss .gt_font_italic { font-style: italic; }
 #udwemvxsss .gt_super { font-size: 65%; }
 #udwemvxsss .gt_footnote_marks { font-size: 75%; vertical-align: 0.4em; position: initial; }
 #udwemvxsss .gt_asterisk { font-size: 100%; vertical-align: 0; }
 
</style>
<table class="gt_table" data-quarto-disable-processing="false" data-quarto-bootstrap="false">
<thead>

  <tr class="gt_heading">
    <td colspan="7" class="gt_heading gt_title gt_font_normal" style="font-size: 24px; background-color: aliceblue; border-bottom: 2px solid #BFDFF6;">Isotopes of Carbon</td>
  </tr>
  <tr class="gt_heading">
    <td colspan="7" class="gt_heading gt_subtitle gt_font_normal gt_bottom_border">There are two stable isotopes of carbon and twelve that are unstable.</td>
  </tr>
<tr class="gt_col_headings gt_spanner_row">
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="2" colspan="1" style="vertical-align: middle; background-color: #EEEEEE;" scope="col" id="Isotope">Isotope</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="2" colspan="1" style="vertical-align: middle; background-color: #EEEEEE;" scope="col" id="atomic_mass">Atomic Mass</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="2" colspan="1" style="vertical-align: middle; background-color: #EEEEEE;" scope="col" id="half_life">Half Life, s</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_center" rowspan="2" colspan="1" style="vertical-align: middle; background-color: #EEEEEE;" scope="col" id="isospin">Isospin</th>
  <th class="gt_center gt_columns_top_border gt_column_spanner_outer" rowspan="1" colspan="3" style="vertical-align: middle; background-color: #EEEEEE;" scope="colgroup" id="Decay-Mode">
    <span class="gt_column_spanner">Decay Mode</span>
  </th>
</tr>
<tr class="gt_col_headings">
  <th class="gt_col_heading gt_columns_bottom_border gt_center" rowspan="1" colspan="1" style="vertical-align: middle; background-color: #EEEEEE;" scope="col" id="decay_1">1</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_center" rowspan="1" colspan="1" style="vertical-align: middle; background-color: #EEEEEE;" scope="col" id="decay_2">2</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_center" rowspan="1" colspan="1" style="vertical-align: middle; background-color: #EEEEEE;" scope="col" id="decay_3">3</th>
</tr>
</thead>
<tbody class="gt_table_body">
  <tr>
    <th style="background-color: Linen; font-weight: bold;" class="gt_row gt_left gt_stub">C-8</th>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">8.0376</td>
    <td style="font-family: IBM Plex Mono; color: Navy; background-color: PaleTurquoise;" class="gt_row gt_right">3.51 × 10<sup style="font-size: 65%;">−21</sup></td>
    <td class="gt_row gt_center">2</td>
    <td class="gt_row gt_center">2P</td>
    <td class="gt_row gt_center">—</td>
    <td class="gt_row gt_center">—</td>
  </tr>
  <tr>
    <th style="background-color: Linen; font-weight: bold;" class="gt_row gt_left gt_stub">C-9</th>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">9.0310</td>
    <td style="font-family: IBM Plex Mono; color: Navy; background-color: PaleTurquoise;" class="gt_row gt_right">1.26 × 10<sup style="font-size: 65%;">−1</sup></td>
    <td class="gt_row gt_center">3/2</td>
    <td class="gt_row gt_center">EC+B+</td>
    <td class="gt_row gt_center">B+P</td>
    <td class="gt_row gt_center">B+A</td>
  </tr>
  <tr>
    <th style="background-color: Linen; font-weight: bold;" class="gt_row gt_left gt_stub">C-10</th>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">10.0169</td>
    <td style="font-family: IBM Plex Mono; color: Navy; background-color: PaleTurquoise;" class="gt_row gt_right">1.93 × 10<sup style="font-size: 65%;">1</sup></td>
    <td class="gt_row gt_center">1</td>
    <td class="gt_row gt_center">EC+B+</td>
    <td class="gt_row gt_center">—</td>
    <td class="gt_row gt_center">—</td>
  </tr>
  <tr>
    <th style="background-color: Linen; font-weight: bold;" class="gt_row gt_left gt_stub">C-11</th>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">11.0114</td>
    <td style="font-family: IBM Plex Mono; color: Navy; background-color: PaleTurquoise;" class="gt_row gt_right">1.22 × 10<sup style="font-size: 65%;">3</sup></td>
    <td class="gt_row gt_center">1/2</td>
    <td class="gt_row gt_center">EC+B+</td>
    <td class="gt_row gt_center">—</td>
    <td class="gt_row gt_center">—</td>
  </tr>
  <tr>
    <th style="background-color: Linen; font-weight: bold; background-color: LightCyan; text-indent: 4px;" class="gt_row gt_left gt_stub">C-12</th>
    <td style="font-family: IBM Plex Mono; background-color: LightCyan;" class="gt_row gt_right">12.0000</td>
    <td style="font-family: IBM Plex Mono; background-color: LightCyan;" class="gt_row gt_right"><strong>STABLE</strong></td>
    <td style="background-color: LightCyan;" class="gt_row gt_center">0</td>
    <td style="background-color: LightCyan;" class="gt_row gt_center">—</td>
    <td style="background-color: LightCyan;" class="gt_row gt_center">—</td>
    <td style="background-color: LightCyan;" class="gt_row gt_center">—</td>
  </tr>
  <tr>
    <th style="background-color: Linen; font-weight: bold; background-color: LightCyan; text-indent: 4px;" class="gt_row gt_left gt_stub">C-13</th>
    <td style="font-family: IBM Plex Mono; background-color: LightCyan;" class="gt_row gt_right">13.0034</td>
    <td style="font-family: IBM Plex Mono; background-color: LightCyan;" class="gt_row gt_right"><strong>STABLE</strong></td>
    <td style="background-color: LightCyan;" class="gt_row gt_center">1/2</td>
    <td style="background-color: LightCyan;" class="gt_row gt_center">—</td>
    <td style="background-color: LightCyan;" class="gt_row gt_center">—</td>
    <td style="background-color: LightCyan;" class="gt_row gt_center">—</td>
  </tr>
  <tr>
    <th style="background-color: Linen; font-weight: bold;" class="gt_row gt_left gt_stub">C-14</th>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">14.0032</td>
    <td style="font-family: IBM Plex Mono; color: Navy; background-color: PaleTurquoise;" class="gt_row gt_right">1.80 × 10<sup style="font-size: 65%;">11</sup></td>
    <td class="gt_row gt_center">1</td>
    <td class="gt_row gt_center">B-</td>
    <td class="gt_row gt_center">—</td>
    <td class="gt_row gt_center">—</td>
  </tr>
  <tr>
    <th style="background-color: Linen; font-weight: bold;" class="gt_row gt_left gt_stub">C-15</th>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">15.0106</td>
    <td style="font-family: IBM Plex Mono; color: Navy; background-color: PaleTurquoise;" class="gt_row gt_right">2.45</td>
    <td class="gt_row gt_center">3/2</td>
    <td class="gt_row gt_center">B-</td>
    <td class="gt_row gt_center">—</td>
    <td class="gt_row gt_center">—</td>
  </tr>
  <tr>
    <th style="background-color: Linen; font-weight: bold;" class="gt_row gt_left gt_stub">C-16</th>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">16.0147</td>
    <td style="font-family: IBM Plex Mono; color: Navy; background-color: PaleTurquoise;" class="gt_row gt_right">7.47 × 10<sup style="font-size: 65%;">−1</sup></td>
    <td class="gt_row gt_center">2</td>
    <td class="gt_row gt_center">B-</td>
    <td class="gt_row gt_center">B-N</td>
    <td class="gt_row gt_center">—</td>
  </tr>
  <tr>
    <th style="background-color: Linen; font-weight: bold;" class="gt_row gt_left gt_stub">C-17</th>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">17.0226</td>
    <td style="font-family: IBM Plex Mono; color: Navy; background-color: PaleTurquoise;" class="gt_row gt_right">1.93 × 10<sup style="font-size: 65%;">−1</sup></td>
    <td class="gt_row gt_center">None</td>
    <td class="gt_row gt_center">B-</td>
    <td class="gt_row gt_center">B-N</td>
    <td class="gt_row gt_center">—</td>
  </tr>
  <tr>
    <th style="background-color: Linen; font-weight: bold;" class="gt_row gt_left gt_stub">C-18</th>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">18.0268</td>
    <td style="font-family: IBM Plex Mono; color: Navy; background-color: PaleTurquoise;" class="gt_row gt_right">9.20 × 10<sup style="font-size: 65%;">−2</sup></td>
    <td class="gt_row gt_center">3</td>
    <td class="gt_row gt_center">B-</td>
    <td class="gt_row gt_center">B-N</td>
    <td class="gt_row gt_center">—</td>
  </tr>
  <tr>
    <th style="background-color: Linen; font-weight: bold;" class="gt_row gt_left gt_stub">C-19</th>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">19.0348</td>
    <td style="font-family: IBM Plex Mono; color: Navy; background-color: PaleTurquoise;" class="gt_row gt_right">4.63 × 10<sup style="font-size: 65%;">−2</sup></td>
    <td class="gt_row gt_center">None</td>
    <td class="gt_row gt_center">B-</td>
    <td class="gt_row gt_center">B-N</td>
    <td class="gt_row gt_center">B-2N</td>
  </tr>
  <tr>
    <th style="background-color: Linen; font-weight: bold;" class="gt_row gt_left gt_stub">C-20</th>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">20.0403</td>
    <td style="font-family: IBM Plex Mono; color: Navy; background-color: PaleTurquoise;" class="gt_row gt_right">1.63 × 10<sup style="font-size: 65%;">−2</sup></td>
    <td class="gt_row gt_center">None</td>
    <td class="gt_row gt_center">B-</td>
    <td class="gt_row gt_center">B-N</td>
    <td class="gt_row gt_center">B-2N</td>
  </tr>
  <tr>
    <th style="background-color: Linen; font-weight: bold;" class="gt_row gt_left gt_stub">C-22</th>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">22.0576</td>
    <td style="font-family: IBM Plex Mono; color: Navy; background-color: PaleTurquoise;" class="gt_row gt_right">6.10 × 10<sup style="font-size: 65%;">−3</sup></td>
    <td class="gt_row gt_center">None</td>
    <td class="gt_row gt_center">B-</td>
    <td class="gt_row gt_center">B-N</td>
    <td class="gt_row gt_center">B-2N</td>
  </tr>
</tbody>
  <tfoot class="gt_sourcenotes">
  
  <tr>
    <td class="gt_sourcenote" colspan="7" style="vertical-align: middle; background-color: #EEEEEE;">Data obtained from the <em>nuclides</em> dataset.</td>
  </tr>

</tfoot>

</table>

</div>
</div>
</div>
<p>Looks good. Notice that the title location is separate from the subtitle one, the background fill reveals the extent of its area.</p>
<p>A subtitle is an optional part of the header. We do have one in our table example, so let’s style that as well. The <a href="../../reference/style.css.html#great_tables.style.css" title="0"><code>style.css()</code></a> method will be used to give the subtitle text some additional top and bottom padding, and, we’ll put in a fancy background involving a linear gradient.</p>
<div id="b3b817ea" class="cell" data-execution_count="7">
<div class="code-copy-outer-scaffold"><div class="sourceCode cell-code" id="cb7" style="background: #f1f3f5;"><pre class="sourceCode python code-with-copy"><code class="sourceCode python"><span id="cb7-1">gt_tbl <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> (</span>
<span id="cb7-2">    gt_tbl</span>
<span id="cb7-3">    .tab_style(</span>
<span id="cb7-4">        style<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>style.css(rule<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"padding-top: 5px;"</span></span>
<span id="cb7-5">            <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"padding-bottom: 5px;"</span></span>
<span id="cb7-6">            <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"background-image: linear-gradient(120deg, #d4fc79 0%, #96f6a1 100%);"</span></span>
<span id="cb7-7">        ),</span>
<span id="cb7-8">        locations<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>loc.subtitle()</span>
<span id="cb7-9">    )</span>
<span id="cb7-10">)</span>
<span id="cb7-11"></span>
<span id="cb7-12">gt_tbl</span></code></pre></div></div>
<div class="cell-output cell-output-display" data-execution_count="7">
<div id="eupzysheig" style="padding-left:0px;padding-right:0px;padding-top:10px;padding-bottom:10px;overflow-x:auto;overflow-y:auto;width:auto;height:auto;">
<style>
@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Mono&display=swap');
@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans&display=swap');
#eupzysheig table {
          font-family: 'IBM Plex Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Helvetica Neue', 'Fira Sans', 'Droid Sans', Arial, sans-serif;
          -webkit-font-smoothing: antialiased;
          -moz-osx-font-smoothing: grayscale;
        }

#eupzysheig thead, tbody, tfoot, tr, td, th { border-style: none; }
 tr { background-color: transparent; }
#eupzysheig p { margin: 0; padding: 0; }
 #eupzysheig .gt_table { display: table; border-collapse: collapse; line-height: normal; margin-left: auto; margin-right: auto; color: #333333; font-size: 16px; font-weight: normal; font-style: normal; background-color: #FFFFFF; width: auto; border-top-style: solid; border-top-width: 2px; border-top-color: #A8A8A8; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #A8A8A8; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; }
 #eupzysheig .gt_caption { padding-top: 4px; padding-bottom: 4px; }
 #eupzysheig .gt_title { color: #333333; font-size: 125%; font-weight: initial; padding-top: 2px; padding-bottom: 2px; padding-left: 10px; padding-right: 10px; border-bottom-color: #FFFFFF; border-bottom-width: 0; }
 #eupzysheig .gt_subtitle { color: #333333; font-size: 85%; font-weight: initial; padding-top: 1px; padding-bottom: 3px; padding-left: 10px; padding-right: 10px; border-top-color: #FFFFFF; border-top-width: 0; }
 #eupzysheig .gt_heading { background-color: #FFFFFF; text-align: left; border-bottom-color: #FFFFFF; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #eupzysheig .gt_bottom_border { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #eupzysheig .gt_col_headings { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #eupzysheig .gt_col_heading { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: bottom; padding-top: 2px; padding-bottom: 3px; padding-left: 10px; padding-right: 10px; overflow-x: hidden; }
 #eupzysheig .gt_column_spanner_outer { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; padding-top: 0; padding-bottom: 0; padding-left: 4px; padding-right: 4px; }
 #eupzysheig .gt_column_spanner_outer:first-child { padding-left: 0; }
 #eupzysheig .gt_column_spanner_outer:last-child { padding-right: 0; }
 #eupzysheig .gt_column_spanner { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: bottom; padding-top: 2px; padding-bottom: 2px; overflow-x: hidden; display: inline-block; width: 100%; }
 #eupzysheig .gt_spanner_row { border-bottom-style: hidden; }
 #eupzysheig .gt_group_heading { padding-top: 4px; padding-bottom: 4px; padding-left: 10px; padding-right: 10px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; text-align: left; }
 #eupzysheig .gt_empty_group_heading { padding: 0.5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: middle; }
 #eupzysheig .gt_from_md> :first-child { margin-top: 0; }
 #eupzysheig .gt_from_md> :last-child { margin-bottom: 0; }
 #eupzysheig .gt_row { padding-top: 4px; padding-bottom: 4px; padding-left: 10px; padding-right: 10px; margin: 10px; border-top-style: solid; border-top-width: 1px; border-top-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; overflow-x: hidden; }
 #eupzysheig .gt_stub { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 10px; padding-right: 10px; }
 #eupzysheig .gt_stub_row_group { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 10px; padding-right: 10px; vertical-align: top; }
 #eupzysheig .gt_row_group_first td { border-top-width: 2px; }
 #eupzysheig .gt_row_group_first th { border-top-width: 2px; }
 #eupzysheig .gt_striped { color: #333333; background-color: #F4F4F4; }
 #eupzysheig .gt_table_body { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #eupzysheig .gt_grand_summary_row { color: #333333; background-color: #FFFFFF; text-transform: inherit; padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; }
 #eupzysheig .gt_first_grand_summary_row_bottom { border-top-style: double; border-top-width: 6px; border-top-color: #D3D3D3; }
 #eupzysheig .gt_last_grand_summary_row_top { border-bottom-style: double; border-bottom-width: 6px; border-bottom-color: #D3D3D3; }
 #eupzysheig .gt_sourcenotes { color: #333333; background-color: #FFFFFF; border-bottom-style: none; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; }
 #eupzysheig .gt_sourcenote { font-size: 90%; padding-top: 2px; padding-bottom: 2px; padding-left: 10px; padding-right: 10px; text-align: left; }
 #eupzysheig .gt_left { text-align: left; }
 #eupzysheig .gt_center { text-align: center; }
 #eupzysheig .gt_right { text-align: right; font-variant-numeric: tabular-nums; }
 #eupzysheig .gt_font_normal { font-weight: normal; }
 #eupzysheig .gt_font_bold { font-weight: bold; }
 #eupzysheig .gt_font_italic { font-style: italic; }
 #eupzysheig .gt_super { font-size: 65%; }
 #eupzysheig .gt_footnote_marks { font-size: 75%; vertical-align: 0.4em; position: initial; }
 #eupzysheig .gt_asterisk { font-size: 100%; vertical-align: 0; }
 
</style>
<table class="gt_table" data-quarto-disable-processing="false" data-quarto-bootstrap="false">
<thead>

  <tr class="gt_heading">
    <td colspan="7" class="gt_heading gt_title gt_font_normal" style="font-size: 24px; background-color: aliceblue; border-bottom: 2px solid #BFDFF6;">Isotopes of Carbon</td>
  </tr>
  <tr class="gt_heading">
    <td colspan="7" class="gt_heading gt_subtitle gt_font_normal gt_bottom_border" style="padding-top: 5px;padding-bottom: 5px;background-image: linear-gradient(120deg, #d4fc79 0%, #96f6a1 100%);">There are two stable isotopes of carbon and twelve that are unstable.</td>
  </tr>
<tr class="gt_col_headings gt_spanner_row">
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="2" colspan="1" style="vertical-align: middle; background-color: #EEEEEE;" scope="col" id="Isotope">Isotope</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="2" colspan="1" style="vertical-align: middle; background-color: #EEEEEE;" scope="col" id="atomic_mass">Atomic Mass</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="2" colspan="1" style="vertical-align: middle; background-color: #EEEEEE;" scope="col" id="half_life">Half Life, s</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_center" rowspan="2" colspan="1" style="vertical-align: middle; background-color: #EEEEEE;" scope="col" id="isospin">Isospin</th>
  <th class="gt_center gt_columns_top_border gt_column_spanner_outer" rowspan="1" colspan="3" style="vertical-align: middle; background-color: #EEEEEE;" scope="colgroup" id="Decay-Mode">
    <span class="gt_column_spanner">Decay Mode</span>
  </th>
</tr>
<tr class="gt_col_headings">
  <th class="gt_col_heading gt_columns_bottom_border gt_center" rowspan="1" colspan="1" style="vertical-align: middle; background-color: #EEEEEE;" scope="col" id="decay_1">1</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_center" rowspan="1" colspan="1" style="vertical-align: middle; background-color: #EEEEEE;" scope="col" id="decay_2">2</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_center" rowspan="1" colspan="1" style="vertical-align: middle; background-color: #EEEEEE;" scope="col" id="decay_3">3</th>
</tr>
</thead>
<tbody class="gt_table_body">
  <tr>
    <th style="background-color: Linen; font-weight: bold;" class="gt_row gt_left gt_stub">C-8</th>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">8.0376</td>
    <td style="font-family: IBM Plex Mono; color: Navy; background-color: PaleTurquoise;" class="gt_row gt_right">3.51 × 10<sup style="font-size: 65%;">−21</sup></td>
    <td class="gt_row gt_center">2</td>
    <td class="gt_row gt_center">2P</td>
    <td class="gt_row gt_center">—</td>
    <td class="gt_row gt_center">—</td>
  </tr>
  <tr>
    <th style="background-color: Linen; font-weight: bold;" class="gt_row gt_left gt_stub">C-9</th>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">9.0310</td>
    <td style="font-family: IBM Plex Mono; color: Navy; background-color: PaleTurquoise;" class="gt_row gt_right">1.26 × 10<sup style="font-size: 65%;">−1</sup></td>
    <td class="gt_row gt_center">3/2</td>
    <td class="gt_row gt_center">EC+B+</td>
    <td class="gt_row gt_center">B+P</td>
    <td class="gt_row gt_center">B+A</td>
  </tr>
  <tr>
    <th style="background-color: Linen; font-weight: bold;" class="gt_row gt_left gt_stub">C-10</th>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">10.0169</td>
    <td style="font-family: IBM Plex Mono; color: Navy; background-color: PaleTurquoise;" class="gt_row gt_right">1.93 × 10<sup style="font-size: 65%;">1</sup></td>
    <td class="gt_row gt_center">1</td>
    <td class="gt_row gt_center">EC+B+</td>
    <td class="gt_row gt_center">—</td>
    <td class="gt_row gt_center">—</td>
  </tr>
  <tr>
    <th style="background-color: Linen; font-weight: bold;" class="gt_row gt_left gt_stub">C-11</th>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">11.0114</td>
    <td style="font-family: IBM Plex Mono; color: Navy; background-color: PaleTurquoise;" class="gt_row gt_right">1.22 × 10<sup style="font-size: 65%;">3</sup></td>
    <td class="gt_row gt_center">1/2</td>
    <td class="gt_row gt_center">EC+B+</td>
    <td class="gt_row gt_center">—</td>
    <td class="gt_row gt_center">—</td>
  </tr>
  <tr>
    <th style="background-color: Linen; font-weight: bold; background-color: LightCyan; text-indent: 4px;" class="gt_row gt_left gt_stub">C-12</th>
    <td style="font-family: IBM Plex Mono; background-color: LightCyan;" class="gt_row gt_right">12.0000</td>
    <td style="font-family: IBM Plex Mono; background-color: LightCyan;" class="gt_row gt_right"><strong>STABLE</strong></td>
    <td style="background-color: LightCyan;" class="gt_row gt_center">0</td>
    <td style="background-color: LightCyan;" class="gt_row gt_center">—</td>
    <td style="background-color: LightCyan;" class="gt_row gt_center">—</td>
    <td style="background-color: LightCyan;" class="gt_row gt_center">—</td>
  </tr>
  <tr>
    <th style="background-color: Linen; font-weight: bold; background-color: LightCyan; text-indent: 4px;" class="gt_row gt_left gt_stub">C-13</th>
    <td style="font-family: IBM Plex Mono; background-color: LightCyan;" class="gt_row gt_right">13.0034</td>
    <td style="font-family: IBM Plex Mono; background-color: LightCyan;" class="gt_row gt_right"><strong>STABLE</strong></td>
    <td style="background-color: LightCyan;" class="gt_row gt_center">1/2</td>
    <td style="background-color: LightCyan;" class="gt_row gt_center">—</td>
    <td style="background-color: LightCyan;" class="gt_row gt_center">—</td>
    <td style="background-color: LightCyan;" class="gt_row gt_center">—</td>
  </tr>
  <tr>
    <th style="background-color: Linen; font-weight: bold;" class="gt_row gt_left gt_stub">C-14</th>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">14.0032</td>
    <td style="font-family: IBM Plex Mono; color: Navy; background-color: PaleTurquoise;" class="gt_row gt_right">1.80 × 10<sup style="font-size: 65%;">11</sup></td>
    <td class="gt_row gt_center">1</td>
    <td class="gt_row gt_center">B-</td>
    <td class="gt_row gt_center">—</td>
    <td class="gt_row gt_center">—</td>
  </tr>
  <tr>
    <th style="background-color: Linen; font-weight: bold;" class="gt_row gt_left gt_stub">C-15</th>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">15.0106</td>
    <td style="font-family: IBM Plex Mono; color: Navy; background-color: PaleTurquoise;" class="gt_row gt_right">2.45</td>
    <td class="gt_row gt_center">3/2</td>
    <td class="gt_row gt_center">B-</td>
    <td class="gt_row gt_center">—</td>
    <td class="gt_row gt_center">—</td>
  </tr>
  <tr>
    <th style="background-color: Linen; font-weight: bold;" class="gt_row gt_left gt_stub">C-16</th>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">16.0147</td>
    <td style="font-family: IBM Plex Mono; color: Navy; background-color: PaleTurquoise;" class="gt_row gt_right">7.47 × 10<sup style="font-size: 65%;">−1</sup></td>
    <td class="gt_row gt_center">2</td>
    <td class="gt_row gt_center">B-</td>
    <td class="gt_row gt_center">B-N</td>
    <td class="gt_row gt_center">—</td>
  </tr>
  <tr>
    <th style="background-color: Linen; font-weight: bold;" class="gt_row gt_left gt_stub">C-17</th>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">17.0226</td>
    <td style="font-family: IBM Plex Mono; color: Navy; background-color: PaleTurquoise;" class="gt_row gt_right">1.93 × 10<sup style="font-size: 65%;">−1</sup></td>
    <td class="gt_row gt_center">None</td>
    <td class="gt_row gt_center">B-</td>
    <td class="gt_row gt_center">B-N</td>
    <td class="gt_row gt_center">—</td>
  </tr>
  <tr>
    <th style="background-color: Linen; font-weight: bold;" class="gt_row gt_left gt_stub">C-18</th>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">18.0268</td>
    <td style="font-family: IBM Plex Mono; color: Navy; background-color: PaleTurquoise;" class="gt_row gt_right">9.20 × 10<sup style="font-size: 65%;">−2</sup></td>
    <td class="gt_row gt_center">3</td>
    <td class="gt_row gt_center">B-</td>
    <td class="gt_row gt_center">B-N</td>
    <td class="gt_row gt_center">—</td>
  </tr>
  <tr>
    <th style="background-color: Linen; font-weight: bold;" class="gt_row gt_left gt_stub">C-19</th>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">19.0348</td>
    <td style="font-family: IBM Plex Mono; color: Navy; background-color: PaleTurquoise;" class="gt_row gt_right">4.63 × 10<sup style="font-size: 65%;">−2</sup></td>
    <td class="gt_row gt_center">None</td>
    <td class="gt_row gt_center">B-</td>
    <td class="gt_row gt_center">B-N</td>
    <td class="gt_row gt_center">B-2N</td>
  </tr>
  <tr>
    <th style="background-color: Linen; font-weight: bold;" class="gt_row gt_left gt_stub">C-20</th>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">20.0403</td>
    <td style="font-family: IBM Plex Mono; color: Navy; background-color: PaleTurquoise;" class="gt_row gt_right">1.63 × 10<sup style="font-size: 65%;">−2</sup></td>
    <td class="gt_row gt_center">None</td>
    <td class="gt_row gt_center">B-</td>
    <td class="gt_row gt_center">B-N</td>
    <td class="gt_row gt_center">B-2N</td>
  </tr>
  <tr>
    <th style="background-color: Linen; font-weight: bold;" class="gt_row gt_left gt_stub">C-22</th>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">22.0576</td>
    <td style="font-family: IBM Plex Mono; color: Navy; background-color: PaleTurquoise;" class="gt_row gt_right">6.10 × 10<sup style="font-size: 65%;">−3</sup></td>
    <td class="gt_row gt_center">None</td>
    <td class="gt_row gt_center">B-</td>
    <td class="gt_row gt_center">B-N</td>
    <td class="gt_row gt_center">B-2N</td>
  </tr>
</tbody>
  <tfoot class="gt_sourcenotes">
  
  <tr>
    <td class="gt_sourcenote" colspan="7" style="vertical-align: middle; background-color: #EEEEEE;">Data obtained from the <em>nuclides</em> dataset.</td>
  </tr>

</tfoot>

</table>

</div>
</div>
</div>
<p>None of what was done above could be done prior to <code>v0.13.0</code>. The <a href="../../reference/style.css.html#great_tables.style.css" title="0"><code>style.css()</code></a> method makes this all possible.</p>
<p>The combined location helper for the title and the subtitle locations is <a href="../../reference/loc.header.html#great_tables.loc.header" title="0"><code>loc.header()</code></a>. As mentioned before, it can be used as a shorthand for <code>locations=[loc.title(), loc_subtitle()]</code> and it’s useful here where we want to change the font for the title and subtitle text.</p>
<div id="78948132" class="cell" data-execution_count="8">
<div class="code-copy-outer-scaffold"><div class="sourceCode cell-code" id="cb8" style="background: #f1f3f5;"><pre class="sourceCode python code-with-copy"><code class="sourceCode python"><span id="cb8-1">gt_tbl <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> (</span>
<span id="cb8-2">    gt_tbl</span>
<span id="cb8-3">    .tab_style(</span>
<span id="cb8-4">        style<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>style.text(font<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>google_font(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"IBM Plex Serif"</span>)),</span>
<span id="cb8-5">        locations<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>loc.header()</span>
<span id="cb8-6">    )</span>
<span id="cb8-7">)</span>
<span id="cb8-8"></span>
<span id="cb8-9">gt_tbl</span></code></pre></div></div>
<div class="cell-output cell-output-display" data-execution_count="8">
<div id="vdnkdirjoe" style="padding-left:0px;padding-right:0px;padding-top:10px;padding-bottom:10px;overflow-x:auto;overflow-y:auto;width:auto;height:auto;">
<style>
@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Mono&display=swap');
@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans&display=swap');
@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Serif&display=swap');
#vdnkdirjoe table {
          font-family: 'IBM Plex Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Helvetica Neue', 'Fira Sans', 'Droid Sans', Arial, sans-serif;
          -webkit-font-smoothing: antialiased;
          -moz-osx-font-smoothing: grayscale;
        }

#vdnkdirjoe thead, tbody, tfoot, tr, td, th { border-style: none; }
 tr { background-color: transparent; }
#vdnkdirjoe p { margin: 0; padding: 0; }
 #vdnkdirjoe .gt_table { display: table; border-collapse: collapse; line-height: normal; margin-left: auto; margin-right: auto; color: #333333; font-size: 16px; font-weight: normal; font-style: normal; background-color: #FFFFFF; width: auto; border-top-style: solid; border-top-width: 2px; border-top-color: #A8A8A8; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #A8A8A8; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; }
 #vdnkdirjoe .gt_caption { padding-top: 4px; padding-bottom: 4px; }
 #vdnkdirjoe .gt_title { color: #333333; font-size: 125%; font-weight: initial; padding-top: 2px; padding-bottom: 2px; padding-left: 10px; padding-right: 10px; border-bottom-color: #FFFFFF; border-bottom-width: 0; }
 #vdnkdirjoe .gt_subtitle { color: #333333; font-size: 85%; font-weight: initial; padding-top: 1px; padding-bottom: 3px; padding-left: 10px; padding-right: 10px; border-top-color: #FFFFFF; border-top-width: 0; }
 #vdnkdirjoe .gt_heading { background-color: #FFFFFF; text-align: left; border-bottom-color: #FFFFFF; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #vdnkdirjoe .gt_bottom_border { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #vdnkdirjoe .gt_col_headings { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #vdnkdirjoe .gt_col_heading { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: bottom; padding-top: 2px; padding-bottom: 3px; padding-left: 10px; padding-right: 10px; overflow-x: hidden; }
 #vdnkdirjoe .gt_column_spanner_outer { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; padding-top: 0; padding-bottom: 0; padding-left: 4px; padding-right: 4px; }
 #vdnkdirjoe .gt_column_spanner_outer:first-child { padding-left: 0; }
 #vdnkdirjoe .gt_column_spanner_outer:last-child { padding-right: 0; }
 #vdnkdirjoe .gt_column_spanner { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: bottom; padding-top: 2px; padding-bottom: 2px; overflow-x: hidden; display: inline-block; width: 100%; }
 #vdnkdirjoe .gt_spanner_row { border-bottom-style: hidden; }
 #vdnkdirjoe .gt_group_heading { padding-top: 4px; padding-bottom: 4px; padding-left: 10px; padding-right: 10px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; text-align: left; }
 #vdnkdirjoe .gt_empty_group_heading { padding: 0.5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: middle; }
 #vdnkdirjoe .gt_from_md> :first-child { margin-top: 0; }
 #vdnkdirjoe .gt_from_md> :last-child { margin-bottom: 0; }
 #vdnkdirjoe .gt_row { padding-top: 4px; padding-bottom: 4px; padding-left: 10px; padding-right: 10px; margin: 10px; border-top-style: solid; border-top-width: 1px; border-top-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; overflow-x: hidden; }
 #vdnkdirjoe .gt_stub { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 10px; padding-right: 10px; }
 #vdnkdirjoe .gt_stub_row_group { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 10px; padding-right: 10px; vertical-align: top; }
 #vdnkdirjoe .gt_row_group_first td { border-top-width: 2px; }
 #vdnkdirjoe .gt_row_group_first th { border-top-width: 2px; }
 #vdnkdirjoe .gt_striped { color: #333333; background-color: #F4F4F4; }
 #vdnkdirjoe .gt_table_body { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #vdnkdirjoe .gt_grand_summary_row { color: #333333; background-color: #FFFFFF; text-transform: inherit; padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; }
 #vdnkdirjoe .gt_first_grand_summary_row_bottom { border-top-style: double; border-top-width: 6px; border-top-color: #D3D3D3; }
 #vdnkdirjoe .gt_last_grand_summary_row_top { border-bottom-style: double; border-bottom-width: 6px; border-bottom-color: #D3D3D3; }
 #vdnkdirjoe .gt_sourcenotes { color: #333333; background-color: #FFFFFF; border-bottom-style: none; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; }
 #vdnkdirjoe .gt_sourcenote { font-size: 90%; padding-top: 2px; padding-bottom: 2px; padding-left: 10px; padding-right: 10px; text-align: left; }
 #vdnkdirjoe .gt_left { text-align: left; }
 #vdnkdirjoe .gt_center { text-align: center; }
 #vdnkdirjoe .gt_right { text-align: right; font-variant-numeric: tabular-nums; }
 #vdnkdirjoe .gt_font_normal { font-weight: normal; }
 #vdnkdirjoe .gt_font_bold { font-weight: bold; }
 #vdnkdirjoe .gt_font_italic { font-style: italic; }
 #vdnkdirjoe .gt_super { font-size: 65%; }
 #vdnkdirjoe .gt_footnote_marks { font-size: 75%; vertical-align: 0.4em; position: initial; }
 #vdnkdirjoe .gt_asterisk { font-size: 100%; vertical-align: 0; }
 
</style>
<table class="gt_table" data-quarto-disable-processing="false" data-quarto-bootstrap="false">
<thead>

  <tr class="gt_heading">
    <td colspan="7" class="gt_heading gt_title gt_font_normal" style="font-family: IBM Plex Serif; font-size: 24px; background-color: aliceblue; border-bottom: 2px solid #BFDFF6;">Isotopes of Carbon</td>
  </tr>
  <tr class="gt_heading">
    <td colspan="7" class="gt_heading gt_subtitle gt_font_normal gt_bottom_border" style="font-family: IBM Plex Serif; padding-top: 5px;padding-bottom: 5px;background-image: linear-gradient(120deg, #d4fc79 0%, #96f6a1 100%);">There are two stable isotopes of carbon and twelve that are unstable.</td>
  </tr>
<tr class="gt_col_headings gt_spanner_row">
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="2" colspan="1" style="vertical-align: middle; background-color: #EEEEEE;" scope="col" id="Isotope">Isotope</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="2" colspan="1" style="vertical-align: middle; background-color: #EEEEEE;" scope="col" id="atomic_mass">Atomic Mass</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="2" colspan="1" style="vertical-align: middle; background-color: #EEEEEE;" scope="col" id="half_life">Half Life, s</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_center" rowspan="2" colspan="1" style="vertical-align: middle; background-color: #EEEEEE;" scope="col" id="isospin">Isospin</th>
  <th class="gt_center gt_columns_top_border gt_column_spanner_outer" rowspan="1" colspan="3" style="vertical-align: middle; background-color: #EEEEEE;" scope="colgroup" id="Decay-Mode">
    <span class="gt_column_spanner">Decay Mode</span>
  </th>
</tr>
<tr class="gt_col_headings">
  <th class="gt_col_heading gt_columns_bottom_border gt_center" rowspan="1" colspan="1" style="vertical-align: middle; background-color: #EEEEEE;" scope="col" id="decay_1">1</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_center" rowspan="1" colspan="1" style="vertical-align: middle; background-color: #EEEEEE;" scope="col" id="decay_2">2</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_center" rowspan="1" colspan="1" style="vertical-align: middle; background-color: #EEEEEE;" scope="col" id="decay_3">3</th>
</tr>
</thead>
<tbody class="gt_table_body">
  <tr>
    <th style="background-color: Linen; font-weight: bold;" class="gt_row gt_left gt_stub">C-8</th>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">8.0376</td>
    <td style="font-family: IBM Plex Mono; color: Navy; background-color: PaleTurquoise;" class="gt_row gt_right">3.51 × 10<sup style="font-size: 65%;">−21</sup></td>
    <td class="gt_row gt_center">2</td>
    <td class="gt_row gt_center">2P</td>
    <td class="gt_row gt_center">—</td>
    <td class="gt_row gt_center">—</td>
  </tr>
  <tr>
    <th style="background-color: Linen; font-weight: bold;" class="gt_row gt_left gt_stub">C-9</th>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">9.0310</td>
    <td style="font-family: IBM Plex Mono; color: Navy; background-color: PaleTurquoise;" class="gt_row gt_right">1.26 × 10<sup style="font-size: 65%;">−1</sup></td>
    <td class="gt_row gt_center">3/2</td>
    <td class="gt_row gt_center">EC+B+</td>
    <td class="gt_row gt_center">B+P</td>
    <td class="gt_row gt_center">B+A</td>
  </tr>
  <tr>
    <th style="background-color: Linen; font-weight: bold;" class="gt_row gt_left gt_stub">C-10</th>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">10.0169</td>
    <td style="font-family: IBM Plex Mono; color: Navy; background-color: PaleTurquoise;" class="gt_row gt_right">1.93 × 10<sup style="font-size: 65%;">1</sup></td>
    <td class="gt_row gt_center">1</td>
    <td class="gt_row gt_center">EC+B+</td>
    <td class="gt_row gt_center">—</td>
    <td class="gt_row gt_center">—</td>
  </tr>
  <tr>
    <th style="background-color: Linen; font-weight: bold;" class="gt_row gt_left gt_stub">C-11</th>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">11.0114</td>
    <td style="font-family: IBM Plex Mono; color: Navy; background-color: PaleTurquoise;" class="gt_row gt_right">1.22 × 10<sup style="font-size: 65%;">3</sup></td>
    <td class="gt_row gt_center">1/2</td>
    <td class="gt_row gt_center">EC+B+</td>
    <td class="gt_row gt_center">—</td>
    <td class="gt_row gt_center">—</td>
  </tr>
  <tr>
    <th style="background-color: Linen; font-weight: bold; background-color: LightCyan; text-indent: 4px;" class="gt_row gt_left gt_stub">C-12</th>
    <td style="font-family: IBM Plex Mono; background-color: LightCyan;" class="gt_row gt_right">12.0000</td>
    <td style="font-family: IBM Plex Mono; background-color: LightCyan;" class="gt_row gt_right"><strong>STABLE</strong></td>
    <td style="background-color: LightCyan;" class="gt_row gt_center">0</td>
    <td style="background-color: LightCyan;" class="gt_row gt_center">—</td>
    <td style="background-color: LightCyan;" class="gt_row gt_center">—</td>
    <td style="background-color: LightCyan;" class="gt_row gt_center">—</td>
  </tr>
  <tr>
    <th style="background-color: Linen; font-weight: bold; background-color: LightCyan; text-indent: 4px;" class="gt_row gt_left gt_stub">C-13</th>
    <td style="font-family: IBM Plex Mono; background-color: LightCyan;" class="gt_row gt_right">13.0034</td>
    <td style="font-family: IBM Plex Mono; background-color: LightCyan;" class="gt_row gt_right"><strong>STABLE</strong></td>
    <td style="background-color: LightCyan;" class="gt_row gt_center">1/2</td>
    <td style="background-color: LightCyan;" class="gt_row gt_center">—</td>
    <td style="background-color: LightCyan;" class="gt_row gt_center">—</td>
    <td style="background-color: LightCyan;" class="gt_row gt_center">—</td>
  </tr>
  <tr>
    <th style="background-color: Linen; font-weight: bold;" class="gt_row gt_left gt_stub">C-14</th>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">14.0032</td>
    <td style="font-family: IBM Plex Mono; color: Navy; background-color: PaleTurquoise;" class="gt_row gt_right">1.80 × 10<sup style="font-size: 65%;">11</sup></td>
    <td class="gt_row gt_center">1</td>
    <td class="gt_row gt_center">B-</td>
    <td class="gt_row gt_center">—</td>
    <td class="gt_row gt_center">—</td>
  </tr>
  <tr>
    <th style="background-color: Linen; font-weight: bold;" class="gt_row gt_left gt_stub">C-15</th>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">15.0106</td>
    <td style="font-family: IBM Plex Mono; color: Navy; background-color: PaleTurquoise;" class="gt_row gt_right">2.45</td>
    <td class="gt_row gt_center">3/2</td>
    <td class="gt_row gt_center">B-</td>
    <td class="gt_row gt_center">—</td>
    <td class="gt_row gt_center">—</td>
  </tr>
  <tr>
    <th style="background-color: Linen; font-weight: bold;" class="gt_row gt_left gt_stub">C-16</th>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">16.0147</td>
    <td style="font-family: IBM Plex Mono; color: Navy; background-color: PaleTurquoise;" class="gt_row gt_right">7.47 × 10<sup style="font-size: 65%;">−1</sup></td>
    <td class="gt_row gt_center">2</td>
    <td class="gt_row gt_center">B-</td>
    <td class="gt_row gt_center">B-N</td>
    <td class="gt_row gt_center">—</td>
  </tr>
  <tr>
    <th style="background-color: Linen; font-weight: bold;" class="gt_row gt_left gt_stub">C-17</th>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">17.0226</td>
    <td style="font-family: IBM Plex Mono; color: Navy; background-color: PaleTurquoise;" class="gt_row gt_right">1.93 × 10<sup style="font-size: 65%;">−1</sup></td>
    <td class="gt_row gt_center">None</td>
    <td class="gt_row gt_center">B-</td>
    <td class="gt_row gt_center">B-N</td>
    <td class="gt_row gt_center">—</td>
  </tr>
  <tr>
    <th style="background-color: Linen; font-weight: bold;" class="gt_row gt_left gt_stub">C-18</th>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">18.0268</td>
    <td style="font-family: IBM Plex Mono; color: Navy; background-color: PaleTurquoise;" class="gt_row gt_right">9.20 × 10<sup style="font-size: 65%;">−2</sup></td>
    <td class="gt_row gt_center">3</td>
    <td class="gt_row gt_center">B-</td>
    <td class="gt_row gt_center">B-N</td>
    <td class="gt_row gt_center">—</td>
  </tr>
  <tr>
    <th style="background-color: Linen; font-weight: bold;" class="gt_row gt_left gt_stub">C-19</th>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">19.0348</td>
    <td style="font-family: IBM Plex Mono; color: Navy; background-color: PaleTurquoise;" class="gt_row gt_right">4.63 × 10<sup style="font-size: 65%;">−2</sup></td>
    <td class="gt_row gt_center">None</td>
    <td class="gt_row gt_center">B-</td>
    <td class="gt_row gt_center">B-N</td>
    <td class="gt_row gt_center">B-2N</td>
  </tr>
  <tr>
    <th style="background-color: Linen; font-weight: bold;" class="gt_row gt_left gt_stub">C-20</th>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">20.0403</td>
    <td style="font-family: IBM Plex Mono; color: Navy; background-color: PaleTurquoise;" class="gt_row gt_right">1.63 × 10<sup style="font-size: 65%;">−2</sup></td>
    <td class="gt_row gt_center">None</td>
    <td class="gt_row gt_center">B-</td>
    <td class="gt_row gt_center">B-N</td>
    <td class="gt_row gt_center">B-2N</td>
  </tr>
  <tr>
    <th style="background-color: Linen; font-weight: bold;" class="gt_row gt_left gt_stub">C-22</th>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">22.0576</td>
    <td style="font-family: IBM Plex Mono; color: Navy; background-color: PaleTurquoise;" class="gt_row gt_right">6.10 × 10<sup style="font-size: 65%;">−3</sup></td>
    <td class="gt_row gt_center">None</td>
    <td class="gt_row gt_center">B-</td>
    <td class="gt_row gt_center">B-N</td>
    <td class="gt_row gt_center">B-2N</td>
  </tr>
</tbody>
  <tfoot class="gt_sourcenotes">
  
  <tr>
    <td class="gt_sourcenote" colspan="7" style="vertical-align: middle; background-color: #EEEEEE;">Data obtained from the <em>nuclides</em> dataset.</td>
  </tr>

</tfoot>

</table>

</div>
</div>
</div>
<p>Though the order of things matters when setting styles via <code>tab_style()</code>, it’s not a problem here to set a style for the combined ‘header’ location after doing so for the ‘title’ and ‘subtitle’ locations because the ‘font’ attribute <em>wasn’t</em> set by <code>tab_style()</code> for those smaller locations.</p>
</section>
<section id="how-tab_style-fits-in-with-tab_options" class="level3">
<h3 class="anchored" data-anchor-id="how-tab_style-fits-in-with-tab_options">How <code>tab_style()</code> fits in with <code>tab_options()</code></h3>
<p>When it comes to styling, you can use <code>tab_options()</code> for some of the basics and use <code>tab_style()</code> for the more demanding styling tasks. And you could combine the usage of both in your table. Let’s set a default honeydew background fill on the body values:</p>
<div id="e396acde" class="cell" data-execution_count="9">
<div class="code-copy-outer-scaffold"><div class="sourceCode cell-code" id="cb9" style="background: #f1f3f5;"><pre class="sourceCode python code-with-copy"><code class="sourceCode python"><span id="cb9-1">gt_tbl <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> gt_tbl.tab_options(table_background_color<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"HoneyDew"</span>)</span>
<span id="cb9-2"></span>
<span id="cb9-3">gt_tbl</span></code></pre></div></div>
<div class="cell-output cell-output-display" data-execution_count="9">
<div id="hcewwyvxrg" style="padding-left:0px;padding-right:0px;padding-top:10px;padding-bottom:10px;overflow-x:auto;overflow-y:auto;width:auto;height:auto;">
<style>
@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Mono&display=swap');
@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans&display=swap');
@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Serif&display=swap');
#hcewwyvxrg table {
          font-family: 'IBM Plex Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Helvetica Neue', 'Fira Sans', 'Droid Sans', Arial, sans-serif;
          -webkit-font-smoothing: antialiased;
          -moz-osx-font-smoothing: grayscale;
        }

#hcewwyvxrg thead, tbody, tfoot, tr, td, th { border-style: none; }
 tr { background-color: transparent; }
#hcewwyvxrg p { margin: 0; padding: 0; }
 #hcewwyvxrg .gt_table { display: table; border-collapse: collapse; line-height: normal; margin-left: auto; margin-right: auto; color: #333333; font-size: 16px; font-weight: normal; font-style: normal; background-color: HoneyDew; width: auto; border-top-style: solid; border-top-width: 2px; border-top-color: #A8A8A8; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #A8A8A8; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; }
 #hcewwyvxrg .gt_caption { padding-top: 4px; padding-bottom: 4px; }
 #hcewwyvxrg .gt_title { color: #333333; font-size: 125%; font-weight: initial; padding-top: 2px; padding-bottom: 2px; padding-left: 10px; padding-right: 10px; border-bottom-color: HoneyDew; border-bottom-width: 0; }
 #hcewwyvxrg .gt_subtitle { color: #333333; font-size: 85%; font-weight: initial; padding-top: 1px; padding-bottom: 3px; padding-left: 10px; padding-right: 10px; border-top-color: HoneyDew; border-top-width: 0; }
 #hcewwyvxrg .gt_heading { background-color: HoneyDew; text-align: left; border-bottom-color: HoneyDew; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #hcewwyvxrg .gt_bottom_border { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #hcewwyvxrg .gt_col_headings { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #hcewwyvxrg .gt_col_heading { color: #333333; background-color: HoneyDew; font-size: 100%; font-weight: normal; text-transform: inherit; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: bottom; padding-top: 2px; padding-bottom: 3px; padding-left: 10px; padding-right: 10px; overflow-x: hidden; }
 #hcewwyvxrg .gt_column_spanner_outer { color: #333333; background-color: HoneyDew; font-size: 100%; font-weight: normal; text-transform: inherit; padding-top: 0; padding-bottom: 0; padding-left: 4px; padding-right: 4px; }
 #hcewwyvxrg .gt_column_spanner_outer:first-child { padding-left: 0; }
 #hcewwyvxrg .gt_column_spanner_outer:last-child { padding-right: 0; }
 #hcewwyvxrg .gt_column_spanner { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: bottom; padding-top: 2px; padding-bottom: 2px; overflow-x: hidden; display: inline-block; width: 100%; }
 #hcewwyvxrg .gt_spanner_row { border-bottom-style: hidden; }
 #hcewwyvxrg .gt_group_heading { padding-top: 4px; padding-bottom: 4px; padding-left: 10px; padding-right: 10px; color: #333333; background-color: HoneyDew; font-size: 100%; font-weight: initial; text-transform: inherit; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; text-align: left; }
 #hcewwyvxrg .gt_empty_group_heading { padding: 0.5px; color: #333333; background-color: HoneyDew; font-size: 100%; font-weight: initial; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: middle; }
 #hcewwyvxrg .gt_from_md> :first-child { margin-top: 0; }
 #hcewwyvxrg .gt_from_md> :last-child { margin-bottom: 0; }
 #hcewwyvxrg .gt_row { padding-top: 4px; padding-bottom: 4px; padding-left: 10px; padding-right: 10px; margin: 10px; border-top-style: solid; border-top-width: 1px; border-top-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; overflow-x: hidden; }
 #hcewwyvxrg .gt_stub { color: #333333; background-color: HoneyDew; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 10px; padding-right: 10px; }
 #hcewwyvxrg .gt_stub_row_group { color: #333333; background-color: HoneyDew; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 10px; padding-right: 10px; vertical-align: top; }
 #hcewwyvxrg .gt_row_group_first td { border-top-width: 2px; }
 #hcewwyvxrg .gt_row_group_first th { border-top-width: 2px; }
 #hcewwyvxrg .gt_striped { color: #333333; background-color: #F4F4F4; }
 #hcewwyvxrg .gt_table_body { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #hcewwyvxrg .gt_grand_summary_row { color: #333333; background-color: HoneyDew; text-transform: inherit; padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; }
 #hcewwyvxrg .gt_first_grand_summary_row_bottom { border-top-style: double; border-top-width: 6px; border-top-color: #D3D3D3; }
 #hcewwyvxrg .gt_last_grand_summary_row_top { border-bottom-style: double; border-bottom-width: 6px; border-bottom-color: #D3D3D3; }
 #hcewwyvxrg .gt_sourcenotes { color: #333333; background-color: HoneyDew; border-bottom-style: none; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; }
 #hcewwyvxrg .gt_sourcenote { font-size: 90%; padding-top: 2px; padding-bottom: 2px; padding-left: 10px; padding-right: 10px; text-align: left; }
 #hcewwyvxrg .gt_left { text-align: left; }
 #hcewwyvxrg .gt_center { text-align: center; }
 #hcewwyvxrg .gt_right { text-align: right; font-variant-numeric: tabular-nums; }
 #hcewwyvxrg .gt_font_normal { font-weight: normal; }
 #hcewwyvxrg .gt_font_bold { font-weight: bold; }
 #hcewwyvxrg .gt_font_italic { font-style: italic; }
 #hcewwyvxrg .gt_super { font-size: 65%; }
 #hcewwyvxrg .gt_footnote_marks { font-size: 75%; vertical-align: 0.4em; position: initial; }
 #hcewwyvxrg .gt_asterisk { font-size: 100%; vertical-align: 0; }
 
</style>
<table class="gt_table" data-quarto-disable-processing="false" data-quarto-bootstrap="false">
<thead>

  <tr class="gt_heading">
    <td colspan="7" class="gt_heading gt_title gt_font_normal" style="font-family: IBM Plex Serif; font-size: 24px; background-color: aliceblue; border-bottom: 2px solid #BFDFF6;">Isotopes of Carbon</td>
  </tr>
  <tr class="gt_heading">
    <td colspan="7" class="gt_heading gt_subtitle gt_font_normal gt_bottom_border" style="font-family: IBM Plex Serif; padding-top: 5px;padding-bottom: 5px;background-image: linear-gradient(120deg, #d4fc79 0%, #96f6a1 100%);">There are two stable isotopes of carbon and twelve that are unstable.</td>
  </tr>
<tr class="gt_col_headings gt_spanner_row">
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="2" colspan="1" style="vertical-align: middle; background-color: #EEEEEE;" scope="col" id="Isotope">Isotope</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="2" colspan="1" style="vertical-align: middle; background-color: #EEEEEE;" scope="col" id="atomic_mass">Atomic Mass</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="2" colspan="1" style="vertical-align: middle; background-color: #EEEEEE;" scope="col" id="half_life">Half Life, s</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_center" rowspan="2" colspan="1" style="vertical-align: middle; background-color: #EEEEEE;" scope="col" id="isospin">Isospin</th>
  <th class="gt_center gt_columns_top_border gt_column_spanner_outer" rowspan="1" colspan="3" style="vertical-align: middle; background-color: #EEEEEE;" scope="colgroup" id="Decay-Mode">
    <span class="gt_column_spanner">Decay Mode</span>
  </th>
</tr>
<tr class="gt_col_headings">
  <th class="gt_col_heading gt_columns_bottom_border gt_center" rowspan="1" colspan="1" style="vertical-align: middle; background-color: #EEEEEE;" scope="col" id="decay_1">1</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_center" rowspan="1" colspan="1" style="vertical-align: middle; background-color: #EEEEEE;" scope="col" id="decay_2">2</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_center" rowspan="1" colspan="1" style="vertical-align: middle; background-color: #EEEEEE;" scope="col" id="decay_3">3</th>
</tr>
</thead>
<tbody class="gt_table_body">
  <tr>
    <th style="background-color: Linen; font-weight: bold;" class="gt_row gt_left gt_stub">C-8</th>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">8.0376</td>
    <td style="font-family: IBM Plex Mono; color: Navy; background-color: PaleTurquoise;" class="gt_row gt_right">3.51 × 10<sup style="font-size: 65%;">−21</sup></td>
    <td class="gt_row gt_center">2</td>
    <td class="gt_row gt_center">2P</td>
    <td class="gt_row gt_center">—</td>
    <td class="gt_row gt_center">—</td>
  </tr>
  <tr>
    <th style="background-color: Linen; font-weight: bold;" class="gt_row gt_left gt_stub">C-9</th>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">9.0310</td>
    <td style="font-family: IBM Plex Mono; color: Navy; background-color: PaleTurquoise;" class="gt_row gt_right">1.26 × 10<sup style="font-size: 65%;">−1</sup></td>
    <td class="gt_row gt_center">3/2</td>
    <td class="gt_row gt_center">EC+B+</td>
    <td class="gt_row gt_center">B+P</td>
    <td class="gt_row gt_center">B+A</td>
  </tr>
  <tr>
    <th style="background-color: Linen; font-weight: bold;" class="gt_row gt_left gt_stub">C-10</th>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">10.0169</td>
    <td style="font-family: IBM Plex Mono; color: Navy; background-color: PaleTurquoise;" class="gt_row gt_right">1.93 × 10<sup style="font-size: 65%;">1</sup></td>
    <td class="gt_row gt_center">1</td>
    <td class="gt_row gt_center">EC+B+</td>
    <td class="gt_row gt_center">—</td>
    <td class="gt_row gt_center">—</td>
  </tr>
  <tr>
    <th style="background-color: Linen; font-weight: bold;" class="gt_row gt_left gt_stub">C-11</th>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">11.0114</td>
    <td style="font-family: IBM Plex Mono; color: Navy; background-color: PaleTurquoise;" class="gt_row gt_right">1.22 × 10<sup style="font-size: 65%;">3</sup></td>
    <td class="gt_row gt_center">1/2</td>
    <td class="gt_row gt_center">EC+B+</td>
    <td class="gt_row gt_center">—</td>
    <td class="gt_row gt_center">—</td>
  </tr>
  <tr>
    <th style="background-color: Linen; font-weight: bold; background-color: LightCyan; text-indent: 4px;" class="gt_row gt_left gt_stub">C-12</th>
    <td style="font-family: IBM Plex Mono; background-color: LightCyan;" class="gt_row gt_right">12.0000</td>
    <td style="font-family: IBM Plex Mono; background-color: LightCyan;" class="gt_row gt_right"><strong>STABLE</strong></td>
    <td style="background-color: LightCyan;" class="gt_row gt_center">0</td>
    <td style="background-color: LightCyan;" class="gt_row gt_center">—</td>
    <td style="background-color: LightCyan;" class="gt_row gt_center">—</td>
    <td style="background-color: LightCyan;" class="gt_row gt_center">—</td>
  </tr>
  <tr>
    <th style="background-color: Linen; font-weight: bold; background-color: LightCyan; text-indent: 4px;" class="gt_row gt_left gt_stub">C-13</th>
    <td style="font-family: IBM Plex Mono; background-color: LightCyan;" class="gt_row gt_right">13.0034</td>
    <td style="font-family: IBM Plex Mono; background-color: LightCyan;" class="gt_row gt_right"><strong>STABLE</strong></td>
    <td style="background-color: LightCyan;" class="gt_row gt_center">1/2</td>
    <td style="background-color: LightCyan;" class="gt_row gt_center">—</td>
    <td style="background-color: LightCyan;" class="gt_row gt_center">—</td>
    <td style="background-color: LightCyan;" class="gt_row gt_center">—</td>
  </tr>
  <tr>
    <th style="background-color: Linen; font-weight: bold;" class="gt_row gt_left gt_stub">C-14</th>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">14.0032</td>
    <td style="font-family: IBM Plex Mono; color: Navy; background-color: PaleTurquoise;" class="gt_row gt_right">1.80 × 10<sup style="font-size: 65%;">11</sup></td>
    <td class="gt_row gt_center">1</td>
    <td class="gt_row gt_center">B-</td>
    <td class="gt_row gt_center">—</td>
    <td class="gt_row gt_center">—</td>
  </tr>
  <tr>
    <th style="background-color: Linen; font-weight: bold;" class="gt_row gt_left gt_stub">C-15</th>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">15.0106</td>
    <td style="font-family: IBM Plex Mono; color: Navy; background-color: PaleTurquoise;" class="gt_row gt_right">2.45</td>
    <td class="gt_row gt_center">3/2</td>
    <td class="gt_row gt_center">B-</td>
    <td class="gt_row gt_center">—</td>
    <td class="gt_row gt_center">—</td>
  </tr>
  <tr>
    <th style="background-color: Linen; font-weight: bold;" class="gt_row gt_left gt_stub">C-16</th>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">16.0147</td>
    <td style="font-family: IBM Plex Mono; color: Navy; background-color: PaleTurquoise;" class="gt_row gt_right">7.47 × 10<sup style="font-size: 65%;">−1</sup></td>
    <td class="gt_row gt_center">2</td>
    <td class="gt_row gt_center">B-</td>
    <td class="gt_row gt_center">B-N</td>
    <td class="gt_row gt_center">—</td>
  </tr>
  <tr>
    <th style="background-color: Linen; font-weight: bold;" class="gt_row gt_left gt_stub">C-17</th>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">17.0226</td>
    <td style="font-family: IBM Plex Mono; color: Navy; background-color: PaleTurquoise;" class="gt_row gt_right">1.93 × 10<sup style="font-size: 65%;">−1</sup></td>
    <td class="gt_row gt_center">None</td>
    <td class="gt_row gt_center">B-</td>
    <td class="gt_row gt_center">B-N</td>
    <td class="gt_row gt_center">—</td>
  </tr>
  <tr>
    <th style="background-color: Linen; font-weight: bold;" class="gt_row gt_left gt_stub">C-18</th>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">18.0268</td>
    <td style="font-family: IBM Plex Mono; color: Navy; background-color: PaleTurquoise;" class="gt_row gt_right">9.20 × 10<sup style="font-size: 65%;">−2</sup></td>
    <td class="gt_row gt_center">3</td>
    <td class="gt_row gt_center">B-</td>
    <td class="gt_row gt_center">B-N</td>
    <td class="gt_row gt_center">—</td>
  </tr>
  <tr>
    <th style="background-color: Linen; font-weight: bold;" class="gt_row gt_left gt_stub">C-19</th>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">19.0348</td>
    <td style="font-family: IBM Plex Mono; color: Navy; background-color: PaleTurquoise;" class="gt_row gt_right">4.63 × 10<sup style="font-size: 65%;">−2</sup></td>
    <td class="gt_row gt_center">None</td>
    <td class="gt_row gt_center">B-</td>
    <td class="gt_row gt_center">B-N</td>
    <td class="gt_row gt_center">B-2N</td>
  </tr>
  <tr>
    <th style="background-color: Linen; font-weight: bold;" class="gt_row gt_left gt_stub">C-20</th>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">20.0403</td>
    <td style="font-family: IBM Plex Mono; color: Navy; background-color: PaleTurquoise;" class="gt_row gt_right">1.63 × 10<sup style="font-size: 65%;">−2</sup></td>
    <td class="gt_row gt_center">None</td>
    <td class="gt_row gt_center">B-</td>
    <td class="gt_row gt_center">B-N</td>
    <td class="gt_row gt_center">B-2N</td>
  </tr>
  <tr>
    <th style="background-color: Linen; font-weight: bold;" class="gt_row gt_left gt_stub">C-22</th>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">22.0576</td>
    <td style="font-family: IBM Plex Mono; color: Navy; background-color: PaleTurquoise;" class="gt_row gt_right">6.10 × 10<sup style="font-size: 65%;">−3</sup></td>
    <td class="gt_row gt_center">None</td>
    <td class="gt_row gt_center">B-</td>
    <td class="gt_row gt_center">B-N</td>
    <td class="gt_row gt_center">B-2N</td>
  </tr>
</tbody>
  <tfoot class="gt_sourcenotes">
  
  <tr>
    <td class="gt_sourcenote" colspan="7" style="vertical-align: middle; background-color: #EEEEEE;">Data obtained from the <em>nuclides</em> dataset.</td>
  </tr>

</tfoot>

</table>

</div>
</div>
</div>
<p>In the example, we asked for the HoneyDew background fill on the entire table with <code>tab_options()</code>. However, even though <code>tab_options()</code> was used after those <code>tab_style()</code> invocations, the ‘HoneyDew’ background color was only applied to the locations that didn’t have a background color set through <code>tab_style(). The important takeaway here is that the precedence (or priority) is *always* given to</code>tab_style()`, regardless of the order of invocation.</p>
</section>
<section id="wrapping-up" class="level3">
<h3 class="anchored" data-anchor-id="wrapping-up">Wrapping up</h3>
<p>We’d like to thank <a href="https://github.com/timkpaine">Tim Paine</a> for getting the expanded <code>loc</code> work off the ground. Additionally, we are grateful to <a href="https://github.com/jrycw">Jerry Wu</a> for his contributions to the <code>v0.13.0</code> release of the package.</p>
<p>We’d be very pleased to receive comments or suggestions on the new functionality. <a href="https://github.com/posit-dev/great-tables/issues">GitHub Issues</a> or <a href="https://github.com/posit-dev/great-tables/discussions">GitHub Discussions</a> are both fine venues for getting in touch with us. Finally, if ever you want to talk about tables with us, you’re always welcome to jump into our <a href="https://discord.com/invite/Ux7nrcXHVV">Discord Server</a>.</p>


</section>

 ]]></description>
  <guid>https://posit-dev.github.io/great-tables/blog/introduction-0.13.0/</guid>
  <pubDate>Thu, 10 Oct 2024 00:00:00 GMT</pubDate>
</item>
<item>
  <title>Great Tables v0.12.0: Google Fonts and zebra stripes</title>
  <dc:creator>Rich Iannone</dc:creator>
  <link>https://posit-dev.github.io/great-tables/blog/introduction-0.12.0/</link>
  <description><![CDATA[ 




<p>In Great Tables <code>0.12.0</code> we focused on adding options for customizing the appearance of a table. In this post, we’ll present two new features:</p>
<ul>
<li>using typefaces from Google Fonts via <code>tab_style()</code> and <code>opt_table_font()</code></li>
<li>adding table striping via <code>tab_options()</code> and <code>opt_row_striping()</code></li>
</ul>
<p>Let’s have a look at how these new features can be used!</p>
<section id="using-fonts-from-google-fonts" class="level3">
<h3 class="anchored" data-anchor-id="using-fonts-from-google-fonts">Using fonts from Google Fonts</h3>
<p>Google Fonts is a free service that allows use of hosted typefaces in your own websites. In Great Tables, we added the <a href="../../reference/google_font.html#great_tables.google_font" title="0"><code>google_font()</code></a> helper function to easily incorporate such fonts in your tables. There are two ways to go about this:</p>
<ol type="1">
<li>use <a href="../../reference/google_font.html#great_tables.google_font" title="0"><code>google_font()</code></a> with <code>opt_table_font()</code> to set a Google Font for the entire table</li>
<li>invoke <a href="../../reference/google_font.html#great_tables.google_font" title="0"><code>google_font()</code></a> within <code>tab_style(styles=style.text(font=...))</code> to set the font within a location</li>
</ol>
<p>Let’s start with this small table that uses the default set of fonts for the entire table.</p>
<div id="a80a65c8" class="cell" data-execution_count="1">
<details class="code-fold">
<summary>Show the code</summary>
<div class="code-copy-outer-scaffold"><div class="sourceCode cell-code" id="cb1" style="background: #f1f3f5;"><pre class="sourceCode python code-with-copy"><code class="sourceCode python"><span id="cb1-1"><span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">from</span> great_tables <span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">import</span> GT, exibble, style, loc</span>
<span id="cb1-2"></span>
<span id="cb1-3">gt_tbl <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> (</span>
<span id="cb1-4">    GT(exibble.head(), rowname_col<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"row"</span>, groupname_col<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"group"</span>)</span>
<span id="cb1-5">    .cols_hide(columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>[<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"char"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"fctr"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"date"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"time"</span>])</span>
<span id="cb1-6">    .tab_header(</span>
<span id="cb1-7">        title<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"A small piece of the exibble dataset"</span>,</span>
<span id="cb1-8">        subtitle<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Displaying the first five rows (of eight)"</span>,</span>
<span id="cb1-9">    )</span>
<span id="cb1-10">    .tab_source_note(</span>
<span id="cb1-11">        source_note<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"This dataset is included in Great Tables."</span></span>
<span id="cb1-12">    )</span>
<span id="cb1-13">)</span>
<span id="cb1-14"></span>
<span id="cb1-15">gt_tbl</span></code></pre></div></div>
</details>
<div class="cell-output cell-output-display" data-execution_count="1">
<div id="uofrnrfgcq" style="padding-left:0px;padding-right:0px;padding-top:10px;padding-bottom:10px;overflow-x:auto;overflow-y:auto;width:auto;height:auto;">
<style>
#uofrnrfgcq table {
          font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Helvetica Neue', 'Fira Sans', 'Droid Sans', Arial, sans-serif;
          -webkit-font-smoothing: antialiased;
          -moz-osx-font-smoothing: grayscale;
        }

#uofrnrfgcq thead, tbody, tfoot, tr, td, th { border-style: none; }
 tr { background-color: transparent; }
#uofrnrfgcq p { margin: 0; padding: 0; }
 #uofrnrfgcq .gt_table { display: table; border-collapse: collapse; line-height: normal; margin-left: auto; margin-right: auto; color: #333333; font-size: 16px; font-weight: normal; font-style: normal; background-color: #FFFFFF; width: auto; border-top-style: solid; border-top-width: 2px; border-top-color: #A8A8A8; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #A8A8A8; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; }
 #uofrnrfgcq .gt_caption { padding-top: 4px; padding-bottom: 4px; }
 #uofrnrfgcq .gt_title { color: #333333; font-size: 125%; font-weight: initial; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; border-bottom-color: #FFFFFF; border-bottom-width: 0; }
 #uofrnrfgcq .gt_subtitle { color: #333333; font-size: 85%; font-weight: initial; padding-top: 3px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; border-top-color: #FFFFFF; border-top-width: 0; }
 #uofrnrfgcq .gt_heading { background-color: #FFFFFF; text-align: center; border-bottom-color: #FFFFFF; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #uofrnrfgcq .gt_bottom_border { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #uofrnrfgcq .gt_col_headings { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #uofrnrfgcq .gt_col_heading { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; overflow-x: hidden; }
 #uofrnrfgcq .gt_column_spanner_outer { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; padding-top: 0; padding-bottom: 0; padding-left: 4px; padding-right: 4px; }
 #uofrnrfgcq .gt_column_spanner_outer:first-child { padding-left: 0; }
 #uofrnrfgcq .gt_column_spanner_outer:last-child { padding-right: 0; }
 #uofrnrfgcq .gt_column_spanner { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; overflow-x: hidden; display: inline-block; width: 100%; }
 #uofrnrfgcq .gt_spanner_row { border-bottom-style: hidden; }
 #uofrnrfgcq .gt_group_heading { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; text-align: left; }
 #uofrnrfgcq .gt_empty_group_heading { padding: 0.5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: middle; }
 #uofrnrfgcq .gt_from_md> :first-child { margin-top: 0; }
 #uofrnrfgcq .gt_from_md> :last-child { margin-bottom: 0; }
 #uofrnrfgcq .gt_row { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; margin: 10px; border-top-style: solid; border-top-width: 1px; border-top-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; overflow-x: hidden; }
 #uofrnrfgcq .gt_stub { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; }
 #uofrnrfgcq .gt_stub_row_group { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; vertical-align: top; }
 #uofrnrfgcq .gt_row_group_first td { border-top-width: 2px; }
 #uofrnrfgcq .gt_row_group_first th { border-top-width: 2px; }
 #uofrnrfgcq .gt_striped { color: #333333; background-color: #F4F4F4; }
 #uofrnrfgcq .gt_table_body { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #uofrnrfgcq .gt_grand_summary_row { color: #333333; background-color: #FFFFFF; text-transform: inherit; padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; }
 #uofrnrfgcq .gt_first_grand_summary_row_bottom { border-top-style: double; border-top-width: 6px; border-top-color: #D3D3D3; }
 #uofrnrfgcq .gt_last_grand_summary_row_top { border-bottom-style: double; border-bottom-width: 6px; border-bottom-color: #D3D3D3; }
 #uofrnrfgcq .gt_sourcenotes { color: #333333; background-color: #FFFFFF; border-bottom-style: none; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; }
 #uofrnrfgcq .gt_sourcenote { font-size: 90%; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; text-align: left; }
 #uofrnrfgcq .gt_left { text-align: left; }
 #uofrnrfgcq .gt_center { text-align: center; }
 #uofrnrfgcq .gt_right { text-align: right; font-variant-numeric: tabular-nums; }
 #uofrnrfgcq .gt_font_normal { font-weight: normal; }
 #uofrnrfgcq .gt_font_bold { font-weight: bold; }
 #uofrnrfgcq .gt_font_italic { font-style: italic; }
 #uofrnrfgcq .gt_super { font-size: 65%; }
 #uofrnrfgcq .gt_footnote_marks { font-size: 75%; vertical-align: 0.4em; position: initial; }
 #uofrnrfgcq .gt_asterisk { font-size: 100%; vertical-align: 0; }
 
</style>
<table class="gt_table" data-quarto-disable-processing="false" data-quarto-bootstrap="false">
<thead>

  <tr class="gt_heading">
    <td colspan="4" class="gt_heading gt_title gt_font_normal">A small piece of the exibble dataset</td>
  </tr>
  <tr class="gt_heading">
    <td colspan="4" class="gt_heading gt_subtitle gt_font_normal gt_bottom_border">Displaying the first five rows (of eight)</td>
  </tr>
<tr class="gt_col_headings">
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="1" colspan="1" scope="col" id=""></th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="num">num</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="datetime">datetime</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="currency">currency</th>
</tr>
</thead>
<tbody class="gt_table_body">
  <tr class="gt_group_heading_row">
    <th class="gt_group_heading" colspan="4">grp_a</th>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">row_1</th>
    <td class="gt_row gt_right">0.1111</td>
    <td class="gt_row gt_right">2018-01-01 02:22</td>
    <td class="gt_row gt_right">49.95</td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">row_2</th>
    <td class="gt_row gt_right">2.222</td>
    <td class="gt_row gt_right">2018-02-02 14:33</td>
    <td class="gt_row gt_right">17.95</td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">row_3</th>
    <td class="gt_row gt_right">33.33</td>
    <td class="gt_row gt_right">2018-03-03 03:44</td>
    <td class="gt_row gt_right">1.39</td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">row_4</th>
    <td class="gt_row gt_right">444.4</td>
    <td class="gt_row gt_right">2018-04-04 15:55</td>
    <td class="gt_row gt_right">65100.0</td>
  </tr>
  <tr class="gt_group_heading_row">
    <th class="gt_group_heading" colspan="4">grp_b</th>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">row_5</th>
    <td class="gt_row gt_right">5550.0</td>
    <td class="gt_row gt_right">2018-05-05 04:00</td>
    <td class="gt_row gt_right">1325.81</td>
  </tr>
</tbody>
  <tfoot class="gt_sourcenotes">
  
  <tr>
    <td class="gt_sourcenote" colspan="4">This dataset is included in Great Tables.</td>
  </tr>

</tfoot>

</table>

</div>
</div>
</div>
<p>Now, with <code>opt_table_font()</code> + <a href="../../reference/google_font.html#great_tables.google_font" title="0"><code>google_font()</code></a>, we’ll change the table’s font to one from Google Fonts. I like <a href="https://fonts.google.com/noto/specimen/Noto+Serif"><code>Noto Serif</code></a> so let’s use that here!</p>
<div id="720b97fe" class="cell" data-execution_count="2">
<div class="code-copy-outer-scaffold"><div class="sourceCode cell-code" id="cb2" style="background: #f1f3f5;"><pre class="sourceCode python code-with-copy"><code class="sourceCode python"><span id="cb2-1"><span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">from</span> great_tables <span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">import</span> GT, exibble, style, loc, google_font</span>
<span id="cb2-2"></span>
<span id="cb2-3">(</span>
<span id="cb2-4">    gt_tbl</span>
<span id="cb2-5">    .opt_table_font(font<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>google_font(name<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Noto Serif"</span>))</span>
<span id="cb2-6">)</span></code></pre></div></div>
<div class="cell-output cell-output-display" data-execution_count="2">
<div id="evpxfdhvwg" style="padding-left:0px;padding-right:0px;padding-top:10px;padding-bottom:10px;overflow-x:auto;overflow-y:auto;width:auto;height:auto;">
<style>
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif&display=swap');
#evpxfdhvwg table {
          font-family: 'Noto Serif', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Helvetica Neue', 'Fira Sans', 'Droid Sans', Arial, sans-serif;
          -webkit-font-smoothing: antialiased;
          -moz-osx-font-smoothing: grayscale;
        }

#evpxfdhvwg thead, tbody, tfoot, tr, td, th { border-style: none; }
 tr { background-color: transparent; }
#evpxfdhvwg p { margin: 0; padding: 0; }
 #evpxfdhvwg .gt_table { display: table; border-collapse: collapse; line-height: normal; margin-left: auto; margin-right: auto; color: #333333; font-size: 16px; font-weight: normal; font-style: normal; background-color: #FFFFFF; width: auto; border-top-style: solid; border-top-width: 2px; border-top-color: #A8A8A8; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #A8A8A8; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; }
 #evpxfdhvwg .gt_caption { padding-top: 4px; padding-bottom: 4px; }
 #evpxfdhvwg .gt_title { color: #333333; font-size: 125%; font-weight: initial; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; border-bottom-color: #FFFFFF; border-bottom-width: 0; }
 #evpxfdhvwg .gt_subtitle { color: #333333; font-size: 85%; font-weight: initial; padding-top: 3px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; border-top-color: #FFFFFF; border-top-width: 0; }
 #evpxfdhvwg .gt_heading { background-color: #FFFFFF; text-align: center; border-bottom-color: #FFFFFF; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #evpxfdhvwg .gt_bottom_border { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #evpxfdhvwg .gt_col_headings { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #evpxfdhvwg .gt_col_heading { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; overflow-x: hidden; }
 #evpxfdhvwg .gt_column_spanner_outer { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; padding-top: 0; padding-bottom: 0; padding-left: 4px; padding-right: 4px; }
 #evpxfdhvwg .gt_column_spanner_outer:first-child { padding-left: 0; }
 #evpxfdhvwg .gt_column_spanner_outer:last-child { padding-right: 0; }
 #evpxfdhvwg .gt_column_spanner { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; overflow-x: hidden; display: inline-block; width: 100%; }
 #evpxfdhvwg .gt_spanner_row { border-bottom-style: hidden; }
 #evpxfdhvwg .gt_group_heading { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; text-align: left; }
 #evpxfdhvwg .gt_empty_group_heading { padding: 0.5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: middle; }
 #evpxfdhvwg .gt_from_md> :first-child { margin-top: 0; }
 #evpxfdhvwg .gt_from_md> :last-child { margin-bottom: 0; }
 #evpxfdhvwg .gt_row { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; margin: 10px; border-top-style: solid; border-top-width: 1px; border-top-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; overflow-x: hidden; }
 #evpxfdhvwg .gt_stub { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; }
 #evpxfdhvwg .gt_stub_row_group { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; vertical-align: top; }
 #evpxfdhvwg .gt_row_group_first td { border-top-width: 2px; }
 #evpxfdhvwg .gt_row_group_first th { border-top-width: 2px; }
 #evpxfdhvwg .gt_striped { color: #333333; background-color: #F4F4F4; }
 #evpxfdhvwg .gt_table_body { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #evpxfdhvwg .gt_grand_summary_row { color: #333333; background-color: #FFFFFF; text-transform: inherit; padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; }
 #evpxfdhvwg .gt_first_grand_summary_row_bottom { border-top-style: double; border-top-width: 6px; border-top-color: #D3D3D3; }
 #evpxfdhvwg .gt_last_grand_summary_row_top { border-bottom-style: double; border-bottom-width: 6px; border-bottom-color: #D3D3D3; }
 #evpxfdhvwg .gt_sourcenotes { color: #333333; background-color: #FFFFFF; border-bottom-style: none; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; }
 #evpxfdhvwg .gt_sourcenote { font-size: 90%; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; text-align: left; }
 #evpxfdhvwg .gt_left { text-align: left; }
 #evpxfdhvwg .gt_center { text-align: center; }
 #evpxfdhvwg .gt_right { text-align: right; font-variant-numeric: tabular-nums; }
 #evpxfdhvwg .gt_font_normal { font-weight: normal; }
 #evpxfdhvwg .gt_font_bold { font-weight: bold; }
 #evpxfdhvwg .gt_font_italic { font-style: italic; }
 #evpxfdhvwg .gt_super { font-size: 65%; }
 #evpxfdhvwg .gt_footnote_marks { font-size: 75%; vertical-align: 0.4em; position: initial; }
 #evpxfdhvwg .gt_asterisk { font-size: 100%; vertical-align: 0; }
 
</style>
<table class="gt_table" data-quarto-disable-processing="false" data-quarto-bootstrap="false">
<thead>

  <tr class="gt_heading">
    <td colspan="4" class="gt_heading gt_title gt_font_normal">A small piece of the exibble dataset</td>
  </tr>
  <tr class="gt_heading">
    <td colspan="4" class="gt_heading gt_subtitle gt_font_normal gt_bottom_border">Displaying the first five rows (of eight)</td>
  </tr>
<tr class="gt_col_headings">
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="1" colspan="1" scope="col" id=""></th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="num">num</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="datetime">datetime</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="currency">currency</th>
</tr>
</thead>
<tbody class="gt_table_body">
  <tr class="gt_group_heading_row">
    <th class="gt_group_heading" colspan="4">grp_a</th>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">row_1</th>
    <td class="gt_row gt_right">0.1111</td>
    <td class="gt_row gt_right">2018-01-01 02:22</td>
    <td class="gt_row gt_right">49.95</td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">row_2</th>
    <td class="gt_row gt_right">2.222</td>
    <td class="gt_row gt_right">2018-02-02 14:33</td>
    <td class="gt_row gt_right">17.95</td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">row_3</th>
    <td class="gt_row gt_right">33.33</td>
    <td class="gt_row gt_right">2018-03-03 03:44</td>
    <td class="gt_row gt_right">1.39</td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">row_4</th>
    <td class="gt_row gt_right">444.4</td>
    <td class="gt_row gt_right">2018-04-04 15:55</td>
    <td class="gt_row gt_right">65100.0</td>
  </tr>
  <tr class="gt_group_heading_row">
    <th class="gt_group_heading" colspan="4">grp_b</th>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">row_5</th>
    <td class="gt_row gt_right">5550.0</td>
    <td class="gt_row gt_right">2018-05-05 04:00</td>
    <td class="gt_row gt_right">1325.81</td>
  </tr>
</tbody>
  <tfoot class="gt_sourcenotes">
  
  <tr>
    <td class="gt_sourcenote" colspan="4">This dataset is included in Great Tables.</td>
  </tr>

</tfoot>

</table>

</div>
</div>
</div>
<p>Looking good! And we don’t have to apply the font to the entire table. We might just wanted to use a Google Font in the table body. For that use case, <code>tab_style()</code> is the preferred method. Here’s an example that uses the <a href="https://fonts.google.com/specimen/IBM+Plex+Mono"><code>IBM Plex Mono</code></a> typeface.</p>
<div id="708ca379" class="cell" data-execution_count="3">
<div class="code-copy-outer-scaffold"><div class="sourceCode cell-code" id="cb3" style="background: #f1f3f5;"><pre class="sourceCode python code-with-copy"><code class="sourceCode python"><span id="cb3-1">(</span>
<span id="cb3-2">    gt_tbl</span>
<span id="cb3-3">    .tab_style(</span>
<span id="cb3-4">        style<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>style.text(font<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>google_font(name<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"IBM Plex Mono"</span>)),</span>
<span id="cb3-5">        locations<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>loc.body()</span>
<span id="cb3-6">    )</span>
<span id="cb3-7">)</span></code></pre></div></div>
<div class="cell-output cell-output-display" data-execution_count="3">
<div id="sdxsiaztdb" style="padding-left:0px;padding-right:0px;padding-top:10px;padding-bottom:10px;overflow-x:auto;overflow-y:auto;width:auto;height:auto;">
<style>
@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Mono&display=swap');
#sdxsiaztdb table {
          font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Helvetica Neue', 'Fira Sans', 'Droid Sans', Arial, sans-serif;
          -webkit-font-smoothing: antialiased;
          -moz-osx-font-smoothing: grayscale;
        }

#sdxsiaztdb thead, tbody, tfoot, tr, td, th { border-style: none; }
 tr { background-color: transparent; }
#sdxsiaztdb p { margin: 0; padding: 0; }
 #sdxsiaztdb .gt_table { display: table; border-collapse: collapse; line-height: normal; margin-left: auto; margin-right: auto; color: #333333; font-size: 16px; font-weight: normal; font-style: normal; background-color: #FFFFFF; width: auto; border-top-style: solid; border-top-width: 2px; border-top-color: #A8A8A8; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #A8A8A8; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; }
 #sdxsiaztdb .gt_caption { padding-top: 4px; padding-bottom: 4px; }
 #sdxsiaztdb .gt_title { color: #333333; font-size: 125%; font-weight: initial; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; border-bottom-color: #FFFFFF; border-bottom-width: 0; }
 #sdxsiaztdb .gt_subtitle { color: #333333; font-size: 85%; font-weight: initial; padding-top: 3px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; border-top-color: #FFFFFF; border-top-width: 0; }
 #sdxsiaztdb .gt_heading { background-color: #FFFFFF; text-align: center; border-bottom-color: #FFFFFF; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #sdxsiaztdb .gt_bottom_border { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #sdxsiaztdb .gt_col_headings { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #sdxsiaztdb .gt_col_heading { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; overflow-x: hidden; }
 #sdxsiaztdb .gt_column_spanner_outer { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; padding-top: 0; padding-bottom: 0; padding-left: 4px; padding-right: 4px; }
 #sdxsiaztdb .gt_column_spanner_outer:first-child { padding-left: 0; }
 #sdxsiaztdb .gt_column_spanner_outer:last-child { padding-right: 0; }
 #sdxsiaztdb .gt_column_spanner { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; overflow-x: hidden; display: inline-block; width: 100%; }
 #sdxsiaztdb .gt_spanner_row { border-bottom-style: hidden; }
 #sdxsiaztdb .gt_group_heading { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; text-align: left; }
 #sdxsiaztdb .gt_empty_group_heading { padding: 0.5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: middle; }
 #sdxsiaztdb .gt_from_md> :first-child { margin-top: 0; }
 #sdxsiaztdb .gt_from_md> :last-child { margin-bottom: 0; }
 #sdxsiaztdb .gt_row { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; margin: 10px; border-top-style: solid; border-top-width: 1px; border-top-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; overflow-x: hidden; }
 #sdxsiaztdb .gt_stub { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; }
 #sdxsiaztdb .gt_stub_row_group { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; vertical-align: top; }
 #sdxsiaztdb .gt_row_group_first td { border-top-width: 2px; }
 #sdxsiaztdb .gt_row_group_first th { border-top-width: 2px; }
 #sdxsiaztdb .gt_striped { color: #333333; background-color: #F4F4F4; }
 #sdxsiaztdb .gt_table_body { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #sdxsiaztdb .gt_grand_summary_row { color: #333333; background-color: #FFFFFF; text-transform: inherit; padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; }
 #sdxsiaztdb .gt_first_grand_summary_row_bottom { border-top-style: double; border-top-width: 6px; border-top-color: #D3D3D3; }
 #sdxsiaztdb .gt_last_grand_summary_row_top { border-bottom-style: double; border-bottom-width: 6px; border-bottom-color: #D3D3D3; }
 #sdxsiaztdb .gt_sourcenotes { color: #333333; background-color: #FFFFFF; border-bottom-style: none; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; }
 #sdxsiaztdb .gt_sourcenote { font-size: 90%; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; text-align: left; }
 #sdxsiaztdb .gt_left { text-align: left; }
 #sdxsiaztdb .gt_center { text-align: center; }
 #sdxsiaztdb .gt_right { text-align: right; font-variant-numeric: tabular-nums; }
 #sdxsiaztdb .gt_font_normal { font-weight: normal; }
 #sdxsiaztdb .gt_font_bold { font-weight: bold; }
 #sdxsiaztdb .gt_font_italic { font-style: italic; }
 #sdxsiaztdb .gt_super { font-size: 65%; }
 #sdxsiaztdb .gt_footnote_marks { font-size: 75%; vertical-align: 0.4em; position: initial; }
 #sdxsiaztdb .gt_asterisk { font-size: 100%; vertical-align: 0; }
 
</style>
<table class="gt_table" data-quarto-disable-processing="false" data-quarto-bootstrap="false">
<thead>

  <tr class="gt_heading">
    <td colspan="4" class="gt_heading gt_title gt_font_normal">A small piece of the exibble dataset</td>
  </tr>
  <tr class="gt_heading">
    <td colspan="4" class="gt_heading gt_subtitle gt_font_normal gt_bottom_border">Displaying the first five rows (of eight)</td>
  </tr>
<tr class="gt_col_headings">
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="1" colspan="1" scope="col" id=""></th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="num">num</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="datetime">datetime</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="currency">currency</th>
</tr>
</thead>
<tbody class="gt_table_body">
  <tr class="gt_group_heading_row">
    <th class="gt_group_heading" colspan="4">grp_a</th>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">row_1</th>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">0.1111</td>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">2018-01-01 02:22</td>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">49.95</td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">row_2</th>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">2.222</td>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">2018-02-02 14:33</td>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">17.95</td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">row_3</th>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">33.33</td>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">2018-03-03 03:44</td>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">1.39</td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">row_4</th>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">444.4</td>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">2018-04-04 15:55</td>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">65100.0</td>
  </tr>
  <tr class="gt_group_heading_row">
    <th class="gt_group_heading" colspan="4">grp_b</th>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">row_5</th>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">5550.0</td>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">2018-05-05 04:00</td>
    <td style="font-family: IBM Plex Mono;" class="gt_row gt_right">1325.81</td>
  </tr>
</tbody>
  <tfoot class="gt_sourcenotes">
  
  <tr>
    <td class="gt_sourcenote" colspan="4">This dataset is included in Great Tables.</td>
  </tr>

</tfoot>

</table>

</div>
</div>
</div>
<p>Nice! And it’s refreshing to see tables with fonts different from default set, as good as it might be. We kept the <a href="../../reference/google_font.html#great_tables.google_font" title="0"><code>google_font()</code></a> helper function as simple as possible, requiring only the font name in its <code>name=</code> argument. There are hundreds of fonts hosted on <a href="https://fonts.google.com">Google Fonts</a> so look through the site, experiment, and find the fonts that you think look best in your tables!</p>
</section>
<section id="striping-rows-in-your-table" class="level3">
<h3 class="anchored" data-anchor-id="striping-rows-in-your-table">Striping rows in your table</h3>
<p>Some people like having row striping (a.k.a. zebra stripes) in their display tables. We also know that some <a href="https://www.darkhorseanalytics.com/blog/clear-off-the-table/">advise against the practice</a>. We understand it’s a controversial table issue, however, we also want to give you the creative freedom to just include the stripes. To that end, we now have that option in the package. There are two ways to enable this look:</p>
<ol type="1">
<li>invoking <code>opt_row_striping()</code> to quickly set row stripes in the table body</li>
<li>using some combination of three <code>row_striping_*</code> arguments in <code>tab_options()</code></li>
</ol>
<p>Let’s use that example table with <code>opt_row_striping()</code>.</p>
<div id="3762708a" class="cell" data-execution_count="4">
<div class="code-copy-outer-scaffold"><div class="sourceCode cell-code" id="cb4" style="background: #f1f3f5;"><pre class="sourceCode python code-with-copy"><code class="sourceCode python"><span id="cb4-1">gt_tbl.opt_row_striping()</span></code></pre></div></div>
<div class="cell-output cell-output-display" data-execution_count="4">
<div id="mrhhjzkkir" style="padding-left:0px;padding-right:0px;padding-top:10px;padding-bottom:10px;overflow-x:auto;overflow-y:auto;width:auto;height:auto;">
<style>
#mrhhjzkkir table {
          font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Helvetica Neue', 'Fira Sans', 'Droid Sans', Arial, sans-serif;
          -webkit-font-smoothing: antialiased;
          -moz-osx-font-smoothing: grayscale;
        }

#mrhhjzkkir thead, tbody, tfoot, tr, td, th { border-style: none; }
 tr { background-color: transparent; }
#mrhhjzkkir p { margin: 0; padding: 0; }
 #mrhhjzkkir .gt_table { display: table; border-collapse: collapse; line-height: normal; margin-left: auto; margin-right: auto; color: #333333; font-size: 16px; font-weight: normal; font-style: normal; background-color: #FFFFFF; width: auto; border-top-style: solid; border-top-width: 2px; border-top-color: #A8A8A8; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #A8A8A8; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; }
 #mrhhjzkkir .gt_caption { padding-top: 4px; padding-bottom: 4px; }
 #mrhhjzkkir .gt_title { color: #333333; font-size: 125%; font-weight: initial; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; border-bottom-color: #FFFFFF; border-bottom-width: 0; }
 #mrhhjzkkir .gt_subtitle { color: #333333; font-size: 85%; font-weight: initial; padding-top: 3px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; border-top-color: #FFFFFF; border-top-width: 0; }
 #mrhhjzkkir .gt_heading { background-color: #FFFFFF; text-align: center; border-bottom-color: #FFFFFF; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #mrhhjzkkir .gt_bottom_border { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #mrhhjzkkir .gt_col_headings { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #mrhhjzkkir .gt_col_heading { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; overflow-x: hidden; }
 #mrhhjzkkir .gt_column_spanner_outer { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; padding-top: 0; padding-bottom: 0; padding-left: 4px; padding-right: 4px; }
 #mrhhjzkkir .gt_column_spanner_outer:first-child { padding-left: 0; }
 #mrhhjzkkir .gt_column_spanner_outer:last-child { padding-right: 0; }
 #mrhhjzkkir .gt_column_spanner { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; overflow-x: hidden; display: inline-block; width: 100%; }
 #mrhhjzkkir .gt_spanner_row { border-bottom-style: hidden; }
 #mrhhjzkkir .gt_group_heading { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; text-align: left; }
 #mrhhjzkkir .gt_empty_group_heading { padding: 0.5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: middle; }
 #mrhhjzkkir .gt_from_md> :first-child { margin-top: 0; }
 #mrhhjzkkir .gt_from_md> :last-child { margin-bottom: 0; }
 #mrhhjzkkir .gt_row { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; margin: 10px; border-top-style: solid; border-top-width: 1px; border-top-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; overflow-x: hidden; }
 #mrhhjzkkir .gt_stub { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; }
 #mrhhjzkkir .gt_stub_row_group { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; vertical-align: top; }
 #mrhhjzkkir .gt_row_group_first td { border-top-width: 2px; }
 #mrhhjzkkir .gt_row_group_first th { border-top-width: 2px; }
 #mrhhjzkkir .gt_striped { color: #333333; background-color: #F4F4F4; }
 #mrhhjzkkir .gt_table_body { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #mrhhjzkkir .gt_grand_summary_row { color: #333333; background-color: #FFFFFF; text-transform: inherit; padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; }
 #mrhhjzkkir .gt_first_grand_summary_row_bottom { border-top-style: double; border-top-width: 6px; border-top-color: #D3D3D3; }
 #mrhhjzkkir .gt_last_grand_summary_row_top { border-bottom-style: double; border-bottom-width: 6px; border-bottom-color: #D3D3D3; }
 #mrhhjzkkir .gt_sourcenotes { color: #333333; background-color: #FFFFFF; border-bottom-style: none; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; }
 #mrhhjzkkir .gt_sourcenote { font-size: 90%; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; text-align: left; }
 #mrhhjzkkir .gt_left { text-align: left; }
 #mrhhjzkkir .gt_center { text-align: center; }
 #mrhhjzkkir .gt_right { text-align: right; font-variant-numeric: tabular-nums; }
 #mrhhjzkkir .gt_font_normal { font-weight: normal; }
 #mrhhjzkkir .gt_font_bold { font-weight: bold; }
 #mrhhjzkkir .gt_font_italic { font-style: italic; }
 #mrhhjzkkir .gt_super { font-size: 65%; }
 #mrhhjzkkir .gt_footnote_marks { font-size: 75%; vertical-align: 0.4em; position: initial; }
 #mrhhjzkkir .gt_asterisk { font-size: 100%; vertical-align: 0; }
 
</style>
<table class="gt_table" data-quarto-disable-processing="false" data-quarto-bootstrap="false">
<thead>

  <tr class="gt_heading">
    <td colspan="4" class="gt_heading gt_title gt_font_normal">A small piece of the exibble dataset</td>
  </tr>
  <tr class="gt_heading">
    <td colspan="4" class="gt_heading gt_subtitle gt_font_normal gt_bottom_border">Displaying the first five rows (of eight)</td>
  </tr>
<tr class="gt_col_headings">
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="1" colspan="1" scope="col" id=""></th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="num">num</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="datetime">datetime</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="currency">currency</th>
</tr>
</thead>
<tbody class="gt_table_body">
  <tr class="gt_group_heading_row">
    <th class="gt_group_heading" colspan="4">grp_a</th>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">row_1</th>
    <td class="gt_row gt_right">0.1111</td>
    <td class="gt_row gt_right">2018-01-01 02:22</td>
    <td class="gt_row gt_right">49.95</td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">row_2</th>
    <td class="gt_row gt_right gt_striped">2.222</td>
    <td class="gt_row gt_right gt_striped">2018-02-02 14:33</td>
    <td class="gt_row gt_right gt_striped">17.95</td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">row_3</th>
    <td class="gt_row gt_right">33.33</td>
    <td class="gt_row gt_right">2018-03-03 03:44</td>
    <td class="gt_row gt_right">1.39</td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">row_4</th>
    <td class="gt_row gt_right gt_striped">444.4</td>
    <td class="gt_row gt_right gt_striped">2018-04-04 15:55</td>
    <td class="gt_row gt_right gt_striped">65100.0</td>
  </tr>
  <tr class="gt_group_heading_row">
    <th class="gt_group_heading" colspan="4">grp_b</th>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">row_5</th>
    <td class="gt_row gt_right">5550.0</td>
    <td class="gt_row gt_right">2018-05-05 04:00</td>
    <td class="gt_row gt_right">1325.81</td>
  </tr>
</tbody>
  <tfoot class="gt_sourcenotes">
  
  <tr>
    <td class="gt_sourcenote" colspan="4">This dataset is included in Great Tables.</td>
  </tr>

</tfoot>

</table>

</div>
</div>
</div>
<p>It’s somewhat subtle but there is an alternating, slightly gray background (starting on the <code>"row_2"</code> row). The color is <code>#808080</code> but with an alpha (transparency) value of <code>0.05</code>.</p>
<p>If this is not exactly what you want, there is an alternative to this. The <code>tab_options()</code> method has three new arguments:</p>
<ul>
<li><code>row_striping_background_color</code>: color to use for row striping</li>
<li><code>row_striping_include_stub</code>: should striping include cells in the stub?</li>
<li><code>row_striping_include_table_body</code>: should striping include cells in the body?</li>
</ul>
<p>With these new options, we can choose to stripe the <em>entire</em> row (stub cells + body cells) and use a darker color like <code>"lightblue"</code>.</p>
<div id="9f68e6ee" class="cell" data-execution_count="5">
<div class="code-copy-outer-scaffold"><div class="sourceCode cell-code" id="cb5" style="background: #f1f3f5;"><pre class="sourceCode python code-with-copy"><code class="sourceCode python"><span id="cb5-1">(</span>
<span id="cb5-2">    gt_tbl</span>
<span id="cb5-3">    .tab_options(</span>
<span id="cb5-4">        row_striping_background_color<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"lightblue"</span>,</span>
<span id="cb5-5">        row_striping_include_stub<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="va" style="color: #111111;
background-color: null;
font-style: inherit;">True</span>,</span>
<span id="cb5-6">        row_striping_include_table_body<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="va" style="color: #111111;
background-color: null;
font-style: inherit;">True</span>,</span>
<span id="cb5-7">    )</span>
<span id="cb5-8">)</span></code></pre></div></div>
<div class="cell-output cell-output-display" data-execution_count="5">
<div id="ekedfcveml" style="padding-left:0px;padding-right:0px;padding-top:10px;padding-bottom:10px;overflow-x:auto;overflow-y:auto;width:auto;height:auto;">
<style>
#ekedfcveml table {
          font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Helvetica Neue', 'Fira Sans', 'Droid Sans', Arial, sans-serif;
          -webkit-font-smoothing: antialiased;
          -moz-osx-font-smoothing: grayscale;
        }

#ekedfcveml thead, tbody, tfoot, tr, td, th { border-style: none; }
 tr { background-color: transparent; }
#ekedfcveml p { margin: 0; padding: 0; }
 #ekedfcveml .gt_table { display: table; border-collapse: collapse; line-height: normal; margin-left: auto; margin-right: auto; color: #333333; font-size: 16px; font-weight: normal; font-style: normal; background-color: #FFFFFF; width: auto; border-top-style: solid; border-top-width: 2px; border-top-color: #A8A8A8; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #A8A8A8; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; }
 #ekedfcveml .gt_caption { padding-top: 4px; padding-bottom: 4px; }
 #ekedfcveml .gt_title { color: #333333; font-size: 125%; font-weight: initial; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; border-bottom-color: #FFFFFF; border-bottom-width: 0; }
 #ekedfcveml .gt_subtitle { color: #333333; font-size: 85%; font-weight: initial; padding-top: 3px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; border-top-color: #FFFFFF; border-top-width: 0; }
 #ekedfcveml .gt_heading { background-color: #FFFFFF; text-align: center; border-bottom-color: #FFFFFF; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #ekedfcveml .gt_bottom_border { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #ekedfcveml .gt_col_headings { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #ekedfcveml .gt_col_heading { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; overflow-x: hidden; }
 #ekedfcveml .gt_column_spanner_outer { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; padding-top: 0; padding-bottom: 0; padding-left: 4px; padding-right: 4px; }
 #ekedfcveml .gt_column_spanner_outer:first-child { padding-left: 0; }
 #ekedfcveml .gt_column_spanner_outer:last-child { padding-right: 0; }
 #ekedfcveml .gt_column_spanner { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; overflow-x: hidden; display: inline-block; width: 100%; }
 #ekedfcveml .gt_spanner_row { border-bottom-style: hidden; }
 #ekedfcveml .gt_group_heading { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; text-align: left; }
 #ekedfcveml .gt_empty_group_heading { padding: 0.5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: middle; }
 #ekedfcveml .gt_from_md> :first-child { margin-top: 0; }
 #ekedfcveml .gt_from_md> :last-child { margin-bottom: 0; }
 #ekedfcveml .gt_row { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; margin: 10px; border-top-style: solid; border-top-width: 1px; border-top-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; overflow-x: hidden; }
 #ekedfcveml .gt_stub { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; }
 #ekedfcveml .gt_stub_row_group { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; vertical-align: top; }
 #ekedfcveml .gt_row_group_first td { border-top-width: 2px; }
 #ekedfcveml .gt_row_group_first th { border-top-width: 2px; }
 #ekedfcveml .gt_striped { color: #333333; background-color: lightblue; }
 #ekedfcveml .gt_table_body { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #ekedfcveml .gt_grand_summary_row { color: #333333; background-color: #FFFFFF; text-transform: inherit; padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; }
 #ekedfcveml .gt_first_grand_summary_row_bottom { border-top-style: double; border-top-width: 6px; border-top-color: #D3D3D3; }
 #ekedfcveml .gt_last_grand_summary_row_top { border-bottom-style: double; border-bottom-width: 6px; border-bottom-color: #D3D3D3; }
 #ekedfcveml .gt_sourcenotes { color: #333333; background-color: #FFFFFF; border-bottom-style: none; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; }
 #ekedfcveml .gt_sourcenote { font-size: 90%; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; text-align: left; }
 #ekedfcveml .gt_left { text-align: left; }
 #ekedfcveml .gt_center { text-align: center; }
 #ekedfcveml .gt_right { text-align: right; font-variant-numeric: tabular-nums; }
 #ekedfcveml .gt_font_normal { font-weight: normal; }
 #ekedfcveml .gt_font_bold { font-weight: bold; }
 #ekedfcveml .gt_font_italic { font-style: italic; }
 #ekedfcveml .gt_super { font-size: 65%; }
 #ekedfcveml .gt_footnote_marks { font-size: 75%; vertical-align: 0.4em; position: initial; }
 #ekedfcveml .gt_asterisk { font-size: 100%; vertical-align: 0; }
 
</style>
<table class="gt_table" data-quarto-disable-processing="false" data-quarto-bootstrap="false">
<thead>

  <tr class="gt_heading">
    <td colspan="4" class="gt_heading gt_title gt_font_normal">A small piece of the exibble dataset</td>
  </tr>
  <tr class="gt_heading">
    <td colspan="4" class="gt_heading gt_subtitle gt_font_normal gt_bottom_border">Displaying the first five rows (of eight)</td>
  </tr>
<tr class="gt_col_headings">
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="1" colspan="1" scope="col" id=""></th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="num">num</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="datetime">datetime</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="currency">currency</th>
</tr>
</thead>
<tbody class="gt_table_body">
  <tr class="gt_group_heading_row">
    <th class="gt_group_heading" colspan="4">grp_a</th>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">row_1</th>
    <td class="gt_row gt_right">0.1111</td>
    <td class="gt_row gt_right">2018-01-01 02:22</td>
    <td class="gt_row gt_right">49.95</td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub gt_striped">row_2</th>
    <td class="gt_row gt_right gt_striped">2.222</td>
    <td class="gt_row gt_right gt_striped">2018-02-02 14:33</td>
    <td class="gt_row gt_right gt_striped">17.95</td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">row_3</th>
    <td class="gt_row gt_right">33.33</td>
    <td class="gt_row gt_right">2018-03-03 03:44</td>
    <td class="gt_row gt_right">1.39</td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub gt_striped">row_4</th>
    <td class="gt_row gt_right gt_striped">444.4</td>
    <td class="gt_row gt_right gt_striped">2018-04-04 15:55</td>
    <td class="gt_row gt_right gt_striped">65100.0</td>
  </tr>
  <tr class="gt_group_heading_row">
    <th class="gt_group_heading" colspan="4">grp_b</th>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">row_5</th>
    <td class="gt_row gt_right">5550.0</td>
    <td class="gt_row gt_right">2018-05-05 04:00</td>
    <td class="gt_row gt_right">1325.81</td>
  </tr>
</tbody>
  <tfoot class="gt_sourcenotes">
  
  <tr>
    <td class="gt_sourcenote" colspan="4">This dataset is included in Great Tables.</td>
  </tr>

</tfoot>

</table>

</div>
</div>
</div>
<p>These alternating fills can be a good idea in some table display circumstances. Now, you can make that call and the functionality is there to support your decision.</p>
</section>
<section id="wrapping-up" class="level3">
<h3 class="anchored" data-anchor-id="wrapping-up">Wrapping up</h3>
<p>We are excited that this new functionality is now available in Great Tables. As ever, please let us know through <a href="https://github.com/posit-dev/great-tables/issues">GitHub Issues</a> whether you ran into problems with any feature (new or old), or, if you have suggestions for further improvement!</p>


</section>

 ]]></description>
  <guid>https://posit-dev.github.io/great-tables/blog/introduction-0.12.0/</guid>
  <pubDate>Mon, 30 Sep 2024 00:00:00 GMT</pubDate>
</item>
<item>
  <title>Great Tables for Scientific Publishing</title>
  <dc:creator>Rich Iannone</dc:creator>
  <link>https://posit-dev.github.io/great-tables/blog/tables-for-scientific-publishing/</link>
  <description><![CDATA[ 




<p><strong>Great Tables</strong> version <code>0.10.0</code> has be released today and it contains a host of new features to support tables meant for scientific publishing.</p>
<p>In this post, we’ll review the big pieces that scientific tables need:</p>
<ul>
<li><strong>Unit notation</strong>: rendering units and chemical formulas (e.g., °C or C<sub>6</sub>H<sub>6</sub>).</li>
<li><strong>Scientific notation</strong>: formatting for very large and small numbers (e.g., 3.50 × 10<sup>−11</sup>)</li>
<li><strong>Nanoplots</strong>: compact visualizations for revealing trends.</li>
</ul>
<p>We’ve added <strong>six new datasets</strong>, to help quickly show off scientific publishing! We’ll use the new <code>reactions</code> and <code>gibraltar</code> datasets to create examples in the fields of Atmospheric Chemistry and Meteorology, respectively.</p>
<div class="callout callout-style-default callout-tip callout-titled">
<div class="callout-header d-flex align-content-center">
<div class="callout-icon-container">
<i class="callout-icon"></i>
</div>
<div class="callout-title-container flex-fill">
Tip
</div>
</div>
<div class="callout-body-container callout-body">
<p>Rich presented on this topic at SciPy 2024!</p>
<p>At SciPy 2024 (on July 11, 2024), Rich delivered a talk called <em>Great Tables for Everyone</em> and it presented some of the tables shown in this post. If you weren’t in attendance that’s okay, you can <a href="https://youtu.be/uvH-Z39ZUj0?si=3NVipMteXaeO3vb1">watch the recorded talk</a> and the materials are available <a href="https://github.com/rich-iannone/presentations/tree/main/2024-07-11-SciPy-talk-GT">in GitHub</a>.</p>
</div>
</div>
<section id="unit-and-scientific-notation" class="level2">
<h2 class="anchored" data-anchor-id="unit-and-scientific-notation">Unit and scientific notation</h2>
<p>We added the <code>reactions</code> dataset to serve as the basis for examples in the discipline of Atmospheric Chemistry. The dataset contains reaction rate constants for gas-phase reactions of 1,683 organic compounds. Each of these compounds can potentially undergo reaction with hydroxyl radicals (OH), nitrate radicals (NO<sub>3</sub>), or chlorine atoms (Cl). These reaction rate constants are typically very small values in units of cm<sup>3</sup> molecules<sup>–1</sup> s<sup>–1</sup>. In the upcoming example, we’ll pare down this massive dataset to only 11 rows representing the class of organic compounds known as mercaptans.</p>
<p>To make this table work well in a scientific reporting context, we need three pieces:</p>
<ul>
<li>way to represent units, like cm<sup>3</sup></li>
<li>method for typesetting chemical formulae, as in CH<sub>4</sub></li>
<li>formatting for very small numbers in scientific notation.</li>
</ul>
<p><strong>Great Tables</strong> provides the necessary functionality for all three requirements. Here is a summary table that tabulates rate constants for mercaptan compounds undergoing reaction with OH, O<sub>3</sub>, and Cl:</p>
<div id="49e227fa" class="cell" data-execution_count="1">
<details class="code-fold">
<summary>Show the Code</summary>
<div class="code-copy-outer-scaffold"><div class="sourceCode cell-code" id="cb1" style="background: #f1f3f5;"><pre class="sourceCode python code-with-copy"><code class="sourceCode python"><span id="cb1-1"><span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">from</span> great_tables <span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">import</span> GT</span>
<span id="cb1-2"><span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">from</span> great_tables.data <span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">import</span> reactions</span>
<span id="cb1-3"><span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">import</span> polars <span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">as</span> pl</span>
<span id="cb1-4"><span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">import</span> polars.selectors <span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">as</span> ps</span>
<span id="cb1-5"></span>
<span id="cb1-6">reactions_mini <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> (</span>
<span id="cb1-7">    pl.from_pandas(reactions)</span>
<span id="cb1-8">    .<span class="bu" style="color: null;
background-color: null;
font-style: inherit;">filter</span>(pl.col(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"cmpd_type"</span>) <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">==</span> <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"mercaptan"</span>)</span>
<span id="cb1-9">    .select([</span>
<span id="cb1-10">        <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"cmpd_name"</span>,</span>
<span id="cb1-11">        <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"cmpd_formula"</span>,</span>
<span id="cb1-12">        ps.ends_with(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"k298"</span>)</span>
<span id="cb1-13">    ])</span>
<span id="cb1-14">    .with_columns(</span>
<span id="cb1-15">        cmpd_formula<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>pl.concat_str(</span>
<span id="cb1-16">            <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"%"</span> <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">+</span> pl.col(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"cmpd_formula"</span>) <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">+</span> <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"%"</span></span>
<span id="cb1-17">        )</span>
<span id="cb1-18">    )</span>
<span id="cb1-19">)</span>
<span id="cb1-20"></span>
<span id="cb1-21">(</span>
<span id="cb1-22">    GT(reactions_mini, rowname_col<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"cmpd_name"</span>)</span>
<span id="cb1-23">    .tab_header(title<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Gas-phase reactions of selected mercaptan compounds"</span>)</span>
<span id="cb1-24">    .tab_spanner(</span>
<span id="cb1-25">        columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>ps.ends_with(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"k298"</span>),</span>
<span id="cb1-26">        label<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Reaction Rate Constant (298 K),&lt;br&gt;</span><span class="sc" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">{{</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">cm^3 molecules^–1 s^–1</span><span class="sc" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">}}</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"</span></span>
<span id="cb1-27">    )</span>
<span id="cb1-28">    .fmt_units(columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"cmpd_formula"</span>)</span>
<span id="cb1-29">    .fmt_scientific(columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>ps.ends_with(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"k298"</span>))</span>
<span id="cb1-30">    .sub_missing()</span>
<span id="cb1-31">    .cols_hide(columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"O3_k298"</span>)</span>
<span id="cb1-32">    .cols_label(</span>
<span id="cb1-33">        cmpd_formula<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">""</span>,</span>
<span id="cb1-34">        OH_k298<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"OH"</span>,</span>
<span id="cb1-35">        NO3_k298<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"</span><span class="sc" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">{{</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">%NO3%</span><span class="sc" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">}}</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"</span>,</span>
<span id="cb1-36">        Cl_k298<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Cl"</span>,</span>
<span id="cb1-37">    )</span>
<span id="cb1-38">    .opt_stylize(style<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">1</span>, color<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"blue"</span>)</span>
<span id="cb1-39">    .opt_horizontal_padding(scale<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">3</span>)</span>
<span id="cb1-40">    .opt_table_font(stack<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"humanist"</span>)</span>
<span id="cb1-41">)</span></code></pre></div></div>
</details>
<div class="cell-output cell-output-display" data-execution_count="1">
<div id="cghzplyoqk" style="padding-left:0px;padding-right:0px;padding-top:10px;padding-bottom:10px;overflow-x:auto;overflow-y:auto;width:auto;height:auto;">
<style>
#cghzplyoqk table {
          font-family: Seravek, 'Gill Sans Nova', Ubuntu, Calibri, 'DejaVu Sans', source-sans-pro, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';
          -webkit-font-smoothing: antialiased;
          -moz-osx-font-smoothing: grayscale;
        }

#cghzplyoqk thead, tbody, tfoot, tr, td, th { border-style: none; }
 tr { background-color: transparent; }
#cghzplyoqk p { margin: 0; padding: 0; }
 #cghzplyoqk .gt_table { display: table; border-collapse: collapse; line-height: normal; margin-left: auto; margin-right: auto; color: #333333; font-size: 16px; font-weight: normal; font-style: normal; background-color: #FFFFFF; width: auto; border-top-style: solid; border-top-width: 2px; border-top-color: #004D80; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #004D80; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; }
 #cghzplyoqk .gt_caption { padding-top: 4px; padding-bottom: 4px; }
 #cghzplyoqk .gt_title { color: #333333; font-size: 125%; font-weight: initial; padding-top: 4px; padding-bottom: 4px; padding-left: 15px; padding-right: 15px; border-bottom-color: #FFFFFF; border-bottom-width: 0; }
 #cghzplyoqk .gt_subtitle { color: #333333; font-size: 85%; font-weight: initial; padding-top: 3px; padding-bottom: 5px; padding-left: 15px; padding-right: 15px; border-top-color: #FFFFFF; border-top-width: 0; }
 #cghzplyoqk .gt_heading { background-color: #FFFFFF; text-align: center; border-bottom-color: #FFFFFF; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #cghzplyoqk .gt_bottom_border { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #0076BA; }
 #cghzplyoqk .gt_col_headings { border-top-style: solid; border-top-width: 2px; border-top-color: #0076BA; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #0076BA; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #cghzplyoqk .gt_col_heading { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; padding-left: 15px; padding-right: 15px; overflow-x: hidden; }
 #cghzplyoqk .gt_column_spanner_outer { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; padding-top: 0; padding-bottom: 0; padding-left: 4px; padding-right: 4px; }
 #cghzplyoqk .gt_column_spanner_outer:first-child { padding-left: 0; }
 #cghzplyoqk .gt_column_spanner_outer:last-child { padding-right: 0; }
 #cghzplyoqk .gt_column_spanner { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #0076BA; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; overflow-x: hidden; display: inline-block; width: 100%; }
 #cghzplyoqk .gt_spanner_row { border-bottom-style: hidden; }
 #cghzplyoqk .gt_group_heading { padding-top: 8px; padding-bottom: 8px; padding-left: 15px; padding-right: 15px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-top-style: solid; border-top-width: 2px; border-top-color: #0076BA; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #0076BA; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; text-align: left; }
 #cghzplyoqk .gt_empty_group_heading { padding: 0.5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; border-top-style: solid; border-top-width: 2px; border-top-color: #0076BA; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #0076BA; vertical-align: middle; }
 #cghzplyoqk .gt_from_md> :first-child { margin-top: 0; }
 #cghzplyoqk .gt_from_md> :last-child { margin-bottom: 0; }
 #cghzplyoqk .gt_row { padding-top: 8px; padding-bottom: 8px; padding-left: 15px; padding-right: 15px; margin: 10px; border-top-style: none; border-top-width: 1px; border-top-color: #89D3FE; border-left-style: none; border-left-width: 1px; border-left-color: #89D3FE; border-right-style: none; border-right-width: 1px; border-right-color: #89D3FE; vertical-align: middle; overflow-x: hidden; }
 #cghzplyoqk .gt_stub { color: #FFFFFF; background-color: #0076BA; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #0076BA; padding-left: 15px; padding-right: 15px; }
 #cghzplyoqk .gt_stub_row_group { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 15px; padding-right: 15px; vertical-align: top; }
 #cghzplyoqk .gt_row_group_first td { border-top-width: 2px; }
 #cghzplyoqk .gt_row_group_first th { border-top-width: 2px; }
 #cghzplyoqk .gt_striped { color: #333333; background-color: #F4F4F4; }
 #cghzplyoqk .gt_table_body { border-top-style: solid; border-top-width: 2px; border-top-color: #0076BA; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #0076BA; }
 #cghzplyoqk .gt_grand_summary_row { color: #333333; background-color: #89D3FE; text-transform: inherit; padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; }
 #cghzplyoqk .gt_first_grand_summary_row_bottom { border-top-style: double; border-top-width: 6px; border-top-color: #D3D3D3; }
 #cghzplyoqk .gt_last_grand_summary_row_top { border-bottom-style: double; border-bottom-width: 6px; border-bottom-color: #D3D3D3; }
 #cghzplyoqk .gt_sourcenotes { color: #333333; background-color: #FFFFFF; border-bottom-style: none; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; }
 #cghzplyoqk .gt_sourcenote { font-size: 90%; padding-top: 4px; padding-bottom: 4px; padding-left: 15px; padding-right: 15px; text-align: left; }
 #cghzplyoqk .gt_left { text-align: left; }
 #cghzplyoqk .gt_center { text-align: center; }
 #cghzplyoqk .gt_right { text-align: right; font-variant-numeric: tabular-nums; }
 #cghzplyoqk .gt_font_normal { font-weight: normal; }
 #cghzplyoqk .gt_font_bold { font-weight: bold; }
 #cghzplyoqk .gt_font_italic { font-style: italic; }
 #cghzplyoqk .gt_super { font-size: 65%; }
 #cghzplyoqk .gt_footnote_marks { font-size: 75%; vertical-align: 0.4em; position: initial; }
 #cghzplyoqk .gt_asterisk { font-size: 100%; vertical-align: 0; }
 
</style>
<table class="gt_table" data-quarto-disable-processing="false" data-quarto-bootstrap="false">
<thead>

  <tr class="gt_heading">
    <td colspan="5" class="gt_heading gt_title gt_font_normal">Gas-phase reactions of selected mercaptan compounds</td>
  </tr>
<tr class="gt_col_headings gt_spanner_row">
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="2" colspan="1" scope="col" id=""></th>
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="2" colspan="1" scope="col" id="cmpd_formula"></th>
  <th class="gt_center gt_columns_top_border gt_column_spanner_outer" rowspan="1" colspan="3" scope="colgroup" id="Reaction-Rate-Constant-(298-K),<br>cm<span-style=&quot;white-space:nowrap;&quot;><sup-style=&quot;line-height:0;&quot;>3</sup></span>-molecules<span-style=&quot;white-space:nowrap;&quot;><sup-style=&quot;line-height:0;&quot;>–1</sup></span>-s<span-style=&quot;white-space:nowrap;&quot;><sup-style=&quot;line-height:0;&quot;>–1</sup></span>">
    <span class="gt_column_spanner">Reaction Rate Constant (298 K),<br>cm<span style="white-space:nowrap;"><sup style="line-height:0;">3</sup></span> molecules<span style="white-space:nowrap;"><sup style="line-height:0;">–1</sup></span> s<span style="white-space:nowrap;"><sup style="line-height:0;">–1</sup></span></span>
  </th>
</tr>
<tr class="gt_col_headings">
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="OH_k298">OH</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="NO3_k298">NO<span style="white-space:nowrap;"><sub style="line-height:0;">3</sub></span></th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="Cl_k298">Cl</th>
</tr>
</thead>
<tbody class="gt_table_body">
  <tr>
    <th class="gt_row gt_left gt_stub">methanethiol</th>
    <td class="gt_row gt_left">CH<span style="white-space:nowrap;"><sub style="line-height:0;">4</sub></span>S</td>
    <td class="gt_row gt_right">3.50 × 10<sup style="font-size: 65%;">−11</sup></td>
    <td class="gt_row gt_right">9.20 × 10<sup style="font-size: 65%;">−13</sup></td>
    <td class="gt_row gt_right">2.00 × 10<sup style="font-size: 65%;">−10</sup></td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">ethanethiol</th>
    <td class="gt_row gt_left gt_striped">C<span style="white-space:nowrap;"><sub style="line-height:0;">2</sub></span>H<span style="white-space:nowrap;"><sub style="line-height:0;">6</sub></span>S</td>
    <td class="gt_row gt_right gt_striped">4.50 × 10<sup style="font-size: 65%;">−11</sup></td>
    <td class="gt_row gt_right gt_striped">1.21 × 10<sup style="font-size: 65%;">−12</sup></td>
    <td class="gt_row gt_right gt_striped">1.75 × 10<sup style="font-size: 65%;">−10</sup></td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">propanethiol</th>
    <td class="gt_row gt_left">C<span style="white-space:nowrap;"><sub style="line-height:0;">3</sub></span>H<span style="white-space:nowrap;"><sub style="line-height:0;">8</sub></span>S</td>
    <td class="gt_row gt_right">5.30 × 10<sup style="font-size: 65%;">−11</sup></td>
    <td class="gt_row gt_right">—</td>
    <td class="gt_row gt_right">2.14 × 10<sup style="font-size: 65%;">−10</sup></td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">2-propanethiol</th>
    <td class="gt_row gt_left gt_striped">C<span style="white-space:nowrap;"><sub style="line-height:0;">3</sub></span>H<span style="white-space:nowrap;"><sub style="line-height:0;">8</sub></span>S</td>
    <td class="gt_row gt_right gt_striped">3.90 × 10<sup style="font-size: 65%;">−11</sup></td>
    <td class="gt_row gt_right gt_striped">—</td>
    <td class="gt_row gt_right gt_striped">2.70 × 10<sup style="font-size: 65%;">−10</sup></td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">1-butanethiol</th>
    <td class="gt_row gt_left">C<span style="white-space:nowrap;"><sub style="line-height:0;">4</sub></span>H<span style="white-space:nowrap;"><sub style="line-height:0;">10</sub></span>S</td>
    <td class="gt_row gt_right">5.60 × 10<sup style="font-size: 65%;">−11</sup></td>
    <td class="gt_row gt_right">—</td>
    <td class="gt_row gt_right">—</td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">2-methyl-1-propanethiol</th>
    <td class="gt_row gt_left gt_striped">C<span style="white-space:nowrap;"><sub style="line-height:0;">4</sub></span>H<span style="white-space:nowrap;"><sub style="line-height:0;">10</sub></span>S</td>
    <td class="gt_row gt_right gt_striped">4.60 × 10<sup style="font-size: 65%;">−11</sup></td>
    <td class="gt_row gt_right gt_striped">—</td>
    <td class="gt_row gt_right gt_striped">—</td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">2-butanethiol</th>
    <td class="gt_row gt_left">C<span style="white-space:nowrap;"><sub style="line-height:0;">4</sub></span>H<span style="white-space:nowrap;"><sub style="line-height:0;">10</sub></span>S</td>
    <td class="gt_row gt_right">3.80 × 10<sup style="font-size: 65%;">−11</sup></td>
    <td class="gt_row gt_right">—</td>
    <td class="gt_row gt_right">1.65 × 10<sup style="font-size: 65%;">−10</sup></td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">t-butylsulfide</th>
    <td class="gt_row gt_left gt_striped">C<span style="white-space:nowrap;"><sub style="line-height:0;">4</sub></span>H<span style="white-space:nowrap;"><sub style="line-height:0;">10</sub></span>S</td>
    <td class="gt_row gt_right gt_striped">2.90 × 10<sup style="font-size: 65%;">−11</sup></td>
    <td class="gt_row gt_right gt_striped">—</td>
    <td class="gt_row gt_right gt_striped">—</td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">2-methylbutanethiol</th>
    <td class="gt_row gt_left">C<span style="white-space:nowrap;"><sub style="line-height:0;">5</sub></span>H<span style="white-space:nowrap;"><sub style="line-height:0;">12</sub></span>S</td>
    <td class="gt_row gt_right">5.20 × 10<sup style="font-size: 65%;">−11</sup></td>
    <td class="gt_row gt_right">—</td>
    <td class="gt_row gt_right">—</td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">n-pentanethiol</th>
    <td class="gt_row gt_left gt_striped">C<span style="white-space:nowrap;"><sub style="line-height:0;">5</sub></span>H<span style="white-space:nowrap;"><sub style="line-height:0;">12</sub></span>S</td>
    <td class="gt_row gt_right gt_striped">—</td>
    <td class="gt_row gt_right gt_striped">—</td>
    <td class="gt_row gt_right gt_striped">1.97 × 10<sup style="font-size: 65%;">−10</sup></td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">1,2-ethanedithiol</th>
    <td class="gt_row gt_left">C<span style="white-space:nowrap;"><sub style="line-height:0;">2</sub></span>H<span style="white-space:nowrap;"><sub style="line-height:0;">6</sub></span>S<span style="white-space:nowrap;"><sub style="line-height:0;">2</sub></span></td>
    <td class="gt_row gt_right">3.80 × 10<sup style="font-size: 65%;">−11</sup></td>
    <td class="gt_row gt_right">—</td>
    <td class="gt_row gt_right">—</td>
  </tr>
</tbody>


</table>

</div>
</div>
</div>
<p>This is a nice-looking table! And note these pieces:</p>
<ul>
<li>The <code>label=</code> argument to functions like <code>.tab_spanner()</code> supports the use of curly braces (<code>{{</code>/<code>}}</code>) for the specialized units notation. So using <code>"{{cm^3 molecules^–1 s^–1}}"</code> in the input will become cm<sup>3</sup> molecules<sup>–1</sup> s<sup>–1</sup> in the output</li>
<li>The <code>.fmt_units()</code> method converts values that are already in units notation in the table body. For example, a cell with text <code>"%CH4S%"</code> becomes CH<sub>4</sub>S (the surrounding <code>%</code> indicates that the text should be interpreted as chemistry notation).</li>
<li>The <code>.fmt_scientific()</code> method formats values (in this case, very small values) to scientific notation (e.g., 3.50 × 10<sup>–11</sup>). Not doing so would make the table look very strange to a researcher that is familiar with this sort of data.</li>
</ul>
<p>The combination of units notation (and chemistry notation, which is a part of that) really makes the presentation of this table complete and understandable to a practitioner of the field. <strong>Great Tables</strong> supports the use of units notation in spanner labels (with <code>.tab_spanner()</code>) and also in column labels (with <code>.cols_labels()</code>). The column label ‘NO<sub>3</sub>’ was created with the latter method by supplying the text <code>"{{%NO3%}}"</code> as the column label for the <code>NO3_k298</code> column.</p>
</section>
<section id="nanoplots" class="level2">
<h2 class="anchored" data-anchor-id="nanoplots">Nanoplots</h2>
<p>We added the nanoplots feature to <strong>Great Tables</strong> in v0.4.0 (check out the <a href="https://posit-dev.github.io/great-tables/blog/introduction-0.4.0/">intro blog post</a> for a quick explainer) so that tables can contain small, info-packed plots that fit reasonably well into a table context. They are interactive in that hovering over the data points provides additional plot information. This approach brings together the advantages of plots (elucidation of trends in data) and tables (access to numerical values representing the data points) in a single summary visualization.</p>
<p>Version <code>0.10.0</code> of <strong>Great Tables</strong> adds the <code>gibraltar</code> dataset, which provides meteorological data (temeperature, humidity, wind speed, etc.) for the entire month of May 2024 at Gibraltar Airport Station.</p>
<p>Nanoplots, as mentioned, are great for condensing a lot of information into a small area. Our example here with the <code>gibraltar</code> dataset takes all of the temperature and humidity data for the first 10 days of May 2023 and displays them in easy-to-explore nanoplots across two columns:</p>
<div id="6c31fbed" class="cell" data-execution_count="2">
<details class="code-fold">
<summary>Show the Code</summary>
<div class="code-copy-outer-scaffold"><div class="sourceCode cell-code" id="cb2" style="background: #f1f3f5;"><pre class="sourceCode python code-with-copy"><code class="sourceCode python"><span id="cb2-1"><span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">from</span> great_tables <span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">import</span> GT, nanoplot_options</span>
<span id="cb2-2"><span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">from</span> great_tables.data <span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">import</span> gibraltar</span>
<span id="cb2-3"><span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">import</span> polars <span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">as</span> pl</span>
<span id="cb2-4"></span>
<span id="cb2-5">nano_opts <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> nanoplot_options(</span>
<span id="cb2-6">    data_point_radius<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">4</span>,</span>
<span id="cb2-7">    data_point_stroke_width<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">4</span>,</span>
<span id="cb2-8">    data_point_stroke_color<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"black"</span>,</span>
<span id="cb2-9">    data_point_fill_color<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"white"</span>,</span>
<span id="cb2-10">    data_line_stroke_width<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">4</span>,</span>
<span id="cb2-11">    data_line_stroke_color<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"gray"</span>,</span>
<span id="cb2-12">    show_data_line<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="va" style="color: #111111;
background-color: null;
font-style: inherit;">True</span>,</span>
<span id="cb2-13">    show_data_points<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="va" style="color: #111111;
background-color: null;
font-style: inherit;">True</span>,</span>
<span id="cb2-14">    show_data_area<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="va" style="color: #111111;
background-color: null;
font-style: inherit;">False</span>,</span>
<span id="cb2-15">  )</span>
<span id="cb2-16"></span>
<span id="cb2-17">gibraltar_mini <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> (</span>
<span id="cb2-18">    pl.from_pandas(gibraltar)</span>
<span id="cb2-19">    .<span class="bu" style="color: null;
background-color: null;
font-style: inherit;">filter</span>(pl.col(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"date"</span>) <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">&lt;=</span> <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"2023-05-10"</span>)</span>
<span id="cb2-20">    .with_columns(pl.col(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"humidity"</span>) <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">*</span> <span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">100</span>)</span>
<span id="cb2-21">    .select([<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"date"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"temp"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"humidity"</span>])</span>
<span id="cb2-22">    .group_by(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"date"</span>)</span>
<span id="cb2-23">    .agg(pl.col(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"temp"</span>), pl.col(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"humidity"</span>))</span>
<span id="cb2-24">    .sort(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"date"</span>)</span>
<span id="cb2-25">)</span>
<span id="cb2-26"></span>
<span id="cb2-27">(</span>
<span id="cb2-28">  GT(gibraltar_mini)</span>
<span id="cb2-29">  .tab_header(</span>
<span id="cb2-30">    title<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Meteorological Summary of Gibraltar Station"</span>,</span>
<span id="cb2-31">    subtitle<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Data taken from May 1-10, 2023."</span></span>
<span id="cb2-32">  )</span>
<span id="cb2-33">  .fmt_nanoplot(</span>
<span id="cb2-34">    columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"temp"</span>, autoscale<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="va" style="color: #111111;
background-color: null;
font-style: inherit;">True</span>, options<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>nano_opts</span>
<span id="cb2-35">  )</span>
<span id="cb2-36">  .fmt_nanoplot(</span>
<span id="cb2-37">    columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"humidity"</span>, autoscale<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="va" style="color: #111111;
background-color: null;
font-style: inherit;">True</span>, options<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>nano_opts</span>
<span id="cb2-38">  )</span>
<span id="cb2-39">  .fmt_date(</span>
<span id="cb2-40">    columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"date"</span>,</span>
<span id="cb2-41">    date_style<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"wd_m_day_year"</span></span>
<span id="cb2-42">  )</span>
<span id="cb2-43">  .cols_label(</span>
<span id="cb2-44">    date<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Date"</span>,</span>
<span id="cb2-45">    temp<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Temperature, </span><span class="sc" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">{{</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">:degree:C</span><span class="sc" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">}}</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"</span>,</span>
<span id="cb2-46">    humidity<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Humidity, % (RH)"</span>,</span>
<span id="cb2-47">  )</span>
<span id="cb2-48">  .cols_align(</span>
<span id="cb2-49">    align<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"left"</span>,</span>
<span id="cb2-50">    columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>[<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"temp"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"humidity"</span>]</span>
<span id="cb2-51">  )</span>
<span id="cb2-52">)</span></code></pre></div></div>
</details>
<div class="cell-output cell-output-display" data-execution_count="2">
<div id="kyhfrdyveh" style="padding-left:0px;padding-right:0px;padding-top:10px;padding-bottom:10px;overflow-x:auto;overflow-y:auto;width:auto;height:auto;">
<style>
#kyhfrdyveh table {
          font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Helvetica Neue', 'Fira Sans', 'Droid Sans', Arial, sans-serif;
          -webkit-font-smoothing: antialiased;
          -moz-osx-font-smoothing: grayscale;
        }

#kyhfrdyveh thead, tbody, tfoot, tr, td, th { border-style: none; }
 tr { background-color: transparent; }
#kyhfrdyveh p { margin: 0; padding: 0; }
 #kyhfrdyveh .gt_table { display: table; border-collapse: collapse; line-height: normal; margin-left: auto; margin-right: auto; color: #333333; font-size: 16px; font-weight: normal; font-style: normal; background-color: #FFFFFF; width: auto; border-top-style: solid; border-top-width: 2px; border-top-color: #A8A8A8; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #A8A8A8; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; }
 #kyhfrdyveh .gt_caption { padding-top: 4px; padding-bottom: 4px; }
 #kyhfrdyveh .gt_title { color: #333333; font-size: 125%; font-weight: initial; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; border-bottom-color: #FFFFFF; border-bottom-width: 0; }
 #kyhfrdyveh .gt_subtitle { color: #333333; font-size: 85%; font-weight: initial; padding-top: 3px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; border-top-color: #FFFFFF; border-top-width: 0; }
 #kyhfrdyveh .gt_heading { background-color: #FFFFFF; text-align: center; border-bottom-color: #FFFFFF; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #kyhfrdyveh .gt_bottom_border { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #kyhfrdyveh .gt_col_headings { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #kyhfrdyveh .gt_col_heading { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; overflow-x: hidden; }
 #kyhfrdyveh .gt_column_spanner_outer { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; padding-top: 0; padding-bottom: 0; padding-left: 4px; padding-right: 4px; }
 #kyhfrdyveh .gt_column_spanner_outer:first-child { padding-left: 0; }
 #kyhfrdyveh .gt_column_spanner_outer:last-child { padding-right: 0; }
 #kyhfrdyveh .gt_column_spanner { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; overflow-x: hidden; display: inline-block; width: 100%; }
 #kyhfrdyveh .gt_spanner_row { border-bottom-style: hidden; }
 #kyhfrdyveh .gt_group_heading { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; text-align: left; }
 #kyhfrdyveh .gt_empty_group_heading { padding: 0.5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: middle; }
 #kyhfrdyveh .gt_from_md> :first-child { margin-top: 0; }
 #kyhfrdyveh .gt_from_md> :last-child { margin-bottom: 0; }
 #kyhfrdyveh .gt_row { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; margin: 10px; border-top-style: solid; border-top-width: 1px; border-top-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; overflow-x: hidden; }
 #kyhfrdyveh .gt_stub { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; }
 #kyhfrdyveh .gt_stub_row_group { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; vertical-align: top; }
 #kyhfrdyveh .gt_row_group_first td { border-top-width: 2px; }
 #kyhfrdyveh .gt_row_group_first th { border-top-width: 2px; }
 #kyhfrdyveh .gt_striped { color: #333333; background-color: #F4F4F4; }
 #kyhfrdyveh .gt_table_body { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #kyhfrdyveh .gt_grand_summary_row { color: #333333; background-color: #FFFFFF; text-transform: inherit; padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; }
 #kyhfrdyveh .gt_first_grand_summary_row_bottom { border-top-style: double; border-top-width: 6px; border-top-color: #D3D3D3; }
 #kyhfrdyveh .gt_last_grand_summary_row_top { border-bottom-style: double; border-bottom-width: 6px; border-bottom-color: #D3D3D3; }
 #kyhfrdyveh .gt_sourcenotes { color: #333333; background-color: #FFFFFF; border-bottom-style: none; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; }
 #kyhfrdyveh .gt_sourcenote { font-size: 90%; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; text-align: left; }
 #kyhfrdyveh .gt_left { text-align: left; }
 #kyhfrdyveh .gt_center { text-align: center; }
 #kyhfrdyveh .gt_right { text-align: right; font-variant-numeric: tabular-nums; }
 #kyhfrdyveh .gt_font_normal { font-weight: normal; }
 #kyhfrdyveh .gt_font_bold { font-weight: bold; }
 #kyhfrdyveh .gt_font_italic { font-style: italic; }
 #kyhfrdyveh .gt_super { font-size: 65%; }
 #kyhfrdyveh .gt_footnote_marks { font-size: 75%; vertical-align: 0.4em; position: initial; }
 #kyhfrdyveh .gt_asterisk { font-size: 100%; vertical-align: 0; }
 
</style>
<table class="gt_table" data-quarto-disable-processing="false" data-quarto-bootstrap="false">
<thead>

  <tr class="gt_heading">
    <td colspan="3" class="gt_heading gt_title gt_font_normal">Meteorological Summary of Gibraltar Station</td>
  </tr>
  <tr class="gt_heading">
    <td colspan="3" class="gt_heading gt_subtitle gt_font_normal gt_bottom_border">Data taken from May 1-10, 2023.</td>
  </tr>
<tr class="gt_col_headings">
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="1" colspan="1" scope="col" id="date">Date</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="1" colspan="1" scope="col" id="temp">Temperature, °C</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="1" colspan="1" scope="col" id="humidity">Humidity, % (RH)</th>
</tr>
</thead>
<tbody class="gt_table_body">
  <tr>
    <td class="gt_row gt_left">Mon, May 1, 2023</td>
    <td class="gt_row gt_left"><div><svg viewbox="0 0 1250 130" style="height: 2em; margin-left: auto; margin-right: auto; font-size: inherit; overflow: visible; vertical-align: middle; position:relative;"><defs><pattern id="area_pattern" width="8" height="8" patternunits="userSpaceOnUse"><path class="pattern-line" d="M 0,8 l 8,-8 M -1,1 l 4,-4 M 6,10 l 4,-4" stroke="#FF0000" stroke-width="1.5" stroke-linecap="round" shape-rendering="geometricPrecision"></path></pattern></defs><style> text { font-family: ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace; stroke-width: 0.15em; paint-order: stroke; stroke-linejoin: round; cursor: default; } .vert-line:hover rect { fill: #911EB4; fill-opacity: 40%; stroke: #FFFFFF60; color: red; } .vert-line:hover text { stroke: white; fill: #212427; } .horizontal-line:hover text {stroke: white; fill: #212427; } .ref-line:hover rect { stroke: #FFFFFF60; } .ref-line:hover line { stroke: #FF0000; } .ref-line:hover text { stroke: white; fill: #212427; } .y-axis-line:hover rect { fill: #EDEDED; fill-opacity: 60%; stroke: #FFFFFF60; color: red; } .y-axis-line:hover text { stroke: white; stroke-width: 0.20em; fill: #1A1C1F; } </style><path d="M 50.0,94.85611510791368 C 62.5,94.85611510791368 63.05555555555556,94.85611510791368 75.55555555555556,94.85611510791368 C 88.05555555555556,94.85611510791368 88.61111111111111,102.76978417266189 101.11111111111111,102.76978417266189 C 113.61111111111111,102.76978417266189 114.16666666666667,94.85611510791368 126.66666666666667,94.85611510791368 C 139.16666666666669,94.85611510791368 139.72222222222223,94.85611510791368 152.22222222222223,94.85611510791368 C 164.72222222222223,94.85611510791368 165.27777777777777,102.76978417266189 177.77777777777777,102.76978417266189 C 190.27777777777777,102.76978417266189 190.83333333333334,102.76978417266189 203.33333333333334,102.76978417266189 C 215.83333333333334,102.76978417266189 216.38888888888889,102.76978417266189 228.88888888888889,102.76978417266189 C 241.38888888888889,102.76978417266189 241.94444444444446,94.85611510791368 254.44444444444446,94.85611510791368 C 266.94444444444446,94.85611510791368 267.5,94.85611510791368 280.0,94.85611510791368 C 292.5,94.85611510791368 293.05555555555554,102.76978417266189 305.55555555555554,102.76978417266189 C 318.05555555555554,102.76978417266189 318.6111111111111,102.76978417266189 331.1111111111111,102.76978417266189 C 343.6111111111111,102.76978417266189 344.1666666666667,107.08633093525181 356.6666666666667,107.08633093525181 C 369.1666666666667,107.08633093525181 369.7222222222222,102.76978417266189 382.2222222222222,102.76978417266189 C 394.7222222222222,102.76978417266189 395.27777777777777,107.08633093525181 407.77777777777777,107.08633093525181 C 420.27777777777777,107.08633093525181 420.8333333333333,102.76978417266189 433.3333333333333,102.76978417266189 C 445.8333333333333,102.76978417266189 446.3888888888889,102.76978417266189 458.8888888888889,102.76978417266189 C 471.3888888888889,102.76978417266189 471.94444444444446,94.85611510791368 484.44444444444446,94.85611510791368 C 496.94444444444446,94.85611510791368 497.5,79.02877697841727 510.0,79.02877697841727 C 522.5,79.02877697841727 523.0555555555555,79.02877697841727 535.5555555555555,79.02877697841727 C 548.0555555555555,79.02877697841727 548.6111111111111,71.11510791366908 561.1111111111111,71.11510791366908 C 573.6111111111111,71.11510791366908 574.1666666666666,71.11510791366908 586.6666666666666,71.11510791366908 C 599.1666666666666,71.11510791366908 599.7222222222222,71.11510791366908 612.2222222222222,71.11510791366908 C 624.7222222222222,71.11510791366908 625.2777777777777,71.11510791366908 637.7777777777777,71.11510791366908 C 650.2777777777777,71.11510791366908 650.8333333333334,71.11510791366908 663.3333333333334,71.11510791366908 C 675.8333333333334,71.11510791366908 676.3888888888889,71.11510791366908 688.8888888888889,71.11510791366908 C 701.3888888888889,71.11510791366908 701.9444444444443,79.02877697841727 714.4444444444443,79.02877697841727 C 726.9444444444443,79.02877697841727 727.5,79.02877697841727 740.0,79.02877697841727 C 752.5,79.02877697841727 753.0555555555555,79.02877697841727 765.5555555555555,79.02877697841727 C 778.0555555555555,79.02877697841727 778.6111111111112,79.02877697841727 791.1111111111112,79.02877697841727 C 803.6111111111112,79.02877697841727 804.1666666666666,86.94244604316548 816.6666666666666,86.94244604316548 C 829.1666666666666,86.94244604316548 829.7222222222222,86.94244604316548 842.2222222222222,86.94244604316548 C 854.7222222222222,86.94244604316548 855.2777777777778,86.94244604316548 867.7777777777778,86.94244604316548 C 880.2777777777778,86.94244604316548 880.8333333333333,86.94244604316548 893.3333333333333,86.94244604316548 C 905.8333333333333,86.94244604316548 906.3888888888889,86.94244604316548 918.8888888888889,86.94244604316548 C 931.3888888888889,86.94244604316548 931.9444444444445,94.85611510791368 944.4444444444445,94.85611510791368 C 956.9444444444445,94.85611510791368 957.5,86.94244604316548 970.0,86.94244604316548 C 982.5,86.94244604316548 983.0555555555555,94.85611510791368 995.5555555555555,94.85611510791368 C 1008.0555555555555,94.85611510791368 1008.6111111111111,94.85611510791368 1021.1111111111111,94.85611510791368 C 1033.611111111111,94.85611510791368 1034.1666666666667,102.76978417266189 1046.6666666666667,102.76978417266189 C 1059.1666666666667,102.76978417266189 1059.7222222222222,107.08633093525181 1072.2222222222222,107.08633093525181 C 1084.7222222222222,107.08633093525181 1085.2777777777778,107.08633093525181 1097.7777777777778,107.08633093525181 C 1110.2777777777778,107.08633093525181 1110.8333333333333,107.08633093525181 1123.3333333333333,107.08633093525181 C 1135.8333333333333,107.08633093525181 1136.388888888889,107.08633093525181 1148.888888888889,107.08633093525181 C 1161.388888888889,107.08633093525181 1161.9444444444443,107.08633093525181 1174.4444444444443,107.08633093525181 C 1186.9444444444443,107.08633093525181 1187.5,107.08633093525181 1200.0,107.08633093525181" stroke="gray" stroke-width="4" fill="none"></path><circle cx="50.0" cy="94.85611510791368" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="75.55555555555556" cy="94.85611510791368" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="101.11111111111111" cy="102.76978417266189" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="126.66666666666667" cy="94.85611510791368" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="152.22222222222223" cy="94.85611510791368" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="177.77777777777777" cy="102.76978417266189" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="203.33333333333334" cy="102.76978417266189" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="228.88888888888889" cy="102.76978417266189" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="254.44444444444446" cy="94.85611510791368" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="280.0" cy="94.85611510791368" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="305.55555555555554" cy="102.76978417266189" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="331.1111111111111" cy="102.76978417266189" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="356.6666666666667" cy="107.08633093525181" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="382.2222222222222" cy="102.76978417266189" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="407.77777777777777" cy="107.08633093525181" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="433.3333333333333" cy="102.76978417266189" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="458.8888888888889" cy="102.76978417266189" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="484.44444444444446" cy="94.85611510791368" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="510.0" cy="79.02877697841727" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="535.5555555555555" cy="79.02877697841727" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="561.1111111111111" cy="71.11510791366908" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="586.6666666666666" cy="71.11510791366908" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="612.2222222222222" cy="71.11510791366908" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="637.7777777777777" cy="71.11510791366908" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="663.3333333333334" cy="71.11510791366908" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="688.8888888888889" cy="71.11510791366908" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="714.4444444444443" cy="79.02877697841727" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="740.0" cy="79.02877697841727" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="765.5555555555555" cy="79.02877697841727" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="791.1111111111112" cy="79.02877697841727" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="816.6666666666666" cy="86.94244604316548" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="842.2222222222222" cy="86.94244604316548" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="867.7777777777778" cy="86.94244604316548" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="893.3333333333333" cy="86.94244604316548" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="918.8888888888889" cy="86.94244604316548" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="944.4444444444445" cy="94.85611510791368" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="970.0" cy="86.94244604316548" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="995.5555555555555" cy="94.85611510791368" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1021.1111111111111" cy="94.85611510791368" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1046.6666666666667" cy="102.76978417266189" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1072.2222222222222" cy="107.08633093525181" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1097.7777777777778" cy="107.08633093525181" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1123.3333333333333" cy="107.08633093525181" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1148.888888888889" cy="107.08633093525181" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1174.4444444444443" cy="107.08633093525181" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1200.0" cy="107.08633093525181" r="4" stroke="black" stroke-width="4" fill="white"></circle><g class="y-axis-line"><rect x="0" y="0" width="65" height="130" stroke="transparent" stroke-width="0" fill="transparent"></rect><text x="0" y="19.0" fill="transparent" stroke="transparent" font-size="25">30.0</text><text x="0" y="126.0" fill="transparent" stroke="transparent" font-size="25">16.1</text></g><g class="vert-line"><rect x="40.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="60.0" y="20" fill="transparent" stroke="transparent" font-size="30px">18.9</text></g><g class="vert-line"><rect x="65.55555555555556" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="85.55555555555556" y="20" fill="transparent" stroke="transparent" font-size="30px">18.9</text></g><g class="vert-line"><rect x="91.11111111111111" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="111.11111111111111" y="20" fill="transparent" stroke="transparent" font-size="30px">17.8</text></g><g class="vert-line"><rect x="116.66666666666667" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="136.66666666666669" y="20" fill="transparent" stroke="transparent" font-size="30px">18.9</text></g><g class="vert-line"><rect x="142.22222222222223" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="162.22222222222223" y="20" fill="transparent" stroke="transparent" font-size="30px">18.9</text></g><g class="vert-line"><rect x="167.77777777777777" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="187.77777777777777" y="20" fill="transparent" stroke="transparent" font-size="30px">17.8</text></g><g class="vert-line"><rect x="193.33333333333334" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="213.33333333333334" y="20" fill="transparent" stroke="transparent" font-size="30px">17.8</text></g><g class="vert-line"><rect x="218.88888888888889" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="238.88888888888889" y="20" fill="transparent" stroke="transparent" font-size="30px">17.8</text></g><g class="vert-line"><rect x="244.44444444444446" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="264.44444444444446" y="20" fill="transparent" stroke="transparent" font-size="30px">18.9</text></g><g class="vert-line"><rect x="270.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="290.0" y="20" fill="transparent" stroke="transparent" font-size="30px">18.9</text></g><g class="vert-line"><rect x="295.55555555555554" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="315.55555555555554" y="20" fill="transparent" stroke="transparent" font-size="30px">17.8</text></g><g class="vert-line"><rect x="321.1111111111111" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="341.1111111111111" y="20" fill="transparent" stroke="transparent" font-size="30px">17.8</text></g><g class="vert-line"><rect x="346.6666666666667" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="366.6666666666667" y="20" fill="transparent" stroke="transparent" font-size="30px">17.2</text></g><g class="vert-line"><rect x="372.2222222222222" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="392.2222222222222" y="20" fill="transparent" stroke="transparent" font-size="30px">17.8</text></g><g class="vert-line"><rect x="397.77777777777777" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="417.77777777777777" y="20" fill="transparent" stroke="transparent" font-size="30px">17.2</text></g><g class="vert-line"><rect x="423.3333333333333" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="443.3333333333333" y="20" fill="transparent" stroke="transparent" font-size="30px">17.8</text></g><g class="vert-line"><rect x="448.8888888888889" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="468.8888888888889" y="20" fill="transparent" stroke="transparent" font-size="30px">17.8</text></g><g class="vert-line"><rect x="474.44444444444446" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="494.44444444444446" y="20" fill="transparent" stroke="transparent" font-size="30px">18.9</text></g><g class="vert-line"><rect x="500.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="520.0" y="20" fill="transparent" stroke="transparent" font-size="30px">21.1</text></g><g class="vert-line"><rect x="525.5555555555555" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="545.5555555555555" y="20" fill="transparent" stroke="transparent" font-size="30px">21.1</text></g><g class="vert-line"><rect x="551.1111111111111" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="571.1111111111111" y="20" fill="transparent" stroke="transparent" font-size="30px">22.2</text></g><g class="vert-line"><rect x="576.6666666666666" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="596.6666666666666" y="20" fill="transparent" stroke="transparent" font-size="30px">22.2</text></g><g class="vert-line"><rect x="602.2222222222222" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="622.2222222222222" y="20" fill="transparent" stroke="transparent" font-size="30px">22.2</text></g><g class="vert-line"><rect x="627.7777777777777" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="647.7777777777777" y="20" fill="transparent" stroke="transparent" font-size="30px">22.2</text></g><g class="vert-line"><rect x="653.3333333333334" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="673.3333333333334" y="20" fill="transparent" stroke="transparent" font-size="30px">22.2</text></g><g class="vert-line"><rect x="678.8888888888889" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="698.8888888888889" y="20" fill="transparent" stroke="transparent" font-size="30px">22.2</text></g><g class="vert-line"><rect x="704.4444444444443" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="724.4444444444443" y="20" fill="transparent" stroke="transparent" font-size="30px">21.1</text></g><g class="vert-line"><rect x="730.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="750.0" y="20" fill="transparent" stroke="transparent" font-size="30px">21.1</text></g><g class="vert-line"><rect x="755.5555555555555" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="775.5555555555555" y="20" fill="transparent" stroke="transparent" font-size="30px">21.1</text></g><g class="vert-line"><rect x="781.1111111111112" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="801.1111111111112" y="20" fill="transparent" stroke="transparent" font-size="30px">21.1</text></g><g class="vert-line"><rect x="806.6666666666666" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="826.6666666666666" y="20" fill="transparent" stroke="transparent" font-size="30px">20.0</text></g><g class="vert-line"><rect x="832.2222222222222" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="852.2222222222222" y="20" fill="transparent" stroke="transparent" font-size="30px">20.0</text></g><g class="vert-line"><rect x="857.7777777777778" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="877.7777777777778" y="20" fill="transparent" stroke="transparent" font-size="30px">20.0</text></g><g class="vert-line"><rect x="883.3333333333333" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="903.3333333333333" y="20" fill="transparent" stroke="transparent" font-size="30px">20.0</text></g><g class="vert-line"><rect x="908.8888888888889" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="928.8888888888889" y="20" fill="transparent" stroke="transparent" font-size="30px">20.0</text></g><g class="vert-line"><rect x="934.4444444444445" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="954.4444444444445" y="20" fill="transparent" stroke="transparent" font-size="30px">18.9</text></g><g class="vert-line"><rect x="960.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="980.0" y="20" fill="transparent" stroke="transparent" font-size="30px">20.0</text></g><g class="vert-line"><rect x="985.5555555555555" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1005.5555555555555" y="20" fill="transparent" stroke="transparent" font-size="30px">18.9</text></g><g class="vert-line"><rect x="1011.1111111111111" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1031.111111111111" y="20" fill="transparent" stroke="transparent" font-size="30px">18.9</text></g><g class="vert-line"><rect x="1036.6666666666667" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1056.6666666666667" y="20" fill="transparent" stroke="transparent" font-size="30px">17.8</text></g><g class="vert-line"><rect x="1062.2222222222222" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1082.2222222222222" y="20" fill="transparent" stroke="transparent" font-size="30px">17.2</text></g><g class="vert-line"><rect x="1087.7777777777778" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1107.7777777777778" y="20" fill="transparent" stroke="transparent" font-size="30px">17.2</text></g><g class="vert-line"><rect x="1113.3333333333333" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1133.3333333333333" y="20" fill="transparent" stroke="transparent" font-size="30px">17.2</text></g><g class="vert-line"><rect x="1138.888888888889" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1158.888888888889" y="20" fill="transparent" stroke="transparent" font-size="30px">17.2</text></g><g class="vert-line"><rect x="1164.4444444444443" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1184.4444444444443" y="20" fill="transparent" stroke="transparent" font-size="30px">17.2</text></g><g class="vert-line"><rect x="1190.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1210.0" y="20" fill="transparent" stroke="transparent" font-size="30px">17.2</text></g></svg></div></td>
    <td class="gt_row gt_left"><div><svg viewbox="0 0 1250 130" style="height: 2em; margin-left: auto; margin-right: auto; font-size: inherit; overflow: visible; vertical-align: middle; position:relative;"><defs><pattern id="area_pattern" width="8" height="8" patternunits="userSpaceOnUse"><path class="pattern-line" d="M 0,8 l 8,-8 M -1,1 l 4,-4 M 6,10 l 4,-4" stroke="#FF0000" stroke-width="1.5" stroke-linecap="round" shape-rendering="geometricPrecision"></path></pattern></defs><style> text { font-family: ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace; stroke-width: 0.15em; paint-order: stroke; stroke-linejoin: round; cursor: default; } .vert-line:hover rect { fill: #911EB4; fill-opacity: 40%; stroke: #FFFFFF60; color: red; } .vert-line:hover text { stroke: white; fill: #212427; } .horizontal-line:hover text {stroke: white; fill: #212427; } .ref-line:hover rect { stroke: #FFFFFF60; } .ref-line:hover line { stroke: #FF0000; } .ref-line:hover text { stroke: white; fill: #212427; } .y-axis-line:hover rect { fill: #EDEDED; fill-opacity: 60%; stroke: #FFFFFF60; color: red; } .y-axis-line:hover text { stroke: white; stroke-width: 0.20em; fill: #1A1C1F; } </style><path d="M 50.0,65.79365079365078 C 62.5,65.79365079365078 63.05555555555556,57.85714285714286 75.55555555555556,57.85714285714286 C 88.05555555555556,57.85714285714286 88.61111111111111,51.50793650793651 101.11111111111111,51.50793650793651 C 113.61111111111111,51.50793650793651 114.16666666666667,57.85714285714286 126.66666666666667,57.85714285714286 C 139.16666666666669,57.85714285714286 139.72222222222223,65.79365079365078 152.22222222222223,65.79365079365078 C 164.72222222222223,65.79365079365078 165.27777777777777,57.85714285714286 177.77777777777777,57.85714285714286 C 190.27777777777777,57.85714285714286 190.83333333333334,57.85714285714286 203.33333333333334,57.85714285714286 C 215.83333333333334,57.85714285714286 216.38888888888889,57.85714285714286 228.88888888888889,57.85714285714286 C 241.38888888888889,57.85714285714286 241.94444444444446,72.14285714285714 254.44444444444446,72.14285714285714 C 266.94444444444446,72.14285714285714 267.5,72.14285714285714 280.0,72.14285714285714 C 292.5,72.14285714285714 293.05555555555554,57.85714285714286 305.55555555555554,57.85714285714286 C 318.05555555555554,57.85714285714286 318.6111111111111,57.85714285714286 331.1111111111111,57.85714285714286 C 343.6111111111111,57.85714285714286 344.1666666666667,59.44444444444444 356.6666666666667,59.44444444444444 C 369.1666666666667,59.44444444444444 369.7222222222222,34.04761904761905 382.2222222222222,34.04761904761905 C 394.7222222222222,34.04761904761905 395.27777777777777,43.57142857142857 407.77777777777777,43.57142857142857 C 420.27777777777777,43.57142857142857 420.8333333333333,51.50793650793651 433.3333333333333,51.50793650793651 C 445.8333333333333,51.50793650793651 446.3888888888889,51.50793650793651 458.8888888888889,51.50793650793651 C 471.3888888888889,51.50793650793651 471.94444444444446,57.85714285714286 484.44444444444446,57.85714285714286 C 496.94444444444446,57.85714285714286 497.5,72.14285714285714 510.0,72.14285714285714 C 522.5,72.14285714285714 523.0555555555555,65.79365079365078 535.5555555555555,65.79365079365078 C 548.0555555555555,65.79365079365078 548.6111111111111,78.4920634920635 561.1111111111111,78.4920634920635 C 573.6111111111111,78.4920634920635 574.1666666666666,78.4920634920635 586.6666666666666,78.4920634920635 C 599.1666666666666,78.4920634920635 599.7222222222222,78.4920634920635 612.2222222222222,78.4920634920635 C 624.7222222222222,78.4920634920635 625.2777777777777,72.14285714285714 637.7777777777777,72.14285714285714 C 650.2777777777777,72.14285714285714 650.8333333333334,72.14285714285714 663.3333333333334,72.14285714285714 C 675.8333333333334,72.14285714285714 676.3888888888889,72.14285714285714 688.8888888888889,72.14285714285714 C 701.3888888888889,72.14285714285714 701.9444444444443,65.79365079365078 714.4444444444443,65.79365079365078 C 726.9444444444443,65.79365079365078 727.5,57.85714285714286 740.0,57.85714285714286 C 752.5,57.85714285714286 753.0555555555555,57.85714285714286 765.5555555555555,57.85714285714286 C 778.0555555555555,57.85714285714286 778.6111111111112,57.85714285714286 791.1111111111112,57.85714285714286 C 803.6111111111112,57.85714285714286 804.1666666666666,49.92063492063492 816.6666666666666,49.92063492063492 C 829.1666666666666,49.92063492063492 829.7222222222222,49.92063492063492 842.2222222222222,49.92063492063492 C 854.7222222222222,49.92063492063492 855.2777777777778,49.92063492063492 867.7777777777778,49.92063492063492 C 880.2777777777778,49.92063492063492 880.8333333333333,41.98412698412699 893.3333333333333,41.98412698412699 C 905.8333333333333,41.98412698412699 906.3888888888889,41.98412698412699 918.8888888888889,41.98412698412699 C 931.3888888888889,41.98412698412699 931.9444444444445,34.04761904761905 944.4444444444445,34.04761904761905 C 956.9444444444445,34.04761904761905 957.5,41.98412698412699 970.0,41.98412698412699 C 982.5,41.98412698412699 983.0555555555555,34.04761904761905 995.5555555555555,34.04761904761905 C 1008.0555555555555,34.04761904761905 1008.6111111111111,34.04761904761905 1021.1111111111111,34.04761904761905 C 1033.611111111111,34.04761904761905 1034.1666666666667,24.523809523809526 1046.6666666666667,24.523809523809526 C 1059.1666666666667,24.523809523809526 1059.7222222222222,24.523809523809526 1072.2222222222222,24.523809523809526 C 1084.7222222222222,24.523809523809526 1085.2777777777778,24.523809523809526 1097.7777777777778,24.523809523809526 C 1110.2777777777778,24.523809523809526 1110.8333333333333,24.523809523809526 1123.3333333333333,24.523809523809526 C 1135.8333333333333,24.523809523809526 1136.388888888889,24.523809523809526 1148.888888888889,24.523809523809526 C 1161.388888888889,24.523809523809526 1161.9444444444443,24.523809523809526 1174.4444444444443,24.523809523809526 C 1186.9444444444443,24.523809523809526 1187.5,24.523809523809526 1200.0,24.523809523809526" stroke="gray" stroke-width="4" fill="none"></path><circle cx="50.0" cy="65.79365079365078" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="75.55555555555556" cy="57.85714285714286" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="101.11111111111111" cy="51.50793650793651" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="126.66666666666667" cy="57.85714285714286" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="152.22222222222223" cy="65.79365079365078" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="177.77777777777777" cy="57.85714285714286" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="203.33333333333334" cy="57.85714285714286" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="228.88888888888889" cy="57.85714285714286" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="254.44444444444446" cy="72.14285714285714" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="280.0" cy="72.14285714285714" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="305.55555555555554" cy="57.85714285714286" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="331.1111111111111" cy="57.85714285714286" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="356.6666666666667" cy="59.44444444444444" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="382.2222222222222" cy="34.04761904761905" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="407.77777777777777" cy="43.57142857142857" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="433.3333333333333" cy="51.50793650793651" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="458.8888888888889" cy="51.50793650793651" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="484.44444444444446" cy="57.85714285714286" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="510.0" cy="72.14285714285714" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="535.5555555555555" cy="65.79365079365078" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="561.1111111111111" cy="78.4920634920635" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="586.6666666666666" cy="78.4920634920635" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="612.2222222222222" cy="78.4920634920635" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="637.7777777777777" cy="72.14285714285714" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="663.3333333333334" cy="72.14285714285714" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="688.8888888888889" cy="72.14285714285714" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="714.4444444444443" cy="65.79365079365078" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="740.0" cy="57.85714285714286" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="765.5555555555555" cy="57.85714285714286" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="791.1111111111112" cy="57.85714285714286" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="816.6666666666666" cy="49.92063492063492" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="842.2222222222222" cy="49.92063492063492" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="867.7777777777778" cy="49.92063492063492" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="893.3333333333333" cy="41.98412698412699" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="918.8888888888889" cy="41.98412698412699" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="944.4444444444445" cy="34.04761904761905" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="970.0" cy="41.98412698412699" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="995.5555555555555" cy="34.04761904761905" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1021.1111111111111" cy="34.04761904761905" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1046.6666666666667" cy="24.523809523809526" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1072.2222222222222" cy="24.523809523809526" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1097.7777777777778" cy="24.523809523809526" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1123.3333333333333" cy="24.523809523809526" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1148.888888888889" cy="24.523809523809526" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1174.4444444444443" cy="24.523809523809526" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1200.0" cy="24.523809523809526" r="4" stroke="black" stroke-width="4" fill="white"></circle><g class="y-axis-line"><rect x="0" y="0" width="65" height="130" stroke="transparent" stroke-width="0" fill="transparent"></rect><text x="0" y="19.0" fill="transparent" stroke="transparent" font-size="25">100</text><text x="0" y="126.0" fill="transparent" stroke="transparent" font-size="25">37</text></g><g class="vert-line"><rect x="40.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="60.0" y="20" fill="transparent" stroke="transparent" font-size="30px">68</text></g><g class="vert-line"><rect x="65.55555555555556" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="85.55555555555556" y="20" fill="transparent" stroke="transparent" font-size="30px">73</text></g><g class="vert-line"><rect x="91.11111111111111" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="111.11111111111111" y="20" fill="transparent" stroke="transparent" font-size="30px">77</text></g><g class="vert-line"><rect x="116.66666666666667" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="136.66666666666669" y="20" fill="transparent" stroke="transparent" font-size="30px">73</text></g><g class="vert-line"><rect x="142.22222222222223" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="162.22222222222223" y="20" fill="transparent" stroke="transparent" font-size="30px">68</text></g><g class="vert-line"><rect x="167.77777777777777" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="187.77777777777777" y="20" fill="transparent" stroke="transparent" font-size="30px">73</text></g><g class="vert-line"><rect x="193.33333333333334" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="213.33333333333334" y="20" fill="transparent" stroke="transparent" font-size="30px">73</text></g><g class="vert-line"><rect x="218.88888888888889" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="238.88888888888889" y="20" fill="transparent" stroke="transparent" font-size="30px">73</text></g><g class="vert-line"><rect x="244.44444444444446" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="264.44444444444446" y="20" fill="transparent" stroke="transparent" font-size="30px">64</text></g><g class="vert-line"><rect x="270.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="290.0" y="20" fill="transparent" stroke="transparent" font-size="30px">64</text></g><g class="vert-line"><rect x="295.55555555555554" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="315.55555555555554" y="20" fill="transparent" stroke="transparent" font-size="30px">73</text></g><g class="vert-line"><rect x="321.1111111111111" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="341.1111111111111" y="20" fill="transparent" stroke="transparent" font-size="30px">73</text></g><g class="vert-line"><rect x="346.6666666666667" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="366.6666666666667" y="20" fill="transparent" stroke="transparent" font-size="30px">72</text></g><g class="vert-line"><rect x="372.2222222222222" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="392.2222222222222" y="20" fill="transparent" stroke="transparent" font-size="30px">88</text></g><g class="vert-line"><rect x="397.77777777777777" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="417.77777777777777" y="20" fill="transparent" stroke="transparent" font-size="30px">82</text></g><g class="vert-line"><rect x="423.3333333333333" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="443.3333333333333" y="20" fill="transparent" stroke="transparent" font-size="30px">77</text></g><g class="vert-line"><rect x="448.8888888888889" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="468.8888888888889" y="20" fill="transparent" stroke="transparent" font-size="30px">77</text></g><g class="vert-line"><rect x="474.44444444444446" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="494.44444444444446" y="20" fill="transparent" stroke="transparent" font-size="30px">73</text></g><g class="vert-line"><rect x="500.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="520.0" y="20" fill="transparent" stroke="transparent" font-size="30px">64</text></g><g class="vert-line"><rect x="525.5555555555555" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="545.5555555555555" y="20" fill="transparent" stroke="transparent" font-size="30px">68</text></g><g class="vert-line"><rect x="551.1111111111111" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="571.1111111111111" y="20" fill="transparent" stroke="transparent" font-size="30px">60</text></g><g class="vert-line"><rect x="576.6666666666666" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="596.6666666666666" y="20" fill="transparent" stroke="transparent" font-size="30px">60</text></g><g class="vert-line"><rect x="602.2222222222222" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="622.2222222222222" y="20" fill="transparent" stroke="transparent" font-size="30px">60</text></g><g class="vert-line"><rect x="627.7777777777777" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="647.7777777777777" y="20" fill="transparent" stroke="transparent" font-size="30px">64</text></g><g class="vert-line"><rect x="653.3333333333334" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="673.3333333333334" y="20" fill="transparent" stroke="transparent" font-size="30px">64</text></g><g class="vert-line"><rect x="678.8888888888889" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="698.8888888888889" y="20" fill="transparent" stroke="transparent" font-size="30px">64</text></g><g class="vert-line"><rect x="704.4444444444443" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="724.4444444444443" y="20" fill="transparent" stroke="transparent" font-size="30px">68</text></g><g class="vert-line"><rect x="730.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="750.0" y="20" fill="transparent" stroke="transparent" font-size="30px">73</text></g><g class="vert-line"><rect x="755.5555555555555" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="775.5555555555555" y="20" fill="transparent" stroke="transparent" font-size="30px">73</text></g><g class="vert-line"><rect x="781.1111111111112" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="801.1111111111112" y="20" fill="transparent" stroke="transparent" font-size="30px">73</text></g><g class="vert-line"><rect x="806.6666666666666" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="826.6666666666666" y="20" fill="transparent" stroke="transparent" font-size="30px">78</text></g><g class="vert-line"><rect x="832.2222222222222" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="852.2222222222222" y="20" fill="transparent" stroke="transparent" font-size="30px">78</text></g><g class="vert-line"><rect x="857.7777777777778" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="877.7777777777778" y="20" fill="transparent" stroke="transparent" font-size="30px">78</text></g><g class="vert-line"><rect x="883.3333333333333" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="903.3333333333333" y="20" fill="transparent" stroke="transparent" font-size="30px">83</text></g><g class="vert-line"><rect x="908.8888888888889" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="928.8888888888889" y="20" fill="transparent" stroke="transparent" font-size="30px">83</text></g><g class="vert-line"><rect x="934.4444444444445" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="954.4444444444445" y="20" fill="transparent" stroke="transparent" font-size="30px">88</text></g><g class="vert-line"><rect x="960.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="980.0" y="20" fill="transparent" stroke="transparent" font-size="30px">83</text></g><g class="vert-line"><rect x="985.5555555555555" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1005.5555555555555" y="20" fill="transparent" stroke="transparent" font-size="30px">88</text></g><g class="vert-line"><rect x="1011.1111111111111" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1031.111111111111" y="20" fill="transparent" stroke="transparent" font-size="30px">88</text></g><g class="vert-line"><rect x="1036.6666666666667" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1056.6666666666667" y="20" fill="transparent" stroke="transparent" font-size="30px">94</text></g><g class="vert-line"><rect x="1062.2222222222222" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1082.2222222222222" y="20" fill="transparent" stroke="transparent" font-size="30px">94</text></g><g class="vert-line"><rect x="1087.7777777777778" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1107.7777777777778" y="20" fill="transparent" stroke="transparent" font-size="30px">94</text></g><g class="vert-line"><rect x="1113.3333333333333" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1133.3333333333333" y="20" fill="transparent" stroke="transparent" font-size="30px">94</text></g><g class="vert-line"><rect x="1138.888888888889" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1158.888888888889" y="20" fill="transparent" stroke="transparent" font-size="30px">94</text></g><g class="vert-line"><rect x="1164.4444444444443" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1184.4444444444443" y="20" fill="transparent" stroke="transparent" font-size="30px">94</text></g><g class="vert-line"><rect x="1190.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1210.0" y="20" fill="transparent" stroke="transparent" font-size="30px">94</text></g></svg></div></td>
  </tr>
  <tr>
    <td class="gt_row gt_left">Tue, May 2, 2023</td>
    <td class="gt_row gt_left"><div><svg viewbox="0 0 1225 130" style="height: 2em; margin-left: auto; margin-right: auto; font-size: inherit; overflow: visible; vertical-align: middle; position:relative;"><defs><pattern id="area_pattern" width="8" height="8" patternunits="userSpaceOnUse"><path class="pattern-line" d="M 0,8 l 8,-8 M -1,1 l 4,-4 M 6,10 l 4,-4" stroke="#FF0000" stroke-width="1.5" stroke-linecap="round" shape-rendering="geometricPrecision"></path></pattern></defs><style> text { font-family: ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace; stroke-width: 0.15em; paint-order: stroke; stroke-linejoin: round; cursor: default; } .vert-line:hover rect { fill: #911EB4; fill-opacity: 40%; stroke: #FFFFFF60; color: red; } .vert-line:hover text { stroke: white; fill: #212427; } .horizontal-line:hover text {stroke: white; fill: #212427; } .ref-line:hover rect { stroke: #FFFFFF60; } .ref-line:hover line { stroke: #FF0000; } .ref-line:hover text { stroke: white; fill: #212427; } .y-axis-line:hover rect { fill: #EDEDED; fill-opacity: 60%; stroke: #FFFFFF60; color: red; } .y-axis-line:hover text { stroke: white; stroke-width: 0.20em; fill: #1A1C1F; } </style><path d="M 50.0,107.08633093525181 C 62.5,107.08633093525181 63.06818181818181,107.08633093525181 75.56818181818181,107.08633093525181 C 88.06818181818181,107.08633093525181 88.63636363636364,107.08633093525181 101.13636363636364,107.08633093525181 C 113.63636363636364,107.08633093525181 114.20454545454545,107.08633093525181 126.70454545454545,107.08633093525181 C 139.20454545454544,107.08633093525181 139.77272727272728,102.76978417266189 152.27272727272728,102.76978417266189 C 164.77272727272728,102.76978417266189 165.3409090909091,102.76978417266189 177.8409090909091,102.76978417266189 C 190.3409090909091,102.76978417266189 190.9090909090909,102.76978417266189 203.4090909090909,102.76978417266189 C 215.9090909090909,102.76978417266189 216.47727272727272,102.76978417266189 228.97727272727272,102.76978417266189 C 241.47727272727272,102.76978417266189 242.04545454545456,102.76978417266189 254.54545454545456,102.76978417266189 C 267.04545454545456,102.76978417266189 267.6136363636364,102.76978417266189 280.1136363636364,102.76978417266189 C 292.6136363636364,102.76978417266189 293.1818181818182,102.76978417266189 305.6818181818182,102.76978417266189 C 318.1818181818182,102.76978417266189 318.75,102.76978417266189 331.25,102.76978417266189 C 343.75,102.76978417266189 344.3181818181818,102.76978417266189 356.8181818181818,102.76978417266189 C 369.3181818181818,102.76978417266189 369.8863636363636,102.76978417266189 382.3863636363636,102.76978417266189 C 394.8863636363636,102.76978417266189 395.45454545454544,94.85611510791368 407.95454545454544,94.85611510791368 C 420.45454545454544,94.85611510791368 421.02272727272725,94.85611510791368 433.52272727272725,94.85611510791368 C 446.02272727272725,94.85611510791368 446.5909090909091,94.85611510791368 459.0909090909091,94.85611510791368 C 471.5909090909091,94.85611510791368 472.1590909090909,94.85611510791368 484.6590909090909,94.85611510791368 C 497.1590909090909,94.85611510791368 497.72727272727275,94.85611510791368 510.22727272727275,94.85611510791368 C 522.7272727272727,94.85611510791368 523.2954545454545,94.85611510791368 535.7954545454545,94.85611510791368 C 548.2954545454545,94.85611510791368 548.8636363636364,94.85611510791368 561.3636363636364,94.85611510791368 C 573.8636363636364,94.85611510791368 574.4318181818182,94.85611510791368 586.9318181818182,94.85611510791368 C 599.4318181818182,94.85611510791368 600.0,86.94244604316548 612.5,86.94244604316548 C 625.0,86.94244604316548 625.5681818181818,79.02877697841727 638.0681818181818,79.02877697841727 C 650.5681818181818,79.02877697841727 651.1363636363636,79.02877697841727 663.6363636363636,79.02877697841727 C 676.1363636363636,79.02877697841727 676.7045454545455,79.02877697841727 689.2045454545455,79.02877697841727 C 701.7045454545455,79.02877697841727 702.2727272727273,71.11510791366908 714.7727272727273,71.11510791366908 C 727.2727272727273,71.11510791366908 727.8409090909091,71.11510791366908 740.3409090909091,71.11510791366908 C 752.8409090909091,71.11510791366908 753.4090909090909,71.11510791366908 765.9090909090909,71.11510791366908 C 778.4090909090909,71.11510791366908 778.9772727272727,71.11510791366908 791.4772727272727,71.11510791366908 C 803.9772727272727,71.11510791366908 804.5454545454545,71.11510791366908 817.0454545454545,71.11510791366908 C 829.5454545454545,71.11510791366908 830.1136363636364,71.11510791366908 842.6136363636364,71.11510791366908 C 855.1136363636364,71.11510791366908 855.6818181818182,71.11510791366908 868.1818181818182,71.11510791366908 C 880.6818181818182,71.11510791366908 881.25,71.11510791366908 893.75,71.11510791366908 C 906.25,71.11510791366908 906.8181818181818,71.11510791366908 919.3181818181818,71.11510791366908 C 931.8181818181818,71.11510791366908 932.3863636363636,79.02877697841727 944.8863636363636,79.02877697841727 C 957.3863636363636,79.02877697841727 957.9545454545455,79.02877697841727 970.4545454545455,79.02877697841727 C 982.9545454545455,79.02877697841727 983.5227272727273,86.94244604316548 996.0227272727273,86.94244604316548 C 1008.5227272727273,86.94244604316548 1009.0909090909091,86.94244604316548 1021.5909090909091,86.94244604316548 C 1034.090909090909,86.94244604316548 1034.659090909091,94.85611510791368 1047.159090909091,94.85611510791368 C 1059.659090909091,94.85611510791368 1060.2272727272727,94.85611510791368 1072.7272727272727,94.85611510791368 C 1085.2272727272727,94.85611510791368 1085.7954545454545,94.85611510791368 1098.2954545454545,94.85611510791368 C 1110.7954545454545,94.85611510791368 1111.3636363636365,94.85611510791368 1123.8636363636365,94.85611510791368 C 1136.3636363636365,94.85611510791368 1136.9318181818182,94.85611510791368 1149.4318181818182,94.85611510791368 C 1161.9318181818182,94.85611510791368 1162.5,94.85611510791368 1175.0,94.85611510791368" stroke="gray" stroke-width="4" fill="none"></path><circle cx="50.0" cy="107.08633093525181" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="75.56818181818181" cy="107.08633093525181" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="101.13636363636364" cy="107.08633093525181" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="126.70454545454545" cy="107.08633093525181" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="152.27272727272728" cy="102.76978417266189" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="177.8409090909091" cy="102.76978417266189" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="203.4090909090909" cy="102.76978417266189" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="228.97727272727272" cy="102.76978417266189" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="254.54545454545456" cy="102.76978417266189" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="280.1136363636364" cy="102.76978417266189" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="305.6818181818182" cy="102.76978417266189" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="331.25" cy="102.76978417266189" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="356.8181818181818" cy="102.76978417266189" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="382.3863636363636" cy="102.76978417266189" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="407.95454545454544" cy="94.85611510791368" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="433.52272727272725" cy="94.85611510791368" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="459.0909090909091" cy="94.85611510791368" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="484.6590909090909" cy="94.85611510791368" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="510.22727272727275" cy="94.85611510791368" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="535.7954545454545" cy="94.85611510791368" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="561.3636363636364" cy="94.85611510791368" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="586.9318181818182" cy="94.85611510791368" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="612.5" cy="86.94244604316548" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="638.0681818181818" cy="79.02877697841727" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="663.6363636363636" cy="79.02877697841727" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="689.2045454545455" cy="79.02877697841727" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="714.7727272727273" cy="71.11510791366908" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="740.3409090909091" cy="71.11510791366908" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="765.9090909090909" cy="71.11510791366908" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="791.4772727272727" cy="71.11510791366908" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="817.0454545454545" cy="71.11510791366908" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="842.6136363636364" cy="71.11510791366908" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="868.1818181818182" cy="71.11510791366908" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="893.75" cy="71.11510791366908" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="919.3181818181818" cy="71.11510791366908" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="944.8863636363636" cy="79.02877697841727" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="970.4545454545455" cy="79.02877697841727" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="996.0227272727273" cy="86.94244604316548" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1021.5909090909091" cy="86.94244604316548" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1047.159090909091" cy="94.85611510791368" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1072.7272727272727" cy="94.85611510791368" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1098.2954545454545" cy="94.85611510791368" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1123.8636363636365" cy="94.85611510791368" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1149.4318181818182" cy="94.85611510791368" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1175.0" cy="94.85611510791368" r="4" stroke="black" stroke-width="4" fill="white"></circle><g class="y-axis-line"><rect x="0" y="0" width="65" height="130" stroke="transparent" stroke-width="0" fill="transparent"></rect><text x="0" y="19.0" fill="transparent" stroke="transparent" font-size="25">30.0</text><text x="0" y="126.0" fill="transparent" stroke="transparent" font-size="25">16.1</text></g><g class="vert-line"><rect x="40.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="60.0" y="20" fill="transparent" stroke="transparent" font-size="30px">17.2</text></g><g class="vert-line"><rect x="65.56818181818181" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="85.56818181818181" y="20" fill="transparent" stroke="transparent" font-size="30px">17.2</text></g><g class="vert-line"><rect x="91.13636363636364" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="111.13636363636364" y="20" fill="transparent" stroke="transparent" font-size="30px">17.2</text></g><g class="vert-line"><rect x="116.70454545454545" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="136.70454545454544" y="20" fill="transparent" stroke="transparent" font-size="30px">17.2</text></g><g class="vert-line"><rect x="142.27272727272728" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="162.27272727272728" y="20" fill="transparent" stroke="transparent" font-size="30px">17.8</text></g><g class="vert-line"><rect x="167.8409090909091" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="187.8409090909091" y="20" fill="transparent" stroke="transparent" font-size="30px">17.8</text></g><g class="vert-line"><rect x="193.4090909090909" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="213.4090909090909" y="20" fill="transparent" stroke="transparent" font-size="30px">17.8</text></g><g class="vert-line"><rect x="218.97727272727272" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="238.97727272727272" y="20" fill="transparent" stroke="transparent" font-size="30px">17.8</text></g><g class="vert-line"><rect x="244.54545454545456" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="264.54545454545456" y="20" fill="transparent" stroke="transparent" font-size="30px">17.8</text></g><g class="vert-line"><rect x="270.1136363636364" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="290.1136363636364" y="20" fill="transparent" stroke="transparent" font-size="30px">17.8</text></g><g class="vert-line"><rect x="295.6818181818182" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="315.6818181818182" y="20" fill="transparent" stroke="transparent" font-size="30px">17.8</text></g><g class="vert-line"><rect x="321.25" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="341.25" y="20" fill="transparent" stroke="transparent" font-size="30px">17.8</text></g><g class="vert-line"><rect x="346.8181818181818" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="366.8181818181818" y="20" fill="transparent" stroke="transparent" font-size="30px">17.8</text></g><g class="vert-line"><rect x="372.3863636363636" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="392.3863636363636" y="20" fill="transparent" stroke="transparent" font-size="30px">17.8</text></g><g class="vert-line"><rect x="397.95454545454544" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="417.95454545454544" y="20" fill="transparent" stroke="transparent" font-size="30px">18.9</text></g><g class="vert-line"><rect x="423.52272727272725" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="443.52272727272725" y="20" fill="transparent" stroke="transparent" font-size="30px">18.9</text></g><g class="vert-line"><rect x="449.0909090909091" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="469.0909090909091" y="20" fill="transparent" stroke="transparent" font-size="30px">18.9</text></g><g class="vert-line"><rect x="474.6590909090909" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="494.6590909090909" y="20" fill="transparent" stroke="transparent" font-size="30px">18.9</text></g><g class="vert-line"><rect x="500.22727272727275" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="520.2272727272727" y="20" fill="transparent" stroke="transparent" font-size="30px">18.9</text></g><g class="vert-line"><rect x="525.7954545454545" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="545.7954545454545" y="20" fill="transparent" stroke="transparent" font-size="30px">18.9</text></g><g class="vert-line"><rect x="551.3636363636364" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="571.3636363636364" y="20" fill="transparent" stroke="transparent" font-size="30px">18.9</text></g><g class="vert-line"><rect x="576.9318181818182" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="596.9318181818182" y="20" fill="transparent" stroke="transparent" font-size="30px">18.9</text></g><g class="vert-line"><rect x="602.5" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="622.5" y="20" fill="transparent" stroke="transparent" font-size="30px">20.0</text></g><g class="vert-line"><rect x="628.0681818181818" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="648.0681818181818" y="20" fill="transparent" stroke="transparent" font-size="30px">21.1</text></g><g class="vert-line"><rect x="653.6363636363636" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="673.6363636363636" y="20" fill="transparent" stroke="transparent" font-size="30px">21.1</text></g><g class="vert-line"><rect x="679.2045454545455" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="699.2045454545455" y="20" fill="transparent" stroke="transparent" font-size="30px">21.1</text></g><g class="vert-line"><rect x="704.7727272727273" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="724.7727272727273" y="20" fill="transparent" stroke="transparent" font-size="30px">22.2</text></g><g class="vert-line"><rect x="730.3409090909091" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="750.3409090909091" y="20" fill="transparent" stroke="transparent" font-size="30px">22.2</text></g><g class="vert-line"><rect x="755.9090909090909" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="775.9090909090909" y="20" fill="transparent" stroke="transparent" font-size="30px">22.2</text></g><g class="vert-line"><rect x="781.4772727272727" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="801.4772727272727" y="20" fill="transparent" stroke="transparent" font-size="30px">22.2</text></g><g class="vert-line"><rect x="807.0454545454545" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="827.0454545454545" y="20" fill="transparent" stroke="transparent" font-size="30px">22.2</text></g><g class="vert-line"><rect x="832.6136363636364" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="852.6136363636364" y="20" fill="transparent" stroke="transparent" font-size="30px">22.2</text></g><g class="vert-line"><rect x="858.1818181818182" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="878.1818181818182" y="20" fill="transparent" stroke="transparent" font-size="30px">22.2</text></g><g class="vert-line"><rect x="883.75" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="903.75" y="20" fill="transparent" stroke="transparent" font-size="30px">22.2</text></g><g class="vert-line"><rect x="909.3181818181818" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="929.3181818181818" y="20" fill="transparent" stroke="transparent" font-size="30px">22.2</text></g><g class="vert-line"><rect x="934.8863636363636" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="954.8863636363636" y="20" fill="transparent" stroke="transparent" font-size="30px">21.1</text></g><g class="vert-line"><rect x="960.4545454545455" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="980.4545454545455" y="20" fill="transparent" stroke="transparent" font-size="30px">21.1</text></g><g class="vert-line"><rect x="986.0227272727273" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1006.0227272727273" y="20" fill="transparent" stroke="transparent" font-size="30px">20.0</text></g><g class="vert-line"><rect x="1011.5909090909091" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1031.590909090909" y="20" fill="transparent" stroke="transparent" font-size="30px">20.0</text></g><g class="vert-line"><rect x="1037.159090909091" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1057.159090909091" y="20" fill="transparent" stroke="transparent" font-size="30px">18.9</text></g><g class="vert-line"><rect x="1062.7272727272727" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1082.7272727272727" y="20" fill="transparent" stroke="transparent" font-size="30px">18.9</text></g><g class="vert-line"><rect x="1088.2954545454545" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1108.2954545454545" y="20" fill="transparent" stroke="transparent" font-size="30px">18.9</text></g><g class="vert-line"><rect x="1113.8636363636365" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1133.8636363636365" y="20" fill="transparent" stroke="transparent" font-size="30px">18.9</text></g><g class="vert-line"><rect x="1139.4318181818182" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1159.4318181818182" y="20" fill="transparent" stroke="transparent" font-size="30px">18.9</text></g><g class="vert-line"><rect x="1165.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1185.0" y="20" fill="transparent" stroke="transparent" font-size="30px">18.9</text></g></svg></div></td>
    <td class="gt_row gt_left"><div><svg viewbox="0 0 1225 130" style="height: 2em; margin-left: auto; margin-right: auto; font-size: inherit; overflow: visible; vertical-align: middle; position:relative;"><defs><pattern id="area_pattern" width="8" height="8" patternunits="userSpaceOnUse"><path class="pattern-line" d="M 0,8 l 8,-8 M -1,1 l 4,-4 M 6,10 l 4,-4" stroke="#FF0000" stroke-width="1.5" stroke-linecap="round" shape-rendering="geometricPrecision"></path></pattern></defs><style> text { font-family: ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace; stroke-width: 0.15em; paint-order: stroke; stroke-linejoin: round; cursor: default; } .vert-line:hover rect { fill: #911EB4; fill-opacity: 40%; stroke: #FFFFFF60; color: red; } .vert-line:hover text { stroke: white; fill: #212427; } .horizontal-line:hover text {stroke: white; fill: #212427; } .ref-line:hover rect { stroke: #FFFFFF60; } .ref-line:hover line { stroke: #FF0000; } .ref-line:hover text { stroke: white; fill: #212427; } .y-axis-line:hover rect { fill: #EDEDED; fill-opacity: 60%; stroke: #FFFFFF60; color: red; } .y-axis-line:hover text { stroke: white; stroke-width: 0.20em; fill: #1A1C1F; } </style><path d="M 50.0,15.0 C 62.5,15.0 63.06818181818181,15.0 75.56818181818181,15.0 C 88.06818181818181,15.0 88.63636363636364,15.0 101.13636363636364,15.0 C 113.63636363636364,15.0 114.20454545454545,15.0 126.70454545454545,15.0 C 139.20454545454544,15.0 139.77272727272728,24.523809523809526 152.27272727272728,24.523809523809526 C 164.77272727272728,24.523809523809526 165.3409090909091,24.523809523809526 177.8409090909091,24.523809523809526 C 190.3409090909091,24.523809523809526 190.9090909090909,24.523809523809526 203.4090909090909,24.523809523809526 C 215.9090909090909,24.523809523809526 216.47727272727272,24.523809523809526 228.97727272727272,24.523809523809526 C 241.47727272727272,24.523809523809526 242.04545454545456,24.523809523809526 254.54545454545456,24.523809523809526 C 267.04545454545456,24.523809523809526 267.6136363636364,24.523809523809526 280.1136363636364,24.523809523809526 C 292.6136363636364,24.523809523809526 293.1818181818182,24.523809523809526 305.6818181818182,24.523809523809526 C 318.1818181818182,24.523809523809526 318.75,24.523809523809526 331.25,24.523809523809526 C 343.75,24.523809523809526 344.3181818181818,34.04761904761905 356.8181818181818,34.04761904761905 C 369.3181818181818,34.04761904761905 369.8863636363636,34.04761904761905 382.3863636363636,34.04761904761905 C 394.8863636363636,34.04761904761905 395.45454545454544,34.04761904761905 407.95454545454544,34.04761904761905 C 420.45454545454544,34.04761904761905 421.02272727272725,34.04761904761905 433.52272727272725,34.04761904761905 C 446.02272727272725,34.04761904761905 446.5909090909091,34.04761904761905 459.0909090909091,34.04761904761905 C 471.5909090909091,34.04761904761905 472.1590909090909,34.04761904761905 484.6590909090909,34.04761904761905 C 497.1590909090909,34.04761904761905 497.72727272727275,34.04761904761905 510.22727272727275,34.04761904761905 C 522.7272727272727,34.04761904761905 523.2954545454545,34.04761904761905 535.7954545454545,34.04761904761905 C 548.2954545454545,34.04761904761905 548.8636363636364,34.04761904761905 561.3636363636364,34.04761904761905 C 573.8636363636364,34.04761904761905 574.4318181818182,34.04761904761905 586.9318181818182,34.04761904761905 C 599.4318181818182,34.04761904761905 600.0,41.98412698412699 612.5,41.98412698412699 C 625.0,41.98412698412699 625.5681818181818,49.92063492063492 638.0681818181818,49.92063492063492 C 650.5681818181818,49.92063492063492 651.1363636363636,57.85714285714286 663.6363636363636,57.85714285714286 C 676.1363636363636,57.85714285714286 676.7045454545455,65.79365079365078 689.2045454545455,65.79365079365078 C 701.7045454545455,65.79365079365078 702.2727272727273,72.14285714285714 714.7727272727273,72.14285714285714 C 727.2727272727273,72.14285714285714 727.8409090909091,72.14285714285714 740.3409090909091,72.14285714285714 C 752.8409090909091,72.14285714285714 753.4090909090909,78.4920634920635 765.9090909090909,78.4920634920635 C 778.4090909090909,78.4920634920635 778.9772727272727,72.14285714285714 791.4772727272727,72.14285714285714 C 803.9772727272727,72.14285714285714 804.5454545454545,78.4920634920635 817.0454545454545,78.4920634920635 C 829.5454545454545,78.4920634920635 830.1136363636364,78.4920634920635 842.6136363636364,78.4920634920635 C 855.1136363636364,78.4920634920635 855.6818181818182,78.4920634920635 868.1818181818182,78.4920634920635 C 880.6818181818182,78.4920634920635 881.25,72.14285714285714 893.75,72.14285714285714 C 906.25,72.14285714285714 906.8181818181818,72.14285714285714 919.3181818181818,72.14285714285714 C 931.8181818181818,72.14285714285714 932.3863636363636,65.79365079365078 944.8863636363636,65.79365079365078 C 957.3863636363636,65.79365079365078 957.9545454545455,65.79365079365078 970.4545454545455,65.79365079365078 C 982.9545454545455,65.79365079365078 983.5227272727273,49.92063492063492 996.0227272727273,49.92063492063492 C 1008.5227272727273,49.92063492063492 1009.0909090909091,49.92063492063492 1021.5909090909091,49.92063492063492 C 1034.090909090909,49.92063492063492 1034.659090909091,41.98412698412699 1047.159090909091,41.98412698412699 C 1059.659090909091,41.98412698412699 1060.2272727272727,41.98412698412699 1072.7272727272727,41.98412698412699 C 1085.2272727272727,41.98412698412699 1085.7954545454545,41.98412698412699 1098.2954545454545,41.98412698412699 C 1110.7954545454545,41.98412698412699 1111.3636363636365,41.98412698412699 1123.8636363636365,41.98412698412699 C 1136.3636363636365,41.98412698412699 1136.9318181818182,41.98412698412699 1149.4318181818182,41.98412698412699 C 1161.9318181818182,41.98412698412699 1162.5,41.98412698412699 1175.0,41.98412698412699" stroke="gray" stroke-width="4" fill="none"></path><circle cx="50.0" cy="15.0" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="75.56818181818181" cy="15.0" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="101.13636363636364" cy="15.0" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="126.70454545454545" cy="15.0" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="152.27272727272728" cy="24.523809523809526" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="177.8409090909091" cy="24.523809523809526" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="203.4090909090909" cy="24.523809523809526" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="228.97727272727272" cy="24.523809523809526" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="254.54545454545456" cy="24.523809523809526" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="280.1136363636364" cy="24.523809523809526" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="305.6818181818182" cy="24.523809523809526" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="331.25" cy="24.523809523809526" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="356.8181818181818" cy="34.04761904761905" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="382.3863636363636" cy="34.04761904761905" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="407.95454545454544" cy="34.04761904761905" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="433.52272727272725" cy="34.04761904761905" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="459.0909090909091" cy="34.04761904761905" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="484.6590909090909" cy="34.04761904761905" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="510.22727272727275" cy="34.04761904761905" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="535.7954545454545" cy="34.04761904761905" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="561.3636363636364" cy="34.04761904761905" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="586.9318181818182" cy="34.04761904761905" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="612.5" cy="41.98412698412699" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="638.0681818181818" cy="49.92063492063492" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="663.6363636363636" cy="57.85714285714286" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="689.2045454545455" cy="65.79365079365078" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="714.7727272727273" cy="72.14285714285714" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="740.3409090909091" cy="72.14285714285714" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="765.9090909090909" cy="78.4920634920635" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="791.4772727272727" cy="72.14285714285714" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="817.0454545454545" cy="78.4920634920635" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="842.6136363636364" cy="78.4920634920635" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="868.1818181818182" cy="78.4920634920635" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="893.75" cy="72.14285714285714" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="919.3181818181818" cy="72.14285714285714" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="944.8863636363636" cy="65.79365079365078" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="970.4545454545455" cy="65.79365079365078" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="996.0227272727273" cy="49.92063492063492" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1021.5909090909091" cy="49.92063492063492" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1047.159090909091" cy="41.98412698412699" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1072.7272727272727" cy="41.98412698412699" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1098.2954545454545" cy="41.98412698412699" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1123.8636363636365" cy="41.98412698412699" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1149.4318181818182" cy="41.98412698412699" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1175.0" cy="41.98412698412699" r="4" stroke="black" stroke-width="4" fill="white"></circle><g class="y-axis-line"><rect x="0" y="0" width="65" height="130" stroke="transparent" stroke-width="0" fill="transparent"></rect><text x="0" y="19.0" fill="transparent" stroke="transparent" font-size="25">100</text><text x="0" y="126.0" fill="transparent" stroke="transparent" font-size="25">37</text></g><g class="vert-line"><rect x="40.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="60.0" y="20" fill="transparent" stroke="transparent" font-size="30px">100</text></g><g class="vert-line"><rect x="65.56818181818181" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="85.56818181818181" y="20" fill="transparent" stroke="transparent" font-size="30px">100</text></g><g class="vert-line"><rect x="91.13636363636364" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="111.13636363636364" y="20" fill="transparent" stroke="transparent" font-size="30px">100</text></g><g class="vert-line"><rect x="116.70454545454545" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="136.70454545454544" y="20" fill="transparent" stroke="transparent" font-size="30px">100</text></g><g class="vert-line"><rect x="142.27272727272728" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="162.27272727272728" y="20" fill="transparent" stroke="transparent" font-size="30px">94</text></g><g class="vert-line"><rect x="167.8409090909091" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="187.8409090909091" y="20" fill="transparent" stroke="transparent" font-size="30px">94</text></g><g class="vert-line"><rect x="193.4090909090909" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="213.4090909090909" y="20" fill="transparent" stroke="transparent" font-size="30px">94</text></g><g class="vert-line"><rect x="218.97727272727272" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="238.97727272727272" y="20" fill="transparent" stroke="transparent" font-size="30px">94</text></g><g class="vert-line"><rect x="244.54545454545456" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="264.54545454545456" y="20" fill="transparent" stroke="transparent" font-size="30px">94</text></g><g class="vert-line"><rect x="270.1136363636364" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="290.1136363636364" y="20" fill="transparent" stroke="transparent" font-size="30px">94</text></g><g class="vert-line"><rect x="295.6818181818182" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="315.6818181818182" y="20" fill="transparent" stroke="transparent" font-size="30px">94</text></g><g class="vert-line"><rect x="321.25" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="341.25" y="20" fill="transparent" stroke="transparent" font-size="30px">94</text></g><g class="vert-line"><rect x="346.8181818181818" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="366.8181818181818" y="20" fill="transparent" stroke="transparent" font-size="30px">88</text></g><g class="vert-line"><rect x="372.3863636363636" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="392.3863636363636" y="20" fill="transparent" stroke="transparent" font-size="30px">88</text></g><g class="vert-line"><rect x="397.95454545454544" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="417.95454545454544" y="20" fill="transparent" stroke="transparent" font-size="30px">88</text></g><g class="vert-line"><rect x="423.52272727272725" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="443.52272727272725" y="20" fill="transparent" stroke="transparent" font-size="30px">88</text></g><g class="vert-line"><rect x="449.0909090909091" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="469.0909090909091" y="20" fill="transparent" stroke="transparent" font-size="30px">88</text></g><g class="vert-line"><rect x="474.6590909090909" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="494.6590909090909" y="20" fill="transparent" stroke="transparent" font-size="30px">88</text></g><g class="vert-line"><rect x="500.22727272727275" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="520.2272727272727" y="20" fill="transparent" stroke="transparent" font-size="30px">88</text></g><g class="vert-line"><rect x="525.7954545454545" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="545.7954545454545" y="20" fill="transparent" stroke="transparent" font-size="30px">88</text></g><g class="vert-line"><rect x="551.3636363636364" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="571.3636363636364" y="20" fill="transparent" stroke="transparent" font-size="30px">88</text></g><g class="vert-line"><rect x="576.9318181818182" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="596.9318181818182" y="20" fill="transparent" stroke="transparent" font-size="30px">88</text></g><g class="vert-line"><rect x="602.5" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="622.5" y="20" fill="transparent" stroke="transparent" font-size="30px">83</text></g><g class="vert-line"><rect x="628.0681818181818" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="648.0681818181818" y="20" fill="transparent" stroke="transparent" font-size="30px">78</text></g><g class="vert-line"><rect x="653.6363636363636" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="673.6363636363636" y="20" fill="transparent" stroke="transparent" font-size="30px">73</text></g><g class="vert-line"><rect x="679.2045454545455" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="699.2045454545455" y="20" fill="transparent" stroke="transparent" font-size="30px">68</text></g><g class="vert-line"><rect x="704.7727272727273" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="724.7727272727273" y="20" fill="transparent" stroke="transparent" font-size="30px">64</text></g><g class="vert-line"><rect x="730.3409090909091" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="750.3409090909091" y="20" fill="transparent" stroke="transparent" font-size="30px">64</text></g><g class="vert-line"><rect x="755.9090909090909" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="775.9090909090909" y="20" fill="transparent" stroke="transparent" font-size="30px">60</text></g><g class="vert-line"><rect x="781.4772727272727" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="801.4772727272727" y="20" fill="transparent" stroke="transparent" font-size="30px">64</text></g><g class="vert-line"><rect x="807.0454545454545" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="827.0454545454545" y="20" fill="transparent" stroke="transparent" font-size="30px">60</text></g><g class="vert-line"><rect x="832.6136363636364" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="852.6136363636364" y="20" fill="transparent" stroke="transparent" font-size="30px">60</text></g><g class="vert-line"><rect x="858.1818181818182" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="878.1818181818182" y="20" fill="transparent" stroke="transparent" font-size="30px">60</text></g><g class="vert-line"><rect x="883.75" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="903.75" y="20" fill="transparent" stroke="transparent" font-size="30px">64</text></g><g class="vert-line"><rect x="909.3181818181818" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="929.3181818181818" y="20" fill="transparent" stroke="transparent" font-size="30px">64</text></g><g class="vert-line"><rect x="934.8863636363636" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="954.8863636363636" y="20" fill="transparent" stroke="transparent" font-size="30px">68</text></g><g class="vert-line"><rect x="960.4545454545455" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="980.4545454545455" y="20" fill="transparent" stroke="transparent" font-size="30px">68</text></g><g class="vert-line"><rect x="986.0227272727273" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1006.0227272727273" y="20" fill="transparent" stroke="transparent" font-size="30px">78</text></g><g class="vert-line"><rect x="1011.5909090909091" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1031.590909090909" y="20" fill="transparent" stroke="transparent" font-size="30px">78</text></g><g class="vert-line"><rect x="1037.159090909091" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1057.159090909091" y="20" fill="transparent" stroke="transparent" font-size="30px">83</text></g><g class="vert-line"><rect x="1062.7272727272727" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1082.7272727272727" y="20" fill="transparent" stroke="transparent" font-size="30px">83</text></g><g class="vert-line"><rect x="1088.2954545454545" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1108.2954545454545" y="20" fill="transparent" stroke="transparent" font-size="30px">83</text></g><g class="vert-line"><rect x="1113.8636363636365" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1133.8636363636365" y="20" fill="transparent" stroke="transparent" font-size="30px">83</text></g><g class="vert-line"><rect x="1139.4318181818182" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1159.4318181818182" y="20" fill="transparent" stroke="transparent" font-size="30px">83</text></g><g class="vert-line"><rect x="1165.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1185.0" y="20" fill="transparent" stroke="transparent" font-size="30px">83</text></g></svg></div></td>
  </tr>
  <tr>
    <td class="gt_row gt_left">Wed, May 3, 2023</td>
    <td class="gt_row gt_left"><div><svg viewbox="0 0 1225 130" style="height: 2em; margin-left: auto; margin-right: auto; font-size: inherit; overflow: visible; vertical-align: middle; position:relative;"><defs><pattern id="area_pattern" width="8" height="8" patternunits="userSpaceOnUse"><path class="pattern-line" d="M 0,8 l 8,-8 M -1,1 l 4,-4 M 6,10 l 4,-4" stroke="#FF0000" stroke-width="1.5" stroke-linecap="round" shape-rendering="geometricPrecision"></path></pattern></defs><style> text { font-family: ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace; stroke-width: 0.15em; paint-order: stroke; stroke-linejoin: round; cursor: default; } .vert-line:hover rect { fill: #911EB4; fill-opacity: 40%; stroke: #FFFFFF60; color: red; } .vert-line:hover text { stroke: white; fill: #212427; } .horizontal-line:hover text {stroke: white; fill: #212427; } .ref-line:hover rect { stroke: #FFFFFF60; } .ref-line:hover line { stroke: #FF0000; } .ref-line:hover text { stroke: white; fill: #212427; } .y-axis-line:hover rect { fill: #EDEDED; fill-opacity: 60%; stroke: #FFFFFF60; color: red; } .y-axis-line:hover text { stroke: white; stroke-width: 0.20em; fill: #1A1C1F; } </style><path d="M 50.0,94.85611510791368 C 62.5,94.85611510791368 63.06818181818181,94.85611510791368 75.56818181818181,94.85611510791368 C 88.06818181818181,94.85611510791368 88.63636363636364,94.85611510791368 101.13636363636364,94.85611510791368 C 113.63636363636364,94.85611510791368 114.20454545454545,86.94244604316548 126.70454545454545,86.94244604316548 C 139.20454545454544,86.94244604316548 139.77272727272728,94.85611510791368 152.27272727272728,94.85611510791368 C 164.77272727272728,94.85611510791368 165.3409090909091,94.85611510791368 177.8409090909091,94.85611510791368 C 190.3409090909091,94.85611510791368 190.9090909090909,94.85611510791368 203.4090909090909,94.85611510791368 C 215.9090909090909,94.85611510791368 216.47727272727272,86.94244604316548 228.97727272727272,86.94244604316548 C 241.47727272727272,86.94244604316548 242.04545454545456,86.94244604316548 254.54545454545456,86.94244604316548 C 267.04545454545456,86.94244604316548 267.6136363636364,94.85611510791368 280.1136363636364,94.85611510791368 C 292.6136363636364,94.85611510791368 293.1818181818182,94.85611510791368 305.6818181818182,94.85611510791368 C 318.1818181818182,94.85611510791368 318.75,94.85611510791368 331.25,94.85611510791368 C 343.75,94.85611510791368 344.3181818181818,94.85611510791368 356.8181818181818,94.85611510791368 C 369.3181818181818,94.85611510791368 369.8863636363636,94.85611510791368 382.3863636363636,94.85611510791368 C 394.8863636363636,94.85611510791368 395.45454545454544,86.94244604316548 407.95454545454544,86.94244604316548 C 420.45454545454544,86.94244604316548 421.02272727272725,86.94244604316548 433.52272727272725,86.94244604316548 C 446.02272727272725,86.94244604316548 446.5909090909091,86.94244604316548 459.0909090909091,86.94244604316548 C 471.5909090909091,86.94244604316548 472.1590909090909,86.94244604316548 484.6590909090909,86.94244604316548 C 497.1590909090909,86.94244604316548 497.72727272727275,79.02877697841727 510.22727272727275,79.02877697841727 C 522.7272727272727,79.02877697841727 523.2954545454545,79.02877697841727 535.7954545454545,79.02877697841727 C 548.2954545454545,79.02877697841727 548.8636363636364,86.94244604316548 561.3636363636364,86.94244604316548 C 573.8636363636364,86.94244604316548 574.4318181818182,86.94244604316548 586.9318181818182,86.94244604316548 C 599.4318181818182,86.94244604316548 600.0,79.02877697841727 612.5,79.02877697841727 C 625.0,79.02877697841727 625.5681818181818,79.02877697841727 638.0681818181818,79.02877697841727 C 650.5681818181818,79.02877697841727 651.1363636363636,79.02877697841727 663.6363636363636,79.02877697841727 C 676.1363636363636,79.02877697841727 676.7045454545455,79.02877697841727 689.2045454545455,79.02877697841727 C 701.7045454545455,79.02877697841727 702.2727272727273,71.11510791366908 714.7727272727273,71.11510791366908 C 727.2727272727273,71.11510791366908 727.8409090909091,79.02877697841727 740.3409090909091,79.02877697841727 C 752.8409090909091,79.02877697841727 753.4090909090909,79.02877697841727 765.9090909090909,79.02877697841727 C 778.4090909090909,79.02877697841727 778.9772727272727,79.02877697841727 791.4772727272727,79.02877697841727 C 803.9772727272727,79.02877697841727 804.5454545454545,79.02877697841727 817.0454545454545,79.02877697841727 C 829.5454545454545,79.02877697841727 830.1136363636364,79.02877697841727 842.6136363636364,79.02877697841727 C 855.1136363636364,79.02877697841727 855.6818181818182,79.02877697841727 868.1818181818182,79.02877697841727 C 880.6818181818182,79.02877697841727 881.25,79.02877697841727 893.75,79.02877697841727 C 906.25,79.02877697841727 906.8181818181818,79.02877697841727 919.3181818181818,79.02877697841727 C 931.8181818181818,79.02877697841727 932.3863636363636,86.94244604316548 944.8863636363636,86.94244604316548 C 957.3863636363636,86.94244604316548 957.9545454545455,86.94244604316548 970.4545454545455,86.94244604316548 C 982.9545454545455,86.94244604316548 983.5227272727273,86.94244604316548 996.0227272727273,86.94244604316548 C 1008.5227272727273,86.94244604316548 1009.0909090909091,86.94244604316548 1021.5909090909091,86.94244604316548 C 1034.090909090909,86.94244604316548 1034.659090909091,86.94244604316548 1047.159090909091,86.94244604316548 C 1059.659090909091,86.94244604316548 1060.2272727272727,86.94244604316548 1072.7272727272727,86.94244604316548 C 1085.2272727272727,86.94244604316548 1085.7954545454545,94.85611510791368 1098.2954545454545,94.85611510791368 C 1110.7954545454545,94.85611510791368 1111.3636363636365,94.85611510791368 1123.8636363636365,94.85611510791368 C 1136.3636363636365,94.85611510791368 1136.9318181818182,94.85611510791368 1149.4318181818182,94.85611510791368 C 1161.9318181818182,94.85611510791368 1162.5,94.85611510791368 1175.0,94.85611510791368" stroke="gray" stroke-width="4" fill="none"></path><circle cx="50.0" cy="94.85611510791368" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="75.56818181818181" cy="94.85611510791368" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="101.13636363636364" cy="94.85611510791368" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="126.70454545454545" cy="86.94244604316548" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="152.27272727272728" cy="94.85611510791368" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="177.8409090909091" cy="94.85611510791368" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="203.4090909090909" cy="94.85611510791368" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="228.97727272727272" cy="86.94244604316548" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="254.54545454545456" cy="86.94244604316548" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="280.1136363636364" cy="94.85611510791368" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="305.6818181818182" cy="94.85611510791368" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="331.25" cy="94.85611510791368" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="356.8181818181818" cy="94.85611510791368" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="382.3863636363636" cy="94.85611510791368" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="407.95454545454544" cy="86.94244604316548" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="433.52272727272725" cy="86.94244604316548" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="459.0909090909091" cy="86.94244604316548" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="484.6590909090909" cy="86.94244604316548" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="510.22727272727275" cy="79.02877697841727" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="535.7954545454545" cy="79.02877697841727" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="561.3636363636364" cy="86.94244604316548" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="586.9318181818182" cy="86.94244604316548" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="612.5" cy="79.02877697841727" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="638.0681818181818" cy="79.02877697841727" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="663.6363636363636" cy="79.02877697841727" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="689.2045454545455" cy="79.02877697841727" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="714.7727272727273" cy="71.11510791366908" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="740.3409090909091" cy="79.02877697841727" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="765.9090909090909" cy="79.02877697841727" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="791.4772727272727" cy="79.02877697841727" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="817.0454545454545" cy="79.02877697841727" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="842.6136363636364" cy="79.02877697841727" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="868.1818181818182" cy="79.02877697841727" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="893.75" cy="79.02877697841727" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="919.3181818181818" cy="79.02877697841727" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="944.8863636363636" cy="86.94244604316548" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="970.4545454545455" cy="86.94244604316548" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="996.0227272727273" cy="86.94244604316548" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1021.5909090909091" cy="86.94244604316548" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1047.159090909091" cy="86.94244604316548" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1072.7272727272727" cy="86.94244604316548" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1098.2954545454545" cy="94.85611510791368" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1123.8636363636365" cy="94.85611510791368" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1149.4318181818182" cy="94.85611510791368" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1175.0" cy="94.85611510791368" r="4" stroke="black" stroke-width="4" fill="white"></circle><g class="y-axis-line"><rect x="0" y="0" width="65" height="130" stroke="transparent" stroke-width="0" fill="transparent"></rect><text x="0" y="19.0" fill="transparent" stroke="transparent" font-size="25">30.0</text><text x="0" y="126.0" fill="transparent" stroke="transparent" font-size="25">16.1</text></g><g class="vert-line"><rect x="40.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="60.0" y="20" fill="transparent" stroke="transparent" font-size="30px">18.9</text></g><g class="vert-line"><rect x="65.56818181818181" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="85.56818181818181" y="20" fill="transparent" stroke="transparent" font-size="30px">18.9</text></g><g class="vert-line"><rect x="91.13636363636364" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="111.13636363636364" y="20" fill="transparent" stroke="transparent" font-size="30px">18.9</text></g><g class="vert-line"><rect x="116.70454545454545" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="136.70454545454544" y="20" fill="transparent" stroke="transparent" font-size="30px">20.0</text></g><g class="vert-line"><rect x="142.27272727272728" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="162.27272727272728" y="20" fill="transparent" stroke="transparent" font-size="30px">18.9</text></g><g class="vert-line"><rect x="167.8409090909091" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="187.8409090909091" y="20" fill="transparent" stroke="transparent" font-size="30px">18.9</text></g><g class="vert-line"><rect x="193.4090909090909" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="213.4090909090909" y="20" fill="transparent" stroke="transparent" font-size="30px">18.9</text></g><g class="vert-line"><rect x="218.97727272727272" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="238.97727272727272" y="20" fill="transparent" stroke="transparent" font-size="30px">20.0</text></g><g class="vert-line"><rect x="244.54545454545456" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="264.54545454545456" y="20" fill="transparent" stroke="transparent" font-size="30px">20.0</text></g><g class="vert-line"><rect x="270.1136363636364" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="290.1136363636364" y="20" fill="transparent" stroke="transparent" font-size="30px">18.9</text></g><g class="vert-line"><rect x="295.6818181818182" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="315.6818181818182" y="20" fill="transparent" stroke="transparent" font-size="30px">18.9</text></g><g class="vert-line"><rect x="321.25" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="341.25" y="20" fill="transparent" stroke="transparent" font-size="30px">18.9</text></g><g class="vert-line"><rect x="346.8181818181818" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="366.8181818181818" y="20" fill="transparent" stroke="transparent" font-size="30px">18.9</text></g><g class="vert-line"><rect x="372.3863636363636" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="392.3863636363636" y="20" fill="transparent" stroke="transparent" font-size="30px">18.9</text></g><g class="vert-line"><rect x="397.95454545454544" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="417.95454545454544" y="20" fill="transparent" stroke="transparent" font-size="30px">20.0</text></g><g class="vert-line"><rect x="423.52272727272725" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="443.52272727272725" y="20" fill="transparent" stroke="transparent" font-size="30px">20.0</text></g><g class="vert-line"><rect x="449.0909090909091" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="469.0909090909091" y="20" fill="transparent" stroke="transparent" font-size="30px">20.0</text></g><g class="vert-line"><rect x="474.6590909090909" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="494.6590909090909" y="20" fill="transparent" stroke="transparent" font-size="30px">20.0</text></g><g class="vert-line"><rect x="500.22727272727275" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="520.2272727272727" y="20" fill="transparent" stroke="transparent" font-size="30px">21.1</text></g><g class="vert-line"><rect x="525.7954545454545" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="545.7954545454545" y="20" fill="transparent" stroke="transparent" font-size="30px">21.1</text></g><g class="vert-line"><rect x="551.3636363636364" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="571.3636363636364" y="20" fill="transparent" stroke="transparent" font-size="30px">20.0</text></g><g class="vert-line"><rect x="576.9318181818182" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="596.9318181818182" y="20" fill="transparent" stroke="transparent" font-size="30px">20.0</text></g><g class="vert-line"><rect x="602.5" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="622.5" y="20" fill="transparent" stroke="transparent" font-size="30px">21.1</text></g><g class="vert-line"><rect x="628.0681818181818" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="648.0681818181818" y="20" fill="transparent" stroke="transparent" font-size="30px">21.1</text></g><g class="vert-line"><rect x="653.6363636363636" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="673.6363636363636" y="20" fill="transparent" stroke="transparent" font-size="30px">21.1</text></g><g class="vert-line"><rect x="679.2045454545455" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="699.2045454545455" y="20" fill="transparent" stroke="transparent" font-size="30px">21.1</text></g><g class="vert-line"><rect x="704.7727272727273" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="724.7727272727273" y="20" fill="transparent" stroke="transparent" font-size="30px">22.2</text></g><g class="vert-line"><rect x="730.3409090909091" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="750.3409090909091" y="20" fill="transparent" stroke="transparent" font-size="30px">21.1</text></g><g class="vert-line"><rect x="755.9090909090909" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="775.9090909090909" y="20" fill="transparent" stroke="transparent" font-size="30px">21.1</text></g><g class="vert-line"><rect x="781.4772727272727" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="801.4772727272727" y="20" fill="transparent" stroke="transparent" font-size="30px">21.1</text></g><g class="vert-line"><rect x="807.0454545454545" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="827.0454545454545" y="20" fill="transparent" stroke="transparent" font-size="30px">21.1</text></g><g class="vert-line"><rect x="832.6136363636364" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="852.6136363636364" y="20" fill="transparent" stroke="transparent" font-size="30px">21.1</text></g><g class="vert-line"><rect x="858.1818181818182" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="878.1818181818182" y="20" fill="transparent" stroke="transparent" font-size="30px">21.1</text></g><g class="vert-line"><rect x="883.75" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="903.75" y="20" fill="transparent" stroke="transparent" font-size="30px">21.1</text></g><g class="vert-line"><rect x="909.3181818181818" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="929.3181818181818" y="20" fill="transparent" stroke="transparent" font-size="30px">21.1</text></g><g class="vert-line"><rect x="934.8863636363636" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="954.8863636363636" y="20" fill="transparent" stroke="transparent" font-size="30px">20.0</text></g><g class="vert-line"><rect x="960.4545454545455" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="980.4545454545455" y="20" fill="transparent" stroke="transparent" font-size="30px">20.0</text></g><g class="vert-line"><rect x="986.0227272727273" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1006.0227272727273" y="20" fill="transparent" stroke="transparent" font-size="30px">20.0</text></g><g class="vert-line"><rect x="1011.5909090909091" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1031.590909090909" y="20" fill="transparent" stroke="transparent" font-size="30px">20.0</text></g><g class="vert-line"><rect x="1037.159090909091" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1057.159090909091" y="20" fill="transparent" stroke="transparent" font-size="30px">20.0</text></g><g class="vert-line"><rect x="1062.7272727272727" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1082.7272727272727" y="20" fill="transparent" stroke="transparent" font-size="30px">20.0</text></g><g class="vert-line"><rect x="1088.2954545454545" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1108.2954545454545" y="20" fill="transparent" stroke="transparent" font-size="30px">18.9</text></g><g class="vert-line"><rect x="1113.8636363636365" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1133.8636363636365" y="20" fill="transparent" stroke="transparent" font-size="30px">18.9</text></g><g class="vert-line"><rect x="1139.4318181818182" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1159.4318181818182" y="20" fill="transparent" stroke="transparent" font-size="30px">18.9</text></g><g class="vert-line"><rect x="1165.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1185.0" y="20" fill="transparent" stroke="transparent" font-size="30px">18.9</text></g></svg></div></td>
    <td class="gt_row gt_left"><div><svg viewbox="0 0 1225 130" style="height: 2em; margin-left: auto; margin-right: auto; font-size: inherit; overflow: visible; vertical-align: middle; position:relative;"><defs><pattern id="area_pattern" width="8" height="8" patternunits="userSpaceOnUse"><path class="pattern-line" d="M 0,8 l 8,-8 M -1,1 l 4,-4 M 6,10 l 4,-4" stroke="#FF0000" stroke-width="1.5" stroke-linecap="round" shape-rendering="geometricPrecision"></path></pattern></defs><style> text { font-family: ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace; stroke-width: 0.15em; paint-order: stroke; stroke-linejoin: round; cursor: default; } .vert-line:hover rect { fill: #911EB4; fill-opacity: 40%; stroke: #FFFFFF60; color: red; } .vert-line:hover text { stroke: white; fill: #212427; } .horizontal-line:hover text {stroke: white; fill: #212427; } .ref-line:hover rect { stroke: #FFFFFF60; } .ref-line:hover line { stroke: #FF0000; } .ref-line:hover text { stroke: white; fill: #212427; } .y-axis-line:hover rect { fill: #EDEDED; fill-opacity: 60%; stroke: #FFFFFF60; color: red; } .y-axis-line:hover text { stroke: white; stroke-width: 0.20em; fill: #1A1C1F; } </style><path d="M 50.0,41.98412698412699 C 62.5,41.98412698412699 63.06818181818181,41.98412698412699 75.56818181818181,41.98412698412699 C 88.06818181818181,41.98412698412699 88.63636363636364,41.98412698412699 101.13636363636364,41.98412698412699 C 113.63636363636364,41.98412698412699 114.20454545454545,57.85714285714286 126.70454545454545,57.85714285714286 C 139.20454545454544,57.85714285714286 139.77272727272728,49.92063492063492 152.27272727272728,49.92063492063492 C 164.77272727272728,49.92063492063492 165.3409090909091,49.92063492063492 177.8409090909091,49.92063492063492 C 190.3409090909091,49.92063492063492 190.9090909090909,41.98412698412699 203.4090909090909,41.98412698412699 C 215.9090909090909,41.98412698412699 216.47727272727272,57.85714285714286 228.97727272727272,57.85714285714286 C 241.47727272727272,57.85714285714286 242.04545454545456,57.85714285714286 254.54545454545456,57.85714285714286 C 267.04545454545456,57.85714285714286 267.6136363636364,49.92063492063492 280.1136363636364,49.92063492063492 C 292.6136363636364,49.92063492063492 293.1818181818182,49.92063492063492 305.6818181818182,49.92063492063492 C 318.1818181818182,49.92063492063492 318.75,49.92063492063492 331.25,49.92063492063492 C 343.75,49.92063492063492 344.3181818181818,57.85714285714286 356.8181818181818,57.85714285714286 C 369.3181818181818,57.85714285714286 369.8863636363636,57.85714285714286 382.3863636363636,57.85714285714286 C 394.8863636363636,57.85714285714286 395.45454545454544,65.79365079365078 407.95454545454544,65.79365079365078 C 420.45454545454544,65.79365079365078 421.02272727272725,65.79365079365078 433.52272727272725,65.79365079365078 C 446.02272727272725,65.79365079365078 446.5909090909091,57.85714285714286 459.0909090909091,57.85714285714286 C 471.5909090909091,57.85714285714286 472.1590909090909,57.85714285714286 484.6590909090909,57.85714285714286 C 497.1590909090909,57.85714285714286 497.72727272727275,65.79365079365078 510.22727272727275,65.79365079365078 C 522.7272727272727,65.79365079365078 523.2954545454545,65.79365079365078 535.7954545454545,65.79365079365078 C 548.2954545454545,65.79365079365078 548.8636363636364,57.85714285714286 561.3636363636364,57.85714285714286 C 573.8636363636364,57.85714285714286 574.4318181818182,57.85714285714286 586.9318181818182,57.85714285714286 C 599.4318181818182,57.85714285714286 600.0,65.79365079365078 612.5,65.79365079365078 C 625.0,65.79365079365078 625.5681818181818,65.79365079365078 638.0681818181818,65.79365079365078 C 650.5681818181818,65.79365079365078 651.1363636363636,72.14285714285714 663.6363636363636,72.14285714285714 C 676.1363636363636,72.14285714285714 676.7045454545455,65.79365079365078 689.2045454545455,65.79365079365078 C 701.7045454545455,65.79365079365078 702.2727272727273,72.14285714285714 714.7727272727273,72.14285714285714 C 727.2727272727273,72.14285714285714 727.8409090909091,65.79365079365078 740.3409090909091,65.79365079365078 C 752.8409090909091,65.79365079365078 753.4090909090909,65.79365079365078 765.9090909090909,65.79365079365078 C 778.4090909090909,65.79365079365078 778.9772727272727,65.79365079365078 791.4772727272727,65.79365079365078 C 803.9772727272727,65.79365079365078 804.5454545454545,65.79365079365078 817.0454545454545,65.79365079365078 C 829.5454545454545,65.79365079365078 830.1136363636364,65.79365079365078 842.6136363636364,65.79365079365078 C 855.1136363636364,65.79365079365078 855.6818181818182,65.79365079365078 868.1818181818182,65.79365079365078 C 880.6818181818182,65.79365079365078 881.25,65.79365079365078 893.75,65.79365079365078 C 906.25,65.79365079365078 906.8181818181818,57.85714285714286 919.3181818181818,57.85714285714286 C 931.8181818181818,57.85714285714286 932.3863636363636,49.92063492063492 944.8863636363636,49.92063492063492 C 957.3863636363636,49.92063492063492 957.9545454545455,49.92063492063492 970.4545454545455,49.92063492063492 C 982.9545454545455,49.92063492063492 983.5227272727273,57.85714285714286 996.0227272727273,57.85714285714286 C 1008.5227272727273,57.85714285714286 1009.0909090909091,49.92063492063492 1021.5909090909091,49.92063492063492 C 1034.090909090909,49.92063492063492 1034.659090909091,49.92063492063492 1047.159090909091,49.92063492063492 C 1059.659090909091,49.92063492063492 1060.2272727272727,49.92063492063492 1072.7272727272727,49.92063492063492 C 1085.2272727272727,49.92063492063492 1085.7954545454545,41.98412698412699 1098.2954545454545,41.98412698412699 C 1110.7954545454545,41.98412698412699 1111.3636363636365,41.98412698412699 1123.8636363636365,41.98412698412699 C 1136.3636363636365,41.98412698412699 1136.9318181818182,41.98412698412699 1149.4318181818182,41.98412698412699 C 1161.9318181818182,41.98412698412699 1162.5,41.98412698412699 1175.0,41.98412698412699" stroke="gray" stroke-width="4" fill="none"></path><circle cx="50.0" cy="41.98412698412699" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="75.56818181818181" cy="41.98412698412699" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="101.13636363636364" cy="41.98412698412699" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="126.70454545454545" cy="57.85714285714286" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="152.27272727272728" cy="49.92063492063492" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="177.8409090909091" cy="49.92063492063492" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="203.4090909090909" cy="41.98412698412699" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="228.97727272727272" cy="57.85714285714286" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="254.54545454545456" cy="57.85714285714286" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="280.1136363636364" cy="49.92063492063492" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="305.6818181818182" cy="49.92063492063492" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="331.25" cy="49.92063492063492" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="356.8181818181818" cy="57.85714285714286" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="382.3863636363636" cy="57.85714285714286" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="407.95454545454544" cy="65.79365079365078" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="433.52272727272725" cy="65.79365079365078" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="459.0909090909091" cy="57.85714285714286" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="484.6590909090909" cy="57.85714285714286" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="510.22727272727275" cy="65.79365079365078" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="535.7954545454545" cy="65.79365079365078" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="561.3636363636364" cy="57.85714285714286" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="586.9318181818182" cy="57.85714285714286" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="612.5" cy="65.79365079365078" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="638.0681818181818" cy="65.79365079365078" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="663.6363636363636" cy="72.14285714285714" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="689.2045454545455" cy="65.79365079365078" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="714.7727272727273" cy="72.14285714285714" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="740.3409090909091" cy="65.79365079365078" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="765.9090909090909" cy="65.79365079365078" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="791.4772727272727" cy="65.79365079365078" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="817.0454545454545" cy="65.79365079365078" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="842.6136363636364" cy="65.79365079365078" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="868.1818181818182" cy="65.79365079365078" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="893.75" cy="65.79365079365078" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="919.3181818181818" cy="57.85714285714286" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="944.8863636363636" cy="49.92063492063492" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="970.4545454545455" cy="49.92063492063492" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="996.0227272727273" cy="57.85714285714286" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1021.5909090909091" cy="49.92063492063492" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1047.159090909091" cy="49.92063492063492" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1072.7272727272727" cy="49.92063492063492" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1098.2954545454545" cy="41.98412698412699" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1123.8636363636365" cy="41.98412698412699" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1149.4318181818182" cy="41.98412698412699" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1175.0" cy="41.98412698412699" r="4" stroke="black" stroke-width="4" fill="white"></circle><g class="y-axis-line"><rect x="0" y="0" width="65" height="130" stroke="transparent" stroke-width="0" fill="transparent"></rect><text x="0" y="19.0" fill="transparent" stroke="transparent" font-size="25">100</text><text x="0" y="126.0" fill="transparent" stroke="transparent" font-size="25">37</text></g><g class="vert-line"><rect x="40.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="60.0" y="20" fill="transparent" stroke="transparent" font-size="30px">83</text></g><g class="vert-line"><rect x="65.56818181818181" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="85.56818181818181" y="20" fill="transparent" stroke="transparent" font-size="30px">83</text></g><g class="vert-line"><rect x="91.13636363636364" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="111.13636363636364" y="20" fill="transparent" stroke="transparent" font-size="30px">83</text></g><g class="vert-line"><rect x="116.70454545454545" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="136.70454545454544" y="20" fill="transparent" stroke="transparent" font-size="30px">73</text></g><g class="vert-line"><rect x="142.27272727272728" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="162.27272727272728" y="20" fill="transparent" stroke="transparent" font-size="30px">78</text></g><g class="vert-line"><rect x="167.8409090909091" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="187.8409090909091" y="20" fill="transparent" stroke="transparent" font-size="30px">78</text></g><g class="vert-line"><rect x="193.4090909090909" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="213.4090909090909" y="20" fill="transparent" stroke="transparent" font-size="30px">83</text></g><g class="vert-line"><rect x="218.97727272727272" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="238.97727272727272" y="20" fill="transparent" stroke="transparent" font-size="30px">73</text></g><g class="vert-line"><rect x="244.54545454545456" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="264.54545454545456" y="20" fill="transparent" stroke="transparent" font-size="30px">73</text></g><g class="vert-line"><rect x="270.1136363636364" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="290.1136363636364" y="20" fill="transparent" stroke="transparent" font-size="30px">78</text></g><g class="vert-line"><rect x="295.6818181818182" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="315.6818181818182" y="20" fill="transparent" stroke="transparent" font-size="30px">78</text></g><g class="vert-line"><rect x="321.25" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="341.25" y="20" fill="transparent" stroke="transparent" font-size="30px">78</text></g><g class="vert-line"><rect x="346.8181818181818" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="366.8181818181818" y="20" fill="transparent" stroke="transparent" font-size="30px">73</text></g><g class="vert-line"><rect x="372.3863636363636" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="392.3863636363636" y="20" fill="transparent" stroke="transparent" font-size="30px">73</text></g><g class="vert-line"><rect x="397.95454545454544" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="417.95454545454544" y="20" fill="transparent" stroke="transparent" font-size="30px">68</text></g><g class="vert-line"><rect x="423.52272727272725" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="443.52272727272725" y="20" fill="transparent" stroke="transparent" font-size="30px">68</text></g><g class="vert-line"><rect x="449.0909090909091" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="469.0909090909091" y="20" fill="transparent" stroke="transparent" font-size="30px">73</text></g><g class="vert-line"><rect x="474.6590909090909" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="494.6590909090909" y="20" fill="transparent" stroke="transparent" font-size="30px">73</text></g><g class="vert-line"><rect x="500.22727272727275" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="520.2272727272727" y="20" fill="transparent" stroke="transparent" font-size="30px">68</text></g><g class="vert-line"><rect x="525.7954545454545" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="545.7954545454545" y="20" fill="transparent" stroke="transparent" font-size="30px">68</text></g><g class="vert-line"><rect x="551.3636363636364" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="571.3636363636364" y="20" fill="transparent" stroke="transparent" font-size="30px">73</text></g><g class="vert-line"><rect x="576.9318181818182" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="596.9318181818182" y="20" fill="transparent" stroke="transparent" font-size="30px">73</text></g><g class="vert-line"><rect x="602.5" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="622.5" y="20" fill="transparent" stroke="transparent" font-size="30px">68</text></g><g class="vert-line"><rect x="628.0681818181818" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="648.0681818181818" y="20" fill="transparent" stroke="transparent" font-size="30px">68</text></g><g class="vert-line"><rect x="653.6363636363636" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="673.6363636363636" y="20" fill="transparent" stroke="transparent" font-size="30px">64</text></g><g class="vert-line"><rect x="679.2045454545455" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="699.2045454545455" y="20" fill="transparent" stroke="transparent" font-size="30px">68</text></g><g class="vert-line"><rect x="704.7727272727273" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="724.7727272727273" y="20" fill="transparent" stroke="transparent" font-size="30px">64</text></g><g class="vert-line"><rect x="730.3409090909091" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="750.3409090909091" y="20" fill="transparent" stroke="transparent" font-size="30px">68</text></g><g class="vert-line"><rect x="755.9090909090909" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="775.9090909090909" y="20" fill="transparent" stroke="transparent" font-size="30px">68</text></g><g class="vert-line"><rect x="781.4772727272727" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="801.4772727272727" y="20" fill="transparent" stroke="transparent" font-size="30px">68</text></g><g class="vert-line"><rect x="807.0454545454545" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="827.0454545454545" y="20" fill="transparent" stroke="transparent" font-size="30px">68</text></g><g class="vert-line"><rect x="832.6136363636364" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="852.6136363636364" y="20" fill="transparent" stroke="transparent" font-size="30px">68</text></g><g class="vert-line"><rect x="858.1818181818182" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="878.1818181818182" y="20" fill="transparent" stroke="transparent" font-size="30px">68</text></g><g class="vert-line"><rect x="883.75" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="903.75" y="20" fill="transparent" stroke="transparent" font-size="30px">68</text></g><g class="vert-line"><rect x="909.3181818181818" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="929.3181818181818" y="20" fill="transparent" stroke="transparent" font-size="30px">73</text></g><g class="vert-line"><rect x="934.8863636363636" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="954.8863636363636" y="20" fill="transparent" stroke="transparent" font-size="30px">78</text></g><g class="vert-line"><rect x="960.4545454545455" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="980.4545454545455" y="20" fill="transparent" stroke="transparent" font-size="30px">78</text></g><g class="vert-line"><rect x="986.0227272727273" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1006.0227272727273" y="20" fill="transparent" stroke="transparent" font-size="30px">73</text></g><g class="vert-line"><rect x="1011.5909090909091" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1031.590909090909" y="20" fill="transparent" stroke="transparent" font-size="30px">78</text></g><g class="vert-line"><rect x="1037.159090909091" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1057.159090909091" y="20" fill="transparent" stroke="transparent" font-size="30px">78</text></g><g class="vert-line"><rect x="1062.7272727272727" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1082.7272727272727" y="20" fill="transparent" stroke="transparent" font-size="30px">78</text></g><g class="vert-line"><rect x="1088.2954545454545" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1108.2954545454545" y="20" fill="transparent" stroke="transparent" font-size="30px">83</text></g><g class="vert-line"><rect x="1113.8636363636365" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1133.8636363636365" y="20" fill="transparent" stroke="transparent" font-size="30px">83</text></g><g class="vert-line"><rect x="1139.4318181818182" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1159.4318181818182" y="20" fill="transparent" stroke="transparent" font-size="30px">83</text></g><g class="vert-line"><rect x="1165.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1185.0" y="20" fill="transparent" stroke="transparent" font-size="30px">83</text></g></svg></div></td>
  </tr>
  <tr>
    <td class="gt_row gt_left">Thu, May 4, 2023</td>
    <td class="gt_row gt_left"><div><svg viewbox="0 0 1300 130" style="height: 2em; margin-left: auto; margin-right: auto; font-size: inherit; overflow: visible; vertical-align: middle; position:relative;"><defs><pattern id="area_pattern" width="8" height="8" patternunits="userSpaceOnUse"><path class="pattern-line" d="M 0,8 l 8,-8 M -1,1 l 4,-4 M 6,10 l 4,-4" stroke="#FF0000" stroke-width="1.5" stroke-linecap="round" shape-rendering="geometricPrecision"></path></pattern></defs><style> text { font-family: ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace; stroke-width: 0.15em; paint-order: stroke; stroke-linejoin: round; cursor: default; } .vert-line:hover rect { fill: #911EB4; fill-opacity: 40%; stroke: #FFFFFF60; color: red; } .vert-line:hover text { stroke: white; fill: #212427; } .horizontal-line:hover text {stroke: white; fill: #212427; } .ref-line:hover rect { stroke: #FFFFFF60; } .ref-line:hover line { stroke: #FF0000; } .ref-line:hover text { stroke: white; fill: #212427; } .y-axis-line:hover rect { fill: #EDEDED; fill-opacity: 60%; stroke: #FFFFFF60; color: red; } .y-axis-line:hover text { stroke: white; stroke-width: 0.20em; fill: #1A1C1F; } </style><path d="M 50.0,94.85611510791368 C 62.5,94.85611510791368 63.03191489361703,102.76978417266189 75.53191489361703,102.76978417266189 C 88.03191489361703,102.76978417266189 88.56382978723404,107.08633093525181 101.06382978723404,107.08633093525181 C 113.56382978723404,107.08633093525181 114.09574468085106,107.08633093525181 126.59574468085106,107.08633093525181 C 139.09574468085106,107.08633093525181 139.62765957446808,107.08633093525181 152.12765957446808,107.08633093525181 C 164.62765957446808,107.08633093525181 165.1595744680851,107.08633093525181 177.6595744680851,107.08633093525181 C 190.1595744680851,107.08633093525181 190.6914893617021,107.08633093525181 203.1914893617021,107.08633093525181 C 215.6914893617021,107.08633093525181 216.22340425531914,107.08633093525181 228.72340425531914,107.08633093525181 C 241.22340425531914,107.08633093525181 241.75531914893617,107.08633093525181 254.25531914893617,107.08633093525181 C 266.75531914893617,107.08633093525181 267.2872340425532,107.08633093525181 279.7872340425532,107.08633093525181 C 292.2872340425532,107.08633093525181 292.8191489361702,115.0 305.3191489361702,115.0 C 317.8191489361702,115.0 318.3510638297872,107.08633093525181 330.8510638297872,107.08633093525181 C 343.3510638297872,107.08633093525181 343.8829787234042,102.76978417266189 356.3829787234042,102.76978417266189 C 368.8829787234042,102.76978417266189 369.4148936170213,102.76978417266189 381.9148936170213,102.76978417266189 C 394.4148936170213,102.76978417266189 394.9468085106383,102.76978417266189 407.4468085106383,102.76978417266189 C 419.9468085106383,102.76978417266189 420.47872340425533,102.76978417266189 432.97872340425533,102.76978417266189 C 445.47872340425533,102.76978417266189 446.01063829787233,102.76978417266189 458.51063829787233,102.76978417266189 C 471.01063829787233,102.76978417266189 471.5425531914894,107.08633093525181 484.0425531914894,107.08633093525181 C 496.5425531914894,107.08633093525181 497.0744680851064,94.85611510791368 509.5744680851064,94.85611510791368 C 522.0744680851064,94.85611510791368 522.6063829787233,102.76978417266189 535.1063829787233,102.76978417266189 C 547.6063829787233,102.76978417266189 548.1382978723404,86.94244604316548 560.6382978723404,86.94244604316548 C 573.1382978723404,86.94244604316548 573.6702127659574,79.02877697841727 586.1702127659574,79.02877697841727 C 598.6702127659574,79.02877697841727 599.2021276595744,79.02877697841727 611.7021276595744,79.02877697841727 C 624.2021276595744,79.02877697841727 624.7340425531914,71.11510791366908 637.2340425531914,71.11510791366908 C 649.7340425531914,71.11510791366908 650.2659574468084,66.79856115107913 662.7659574468084,66.79856115107913 C 675.2659574468084,66.79856115107913 675.7978723404256,71.11510791366908 688.2978723404256,71.11510791366908 C 700.7978723404256,71.11510791366908 701.3297872340426,66.79856115107913 713.8297872340426,66.79856115107913 C 726.3297872340426,66.79856115107913 726.8617021276597,66.79856115107913 739.3617021276597,66.79856115107913 C 751.8617021276597,66.79856115107913 752.3936170212766,66.79856115107913 764.8936170212766,66.79856115107913 C 777.3936170212766,66.79856115107913 777.9255319148937,58.88489208633095 790.4255319148937,58.88489208633095 C 802.9255319148937,58.88489208633095 803.4574468085107,43.057553956834525 815.9574468085107,43.057553956834525 C 828.4574468085107,43.057553956834525 828.9893617021276,50.97122302158273 841.4893617021276,50.97122302158273 C 853.9893617021276,50.97122302158273 854.5212765957447,43.057553956834525 867.0212765957447,43.057553956834525 C 879.5212765957447,43.057553956834525 880.0531914893617,43.057553956834525 892.5531914893617,43.057553956834525 C 905.0531914893617,43.057553956834525 905.5851063829788,50.97122302158273 918.0851063829788,50.97122302158273 C 930.5851063829788,50.97122302158273 931.1170212765957,50.97122302158273 943.6170212765957,50.97122302158273 C 956.1170212765957,50.97122302158273 956.6489361702128,50.97122302158273 969.1489361702128,50.97122302158273 C 981.6489361702128,50.97122302158273 982.1808510638298,50.97122302158273 994.6808510638298,50.97122302158273 C 1007.1808510638298,50.97122302158273 1007.7127659574468,50.97122302158273 1020.2127659574468,50.97122302158273 C 1032.7127659574467,50.97122302158273 1033.2446808510638,43.057553956834525 1045.7446808510638,43.057553956834525 C 1058.2446808510638,43.057553956834525 1058.776595744681,50.97122302158273 1071.276595744681,50.97122302158273 C 1083.776595744681,50.97122302158273 1084.308510638298,58.88489208633095 1096.808510638298,58.88489208633095 C 1109.308510638298,58.88489208633095 1109.840425531915,66.79856115107913 1122.340425531915,66.79856115107913 C 1134.840425531915,66.79856115107913 1135.372340425532,66.79856115107913 1147.872340425532,66.79856115107913 C 1160.372340425532,66.79856115107913 1160.904255319149,66.79856115107913 1173.404255319149,66.79856115107913 C 1185.904255319149,66.79856115107913 1186.436170212766,66.79856115107913 1198.936170212766,66.79856115107913 C 1211.436170212766,66.79856115107913 1211.968085106383,71.11510791366908 1224.468085106383,71.11510791366908 C 1236.968085106383,71.11510791366908 1237.5,79.02877697841727 1250.0,79.02877697841727" stroke="gray" stroke-width="4" fill="none"></path><circle cx="50.0" cy="94.85611510791368" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="75.53191489361703" cy="102.76978417266189" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="101.06382978723404" cy="107.08633093525181" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="126.59574468085106" cy="107.08633093525181" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="152.12765957446808" cy="107.08633093525181" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="177.6595744680851" cy="107.08633093525181" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="203.1914893617021" cy="107.08633093525181" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="228.72340425531914" cy="107.08633093525181" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="254.25531914893617" cy="107.08633093525181" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="279.7872340425532" cy="107.08633093525181" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="305.3191489361702" cy="115.0" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="330.8510638297872" cy="107.08633093525181" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="356.3829787234042" cy="102.76978417266189" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="381.9148936170213" cy="102.76978417266189" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="407.4468085106383" cy="102.76978417266189" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="432.97872340425533" cy="102.76978417266189" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="458.51063829787233" cy="102.76978417266189" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="484.0425531914894" cy="107.08633093525181" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="509.5744680851064" cy="94.85611510791368" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="535.1063829787233" cy="102.76978417266189" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="560.6382978723404" cy="86.94244604316548" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="586.1702127659574" cy="79.02877697841727" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="611.7021276595744" cy="79.02877697841727" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="637.2340425531914" cy="71.11510791366908" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="662.7659574468084" cy="66.79856115107913" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="688.2978723404256" cy="71.11510791366908" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="713.8297872340426" cy="66.79856115107913" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="739.3617021276597" cy="66.79856115107913" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="764.8936170212766" cy="66.79856115107913" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="790.4255319148937" cy="58.88489208633095" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="815.9574468085107" cy="43.057553956834525" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="841.4893617021276" cy="50.97122302158273" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="867.0212765957447" cy="43.057553956834525" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="892.5531914893617" cy="43.057553956834525" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="918.0851063829788" cy="50.97122302158273" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="943.6170212765957" cy="50.97122302158273" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="969.1489361702128" cy="50.97122302158273" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="994.6808510638298" cy="50.97122302158273" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1020.2127659574468" cy="50.97122302158273" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1045.7446808510638" cy="43.057553956834525" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1071.276595744681" cy="50.97122302158273" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1096.808510638298" cy="58.88489208633095" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1122.340425531915" cy="66.79856115107913" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1147.872340425532" cy="66.79856115107913" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1173.404255319149" cy="66.79856115107913" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1198.936170212766" cy="66.79856115107913" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1224.468085106383" cy="71.11510791366908" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1250.0" cy="79.02877697841727" r="4" stroke="black" stroke-width="4" fill="white"></circle><g class="y-axis-line"><rect x="0" y="0" width="65" height="130" stroke="transparent" stroke-width="0" fill="transparent"></rect><text x="0" y="19.0" fill="transparent" stroke="transparent" font-size="25">30.0</text><text x="0" y="126.0" fill="transparent" stroke="transparent" font-size="25">16.1</text></g><g class="vert-line"><rect x="40.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="60.0" y="20" fill="transparent" stroke="transparent" font-size="30px">18.9</text></g><g class="vert-line"><rect x="65.53191489361703" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="85.53191489361703" y="20" fill="transparent" stroke="transparent" font-size="30px">17.8</text></g><g class="vert-line"><rect x="91.06382978723404" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="111.06382978723404" y="20" fill="transparent" stroke="transparent" font-size="30px">17.2</text></g><g class="vert-line"><rect x="116.59574468085106" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="136.59574468085106" y="20" fill="transparent" stroke="transparent" font-size="30px">17.2</text></g><g class="vert-line"><rect x="142.12765957446808" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="162.12765957446808" y="20" fill="transparent" stroke="transparent" font-size="30px">17.2</text></g><g class="vert-line"><rect x="167.6595744680851" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="187.6595744680851" y="20" fill="transparent" stroke="transparent" font-size="30px">17.2</text></g><g class="vert-line"><rect x="193.1914893617021" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="213.1914893617021" y="20" fill="transparent" stroke="transparent" font-size="30px">17.2</text></g><g class="vert-line"><rect x="218.72340425531914" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="238.72340425531914" y="20" fill="transparent" stroke="transparent" font-size="30px">17.2</text></g><g class="vert-line"><rect x="244.25531914893617" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="264.25531914893617" y="20" fill="transparent" stroke="transparent" font-size="30px">17.2</text></g><g class="vert-line"><rect x="269.7872340425532" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="289.7872340425532" y="20" fill="transparent" stroke="transparent" font-size="30px">17.2</text></g><g class="vert-line"><rect x="295.3191489361702" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="315.3191489361702" y="20" fill="transparent" stroke="transparent" font-size="30px">16.1</text></g><g class="vert-line"><rect x="320.8510638297872" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="340.8510638297872" y="20" fill="transparent" stroke="transparent" font-size="30px">17.2</text></g><g class="vert-line"><rect x="346.3829787234042" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="366.3829787234042" y="20" fill="transparent" stroke="transparent" font-size="30px">17.8</text></g><g class="vert-line"><rect x="371.9148936170213" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="391.9148936170213" y="20" fill="transparent" stroke="transparent" font-size="30px">17.8</text></g><g class="vert-line"><rect x="397.4468085106383" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="417.4468085106383" y="20" fill="transparent" stroke="transparent" font-size="30px">17.8</text></g><g class="vert-line"><rect x="422.97872340425533" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="442.97872340425533" y="20" fill="transparent" stroke="transparent" font-size="30px">17.8</text></g><g class="vert-line"><rect x="448.51063829787233" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="468.51063829787233" y="20" fill="transparent" stroke="transparent" font-size="30px">17.8</text></g><g class="vert-line"><rect x="474.0425531914894" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="494.0425531914894" y="20" fill="transparent" stroke="transparent" font-size="30px">17.2</text></g><g class="vert-line"><rect x="499.5744680851064" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="519.5744680851064" y="20" fill="transparent" stroke="transparent" font-size="30px">18.9</text></g><g class="vert-line"><rect x="525.1063829787233" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="545.1063829787233" y="20" fill="transparent" stroke="transparent" font-size="30px">17.8</text></g><g class="vert-line"><rect x="550.6382978723404" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="570.6382978723404" y="20" fill="transparent" stroke="transparent" font-size="30px">20.0</text></g><g class="vert-line"><rect x="576.1702127659574" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="596.1702127659574" y="20" fill="transparent" stroke="transparent" font-size="30px">21.1</text></g><g class="vert-line"><rect x="601.7021276595744" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="621.7021276595744" y="20" fill="transparent" stroke="transparent" font-size="30px">21.1</text></g><g class="vert-line"><rect x="627.2340425531914" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="647.2340425531914" y="20" fill="transparent" stroke="transparent" font-size="30px">22.2</text></g><g class="vert-line"><rect x="652.7659574468084" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="672.7659574468084" y="20" fill="transparent" stroke="transparent" font-size="30px">22.8</text></g><g class="vert-line"><rect x="678.2978723404256" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="698.2978723404256" y="20" fill="transparent" stroke="transparent" font-size="30px">22.2</text></g><g class="vert-line"><rect x="703.8297872340426" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="723.8297872340426" y="20" fill="transparent" stroke="transparent" font-size="30px">22.8</text></g><g class="vert-line"><rect x="729.3617021276597" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="749.3617021276597" y="20" fill="transparent" stroke="transparent" font-size="30px">22.8</text></g><g class="vert-line"><rect x="754.8936170212766" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="774.8936170212766" y="20" fill="transparent" stroke="transparent" font-size="30px">22.8</text></g><g class="vert-line"><rect x="780.4255319148937" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="800.4255319148937" y="20" fill="transparent" stroke="transparent" font-size="30px">23.9</text></g><g class="vert-line"><rect x="805.9574468085107" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="825.9574468085107" y="20" fill="transparent" stroke="transparent" font-size="30px">26.1</text></g><g class="vert-line"><rect x="831.4893617021276" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="851.4893617021276" y="20" fill="transparent" stroke="transparent" font-size="30px">25.0</text></g><g class="vert-line"><rect x="857.0212765957447" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="877.0212765957447" y="20" fill="transparent" stroke="transparent" font-size="30px">26.1</text></g><g class="vert-line"><rect x="882.5531914893617" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="902.5531914893617" y="20" fill="transparent" stroke="transparent" font-size="30px">26.1</text></g><g class="vert-line"><rect x="908.0851063829788" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="928.0851063829788" y="20" fill="transparent" stroke="transparent" font-size="30px">25.0</text></g><g class="vert-line"><rect x="933.6170212765957" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="953.6170212765957" y="20" fill="transparent" stroke="transparent" font-size="30px">25.0</text></g><g class="vert-line"><rect x="959.1489361702128" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="979.1489361702128" y="20" fill="transparent" stroke="transparent" font-size="30px">25.0</text></g><g class="vert-line"><rect x="984.6808510638298" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1004.6808510638298" y="20" fill="transparent" stroke="transparent" font-size="30px">25.0</text></g><g class="vert-line"><rect x="1010.2127659574468" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1030.2127659574467" y="20" fill="transparent" stroke="transparent" font-size="30px">25.0</text></g><g class="vert-line"><rect x="1035.7446808510638" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1055.7446808510638" y="20" fill="transparent" stroke="transparent" font-size="30px">26.1</text></g><g class="vert-line"><rect x="1061.276595744681" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1081.276595744681" y="20" fill="transparent" stroke="transparent" font-size="30px">25.0</text></g><g class="vert-line"><rect x="1086.808510638298" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1106.808510638298" y="20" fill="transparent" stroke="transparent" font-size="30px">23.9</text></g><g class="vert-line"><rect x="1112.340425531915" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1132.340425531915" y="20" fill="transparent" stroke="transparent" font-size="30px">22.8</text></g><g class="vert-line"><rect x="1137.872340425532" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1157.872340425532" y="20" fill="transparent" stroke="transparent" font-size="30px">22.8</text></g><g class="vert-line"><rect x="1163.404255319149" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1183.404255319149" y="20" fill="transparent" stroke="transparent" font-size="30px">22.8</text></g><g class="vert-line"><rect x="1188.936170212766" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1208.936170212766" y="20" fill="transparent" stroke="transparent" font-size="30px">22.8</text></g><g class="vert-line"><rect x="1214.468085106383" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1234.468085106383" y="20" fill="transparent" stroke="transparent" font-size="30px">22.2</text></g><g class="vert-line"><rect x="1240.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1260.0" y="20" fill="transparent" stroke="transparent" font-size="30px">21.1</text></g></svg></div></td>
    <td class="gt_row gt_left"><div><svg viewbox="0 0 1300 130" style="height: 2em; margin-left: auto; margin-right: auto; font-size: inherit; overflow: visible; vertical-align: middle; position:relative;"><defs><pattern id="area_pattern" width="8" height="8" patternunits="userSpaceOnUse"><path class="pattern-line" d="M 0,8 l 8,-8 M -1,1 l 4,-4 M 6,10 l 4,-4" stroke="#FF0000" stroke-width="1.5" stroke-linecap="round" shape-rendering="geometricPrecision"></path></pattern></defs><style> text { font-family: ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace; stroke-width: 0.15em; paint-order: stroke; stroke-linejoin: round; cursor: default; } .vert-line:hover rect { fill: #911EB4; fill-opacity: 40%; stroke: #FFFFFF60; color: red; } .vert-line:hover text { stroke: white; fill: #212427; } .horizontal-line:hover text {stroke: white; fill: #212427; } .ref-line:hover rect { stroke: #FFFFFF60; } .ref-line:hover line { stroke: #FF0000; } .ref-line:hover text { stroke: white; fill: #212427; } .y-axis-line:hover rect { fill: #EDEDED; fill-opacity: 60%; stroke: #FFFFFF60; color: red; } .y-axis-line:hover text { stroke: white; stroke-width: 0.20em; fill: #1A1C1F; } </style><path d="M 50.0,41.98412698412699 C 62.5,41.98412698412699 63.03191489361703,41.98412698412699 75.53191489361703,41.98412698412699 C 88.03191489361703,41.98412698412699 88.56382978723404,34.04761904761905 101.06382978723404,34.04761904761905 C 113.56382978723404,34.04761904761905 114.09574468085106,34.04761904761905 126.59574468085106,34.04761904761905 C 139.09574468085106,34.04761904761905 139.62765957446808,34.04761904761905 152.12765957446808,34.04761904761905 C 164.62765957446808,34.04761904761905 165.1595744680851,34.04761904761905 177.6595744680851,34.04761904761905 C 190.1595744680851,34.04761904761905 190.6914893617021,34.04761904761905 203.1914893617021,34.04761904761905 C 215.6914893617021,34.04761904761905 216.22340425531914,34.04761904761905 228.72340425531914,34.04761904761905 C 241.22340425531914,34.04761904761905 241.75531914893617,43.57142857142857 254.25531914893617,43.57142857142857 C 266.75531914893617,43.57142857142857 267.2872340425532,43.57142857142857 279.7872340425532,43.57142857142857 C 292.2872340425532,43.57142857142857 292.8191489361702,34.04761904761905 305.3191489361702,34.04761904761905 C 317.8191489361702,34.04761904761905 318.3510638297872,43.57142857142857 330.8510638297872,43.57142857142857 C 343.3510638297872,43.57142857142857 343.8829787234042,57.85714285714286 356.3829787234042,57.85714285714286 C 368.8829787234042,57.85714285714286 369.4148936170213,65.79365079365078 381.9148936170213,65.79365079365078 C 394.4148936170213,65.79365079365078 394.9468085106383,41.98412698412699 407.4468085106383,41.98412698412699 C 419.9468085106383,41.98412698412699 420.47872340425533,41.98412698412699 432.97872340425533,41.98412698412699 C 445.47872340425533,41.98412698412699 446.01063829787233,41.98412698412699 458.51063829787233,41.98412698412699 C 471.01063829787233,41.98412698412699 471.5425531914894,43.57142857142857 484.0425531914894,43.57142857142857 C 496.5425531914894,43.57142857142857 497.0744680851064,49.92063492063492 509.5744680851064,49.92063492063492 C 522.0744680851064,49.92063492063492 522.6063829787233,51.50793650793651 535.1063829787233,51.50793650793651 C 547.6063829787233,51.50793650793651 548.1382978723404,65.79365079365078 560.6382978723404,65.79365079365078 C 573.1382978723404,65.79365079365078 573.6702127659574,65.79365079365078 586.1702127659574,65.79365079365078 C 598.6702127659574,65.79365079365078 599.2021276595744,65.79365079365078 611.7021276595744,65.79365079365078 C 624.2021276595744,65.79365079365078 624.7340425531914,64.20634920634922 637.2340425531914,64.20634920634922 C 649.7340425531914,64.20634920634922 650.2659574468084,70.55555555555556 662.7659574468084,70.55555555555556 C 675.2659574468084,70.55555555555556 675.7978723404256,64.20634920634922 688.2978723404256,64.20634920634922 C 700.7978723404256,64.20634920634922 701.3297872340426,70.55555555555556 713.8297872340426,70.55555555555556 C 726.3297872340426,70.55555555555556 726.8617021276597,70.55555555555556 739.3617021276597,70.55555555555556 C 751.8617021276597,70.55555555555556 752.3936170212766,70.55555555555556 764.8936170212766,70.55555555555556 C 777.3936170212766,70.55555555555556 777.9255319148937,76.9047619047619 790.4255319148937,76.9047619047619 C 802.9255319148937,76.9047619047619 803.4574468085107,99.12698412698413 815.9574468085107,99.12698412698413 C 828.4574468085107,99.12698412698413 828.9893617021276,88.01587301587303 841.4893617021276,88.01587301587303 C 853.9893617021276,88.01587301587303 854.5212765957447,99.12698412698413 867.0212765957447,99.12698412698413 C 879.5212765957447,99.12698412698413 880.0531914893617,99.12698412698413 892.5531914893617,99.12698412698413 C 905.0531914893617,99.12698412698413 905.5851063829788,99.12698412698413 918.0851063829788,99.12698412698413 C 930.5851063829788,99.12698412698413 931.1170212765957,108.65079365079364 943.6170212765957,108.65079365079364 C 956.1170212765957,108.65079365079364 956.6489361702128,108.65079365079364 969.1489361702128,108.65079365079364 C 981.6489361702128,108.65079365079364 982.1808510638298,111.82539682539682 994.6808510638298,111.82539682539682 C 1007.1808510638298,111.82539682539682 1007.7127659574468,108.65079365079364 1020.2127659574468,108.65079365079364 C 1032.7127659574467,108.65079365079364 1033.2446808510638,111.82539682539682 1045.7446808510638,111.82539682539682 C 1058.2446808510638,111.82539682539682 1058.776595744681,103.88888888888889 1071.276595744681,103.88888888888889 C 1083.776595744681,103.88888888888889 1084.308510638298,99.12698412698413 1096.808510638298,99.12698412698413 C 1109.308510638298,99.12698412698413 1109.840425531915,94.36507936507937 1122.340425531915,94.36507936507937 C 1134.840425531915,94.36507936507937 1135.372340425532,99.12698412698413 1147.872340425532,99.12698412698413 C 1160.372340425532,99.12698412698413 1160.904255319149,99.12698412698413 1173.404255319149,99.12698412698413 C 1185.904255319149,99.12698412698413 1186.436170212766,103.88888888888889 1198.936170212766,103.88888888888889 C 1211.436170212766,103.88888888888889 1211.968085106383,89.60317460317461 1224.468085106383,89.60317460317461 C 1236.968085106383,89.60317460317461 1237.5,78.4920634920635 1250.0,78.4920634920635" stroke="gray" stroke-width="4" fill="none"></path><circle cx="50.0" cy="41.98412698412699" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="75.53191489361703" cy="41.98412698412699" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="101.06382978723404" cy="34.04761904761905" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="126.59574468085106" cy="34.04761904761905" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="152.12765957446808" cy="34.04761904761905" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="177.6595744680851" cy="34.04761904761905" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="203.1914893617021" cy="34.04761904761905" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="228.72340425531914" cy="34.04761904761905" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="254.25531914893617" cy="43.57142857142857" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="279.7872340425532" cy="43.57142857142857" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="305.3191489361702" cy="34.04761904761905" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="330.8510638297872" cy="43.57142857142857" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="356.3829787234042" cy="57.85714285714286" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="381.9148936170213" cy="65.79365079365078" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="407.4468085106383" cy="41.98412698412699" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="432.97872340425533" cy="41.98412698412699" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="458.51063829787233" cy="41.98412698412699" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="484.0425531914894" cy="43.57142857142857" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="509.5744680851064" cy="49.92063492063492" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="535.1063829787233" cy="51.50793650793651" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="560.6382978723404" cy="65.79365079365078" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="586.1702127659574" cy="65.79365079365078" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="611.7021276595744" cy="65.79365079365078" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="637.2340425531914" cy="64.20634920634922" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="662.7659574468084" cy="70.55555555555556" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="688.2978723404256" cy="64.20634920634922" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="713.8297872340426" cy="70.55555555555556" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="739.3617021276597" cy="70.55555555555556" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="764.8936170212766" cy="70.55555555555556" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="790.4255319148937" cy="76.9047619047619" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="815.9574468085107" cy="99.12698412698413" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="841.4893617021276" cy="88.01587301587303" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="867.0212765957447" cy="99.12698412698413" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="892.5531914893617" cy="99.12698412698413" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="918.0851063829788" cy="99.12698412698413" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="943.6170212765957" cy="108.65079365079364" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="969.1489361702128" cy="108.65079365079364" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="994.6808510638298" cy="111.82539682539682" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1020.2127659574468" cy="108.65079365079364" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1045.7446808510638" cy="111.82539682539682" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1071.276595744681" cy="103.88888888888889" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1096.808510638298" cy="99.12698412698413" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1122.340425531915" cy="94.36507936507937" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1147.872340425532" cy="99.12698412698413" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1173.404255319149" cy="99.12698412698413" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1198.936170212766" cy="103.88888888888889" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1224.468085106383" cy="89.60317460317461" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1250.0" cy="78.4920634920635" r="4" stroke="black" stroke-width="4" fill="white"></circle><g class="y-axis-line"><rect x="0" y="0" width="65" height="130" stroke="transparent" stroke-width="0" fill="transparent"></rect><text x="0" y="19.0" fill="transparent" stroke="transparent" font-size="25">100</text><text x="0" y="126.0" fill="transparent" stroke="transparent" font-size="25">37</text></g><g class="vert-line"><rect x="40.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="60.0" y="20" fill="transparent" stroke="transparent" font-size="30px">83</text></g><g class="vert-line"><rect x="65.53191489361703" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="85.53191489361703" y="20" fill="transparent" stroke="transparent" font-size="30px">83</text></g><g class="vert-line"><rect x="91.06382978723404" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="111.06382978723404" y="20" fill="transparent" stroke="transparent" font-size="30px">88</text></g><g class="vert-line"><rect x="116.59574468085106" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="136.59574468085106" y="20" fill="transparent" stroke="transparent" font-size="30px">88</text></g><g class="vert-line"><rect x="142.12765957446808" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="162.12765957446808" y="20" fill="transparent" stroke="transparent" font-size="30px">88</text></g><g class="vert-line"><rect x="167.6595744680851" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="187.6595744680851" y="20" fill="transparent" stroke="transparent" font-size="30px">88</text></g><g class="vert-line"><rect x="193.1914893617021" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="213.1914893617021" y="20" fill="transparent" stroke="transparent" font-size="30px">88</text></g><g class="vert-line"><rect x="218.72340425531914" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="238.72340425531914" y="20" fill="transparent" stroke="transparent" font-size="30px">88</text></g><g class="vert-line"><rect x="244.25531914893617" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="264.25531914893617" y="20" fill="transparent" stroke="transparent" font-size="30px">82</text></g><g class="vert-line"><rect x="269.7872340425532" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="289.7872340425532" y="20" fill="transparent" stroke="transparent" font-size="30px">82</text></g><g class="vert-line"><rect x="295.3191489361702" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="315.3191489361702" y="20" fill="transparent" stroke="transparent" font-size="30px">88</text></g><g class="vert-line"><rect x="320.8510638297872" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="340.8510638297872" y="20" fill="transparent" stroke="transparent" font-size="30px">82</text></g><g class="vert-line"><rect x="346.3829787234042" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="366.3829787234042" y="20" fill="transparent" stroke="transparent" font-size="30px">73</text></g><g class="vert-line"><rect x="371.9148936170213" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="391.9148936170213" y="20" fill="transparent" stroke="transparent" font-size="30px">68</text></g><g class="vert-line"><rect x="397.4468085106383" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="417.4468085106383" y="20" fill="transparent" stroke="transparent" font-size="30px">83</text></g><g class="vert-line"><rect x="422.97872340425533" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="442.97872340425533" y="20" fill="transparent" stroke="transparent" font-size="30px">83</text></g><g class="vert-line"><rect x="448.51063829787233" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="468.51063829787233" y="20" fill="transparent" stroke="transparent" font-size="30px">83</text></g><g class="vert-line"><rect x="474.0425531914894" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="494.0425531914894" y="20" fill="transparent" stroke="transparent" font-size="30px">82</text></g><g class="vert-line"><rect x="499.5744680851064" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="519.5744680851064" y="20" fill="transparent" stroke="transparent" font-size="30px">78</text></g><g class="vert-line"><rect x="525.1063829787233" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="545.1063829787233" y="20" fill="transparent" stroke="transparent" font-size="30px">77</text></g><g class="vert-line"><rect x="550.6382978723404" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="570.6382978723404" y="20" fill="transparent" stroke="transparent" font-size="30px">68</text></g><g class="vert-line"><rect x="576.1702127659574" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="596.1702127659574" y="20" fill="transparent" stroke="transparent" font-size="30px">68</text></g><g class="vert-line"><rect x="601.7021276595744" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="621.7021276595744" y="20" fill="transparent" stroke="transparent" font-size="30px">68</text></g><g class="vert-line"><rect x="627.2340425531914" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="647.2340425531914" y="20" fill="transparent" stroke="transparent" font-size="30px">69</text></g><g class="vert-line"><rect x="652.7659574468084" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="672.7659574468084" y="20" fill="transparent" stroke="transparent" font-size="30px">65</text></g><g class="vert-line"><rect x="678.2978723404256" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="698.2978723404256" y="20" fill="transparent" stroke="transparent" font-size="30px">69</text></g><g class="vert-line"><rect x="703.8297872340426" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="723.8297872340426" y="20" fill="transparent" stroke="transparent" font-size="30px">65</text></g><g class="vert-line"><rect x="729.3617021276597" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="749.3617021276597" y="20" fill="transparent" stroke="transparent" font-size="30px">65</text></g><g class="vert-line"><rect x="754.8936170212766" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="774.8936170212766" y="20" fill="transparent" stroke="transparent" font-size="30px">65</text></g><g class="vert-line"><rect x="780.4255319148937" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="800.4255319148937" y="20" fill="transparent" stroke="transparent" font-size="30px">61</text></g><g class="vert-line"><rect x="805.9574468085107" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="825.9574468085107" y="20" fill="transparent" stroke="transparent" font-size="30px">47</text></g><g class="vert-line"><rect x="831.4893617021276" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="851.4893617021276" y="20" fill="transparent" stroke="transparent" font-size="30px">54</text></g><g class="vert-line"><rect x="857.0212765957447" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="877.0212765957447" y="20" fill="transparent" stroke="transparent" font-size="30px">47</text></g><g class="vert-line"><rect x="882.5531914893617" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="902.5531914893617" y="20" fill="transparent" stroke="transparent" font-size="30px">47</text></g><g class="vert-line"><rect x="908.0851063829788" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="928.0851063829788" y="20" fill="transparent" stroke="transparent" font-size="30px">47</text></g><g class="vert-line"><rect x="933.6170212765957" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="953.6170212765957" y="20" fill="transparent" stroke="transparent" font-size="30px">41</text></g><g class="vert-line"><rect x="959.1489361702128" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="979.1489361702128" y="20" fill="transparent" stroke="transparent" font-size="30px">41</text></g><g class="vert-line"><rect x="984.6808510638298" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1004.6808510638298" y="20" fill="transparent" stroke="transparent" font-size="30px">39</text></g><g class="vert-line"><rect x="1010.2127659574468" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1030.2127659574467" y="20" fill="transparent" stroke="transparent" font-size="30px">41</text></g><g class="vert-line"><rect x="1035.7446808510638" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1055.7446808510638" y="20" fill="transparent" stroke="transparent" font-size="30px">39</text></g><g class="vert-line"><rect x="1061.276595744681" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1081.276595744681" y="20" fill="transparent" stroke="transparent" font-size="30px">44</text></g><g class="vert-line"><rect x="1086.808510638298" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1106.808510638298" y="20" fill="transparent" stroke="transparent" font-size="30px">47</text></g><g class="vert-line"><rect x="1112.340425531915" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1132.340425531915" y="20" fill="transparent" stroke="transparent" font-size="30px">50</text></g><g class="vert-line"><rect x="1137.872340425532" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1157.872340425532" y="20" fill="transparent" stroke="transparent" font-size="30px">47</text></g><g class="vert-line"><rect x="1163.404255319149" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1183.404255319149" y="20" fill="transparent" stroke="transparent" font-size="30px">47</text></g><g class="vert-line"><rect x="1188.936170212766" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1208.936170212766" y="20" fill="transparent" stroke="transparent" font-size="30px">44</text></g><g class="vert-line"><rect x="1214.468085106383" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1234.468085106383" y="20" fill="transparent" stroke="transparent" font-size="30px">53</text></g><g class="vert-line"><rect x="1240.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1260.0" y="20" fill="transparent" stroke="transparent" font-size="30px">60</text></g></svg></div></td>
  </tr>
  <tr>
    <td class="gt_row gt_left">Fri, May 5, 2023</td>
    <td class="gt_row gt_left"><div><svg viewbox="0 0 1250 130" style="height: 2em; margin-left: auto; margin-right: auto; font-size: inherit; overflow: visible; vertical-align: middle; position:relative;"><defs><pattern id="area_pattern" width="8" height="8" patternunits="userSpaceOnUse"><path class="pattern-line" d="M 0,8 l 8,-8 M -1,1 l 4,-4 M 6,10 l 4,-4" stroke="#FF0000" stroke-width="1.5" stroke-linecap="round" shape-rendering="geometricPrecision"></path></pattern></defs><style> text { font-family: ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace; stroke-width: 0.15em; paint-order: stroke; stroke-linejoin: round; cursor: default; } .vert-line:hover rect { fill: #911EB4; fill-opacity: 40%; stroke: #FFFFFF60; color: red; } .vert-line:hover text { stroke: white; fill: #212427; } .horizontal-line:hover text {stroke: white; fill: #212427; } .ref-line:hover rect { stroke: #FFFFFF60; } .ref-line:hover line { stroke: #FF0000; } .ref-line:hover text { stroke: white; fill: #212427; } .y-axis-line:hover rect { fill: #EDEDED; fill-opacity: 60%; stroke: #FFFFFF60; color: red; } .y-axis-line:hover text { stroke: white; stroke-width: 0.20em; fill: #1A1C1F; } </style><path d="M 50.0,79.02877697841727 C 62.5,79.02877697841727 63.05555555555556,79.02877697841727 75.55555555555556,79.02877697841727 C 88.05555555555556,79.02877697841727 88.61111111111111,79.02877697841727 101.11111111111111,79.02877697841727 C 113.61111111111111,79.02877697841727 114.16666666666667,79.02877697841727 126.66666666666667,79.02877697841727 C 139.16666666666669,79.02877697841727 139.72222222222223,79.02877697841727 152.22222222222223,79.02877697841727 C 164.72222222222223,79.02877697841727 165.27777777777777,79.02877697841727 177.77777777777777,79.02877697841727 C 190.27777777777777,79.02877697841727 190.83333333333334,79.02877697841727 203.33333333333334,79.02877697841727 C 215.83333333333334,79.02877697841727 216.38888888888889,79.02877697841727 228.88888888888889,79.02877697841727 C 241.38888888888889,79.02877697841727 241.94444444444446,79.02877697841727 254.44444444444446,79.02877697841727 C 266.94444444444446,79.02877697841727 267.5,86.94244604316548 280.0,86.94244604316548 C 292.5,86.94244604316548 293.05555555555554,94.85611510791368 305.55555555555554,94.85611510791368 C 318.05555555555554,94.85611510791368 318.6111111111111,107.08633093525181 331.1111111111111,107.08633093525181 C 343.6111111111111,107.08633093525181 344.1666666666667,107.08633093525181 356.6666666666667,107.08633093525181 C 369.1666666666667,107.08633093525181 369.7222222222222,107.08633093525181 382.2222222222222,107.08633093525181 C 394.7222222222222,107.08633093525181 395.27777777777777,107.08633093525181 407.77777777777777,107.08633093525181 C 420.27777777777777,107.08633093525181 420.8333333333333,102.76978417266189 433.3333333333333,102.76978417266189 C 445.8333333333333,102.76978417266189 446.3888888888889,102.76978417266189 458.8888888888889,102.76978417266189 C 471.3888888888889,102.76978417266189 471.94444444444446,102.76978417266189 484.44444444444446,102.76978417266189 C 496.94444444444446,102.76978417266189 497.5,102.76978417266189 510.0,102.76978417266189 C 522.5,102.76978417266189 523.0555555555555,102.76978417266189 535.5555555555555,102.76978417266189 C 548.0555555555555,102.76978417266189 548.6111111111111,102.76978417266189 561.1111111111111,102.76978417266189 C 573.6111111111111,102.76978417266189 574.1666666666666,94.85611510791368 586.6666666666666,94.85611510791368 C 599.1666666666666,94.85611510791368 599.7222222222222,94.85611510791368 612.2222222222222,94.85611510791368 C 624.7222222222222,94.85611510791368 625.2777777777777,94.85611510791368 637.7777777777777,94.85611510791368 C 650.2777777777777,94.85611510791368 650.8333333333334,94.85611510791368 663.3333333333334,94.85611510791368 C 675.8333333333334,94.85611510791368 676.3888888888889,86.94244604316548 688.8888888888889,86.94244604316548 C 701.3888888888889,86.94244604316548 701.9444444444443,86.94244604316548 714.4444444444443,86.94244604316548 C 726.9444444444443,86.94244604316548 727.5,86.94244604316548 740.0,86.94244604316548 C 752.5,86.94244604316548 753.0555555555555,79.02877697841727 765.5555555555555,79.02877697841727 C 778.0555555555555,79.02877697841727 778.6111111111112,79.02877697841727 791.1111111111112,79.02877697841727 C 803.6111111111112,79.02877697841727 804.1666666666666,86.94244604316548 816.6666666666666,86.94244604316548 C 829.1666666666666,86.94244604316548 829.7222222222222,58.88489208633095 842.2222222222222,58.88489208633095 C 854.7222222222222,58.88489208633095 855.2777777777778,50.97122302158273 867.7777777777778,50.97122302158273 C 880.2777777777778,50.97122302158273 880.8333333333333,58.88489208633095 893.3333333333333,58.88489208633095 C 905.8333333333333,58.88489208633095 906.3888888888889,66.79856115107913 918.8888888888889,66.79856115107913 C 931.3888888888889,66.79856115107913 931.9444444444445,66.79856115107913 944.4444444444445,66.79856115107913 C 956.9444444444445,66.79856115107913 957.5,71.11510791366908 970.0,71.11510791366908 C 982.5,71.11510791366908 983.0555555555555,71.11510791366908 995.5555555555555,71.11510791366908 C 1008.0555555555555,71.11510791366908 1008.6111111111111,71.11510791366908 1021.1111111111111,71.11510791366908 C 1033.611111111111,71.11510791366908 1034.1666666666667,86.94244604316548 1046.6666666666667,86.94244604316548 C 1059.1666666666667,86.94244604316548 1059.7222222222222,86.94244604316548 1072.2222222222222,86.94244604316548 C 1084.7222222222222,86.94244604316548 1085.2777777777778,86.94244604316548 1097.7777777777778,86.94244604316548 C 1110.2777777777778,86.94244604316548 1110.8333333333333,86.94244604316548 1123.3333333333333,86.94244604316548 C 1135.8333333333333,86.94244604316548 1136.388888888889,94.85611510791368 1148.888888888889,94.85611510791368 C 1161.388888888889,94.85611510791368 1161.9444444444443,94.85611510791368 1174.4444444444443,94.85611510791368 C 1186.9444444444443,94.85611510791368 1187.5,94.85611510791368 1200.0,94.85611510791368" stroke="gray" stroke-width="4" fill="none"></path><circle cx="50.0" cy="79.02877697841727" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="75.55555555555556" cy="79.02877697841727" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="101.11111111111111" cy="79.02877697841727" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="126.66666666666667" cy="79.02877697841727" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="152.22222222222223" cy="79.02877697841727" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="177.77777777777777" cy="79.02877697841727" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="203.33333333333334" cy="79.02877697841727" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="228.88888888888889" cy="79.02877697841727" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="254.44444444444446" cy="79.02877697841727" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="280.0" cy="86.94244604316548" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="305.55555555555554" cy="94.85611510791368" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="331.1111111111111" cy="107.08633093525181" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="356.6666666666667" cy="107.08633093525181" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="382.2222222222222" cy="107.08633093525181" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="407.77777777777777" cy="107.08633093525181" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="433.3333333333333" cy="102.76978417266189" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="458.8888888888889" cy="102.76978417266189" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="484.44444444444446" cy="102.76978417266189" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="510.0" cy="102.76978417266189" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="535.5555555555555" cy="102.76978417266189" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="561.1111111111111" cy="102.76978417266189" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="586.6666666666666" cy="94.85611510791368" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="612.2222222222222" cy="94.85611510791368" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="637.7777777777777" cy="94.85611510791368" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="663.3333333333334" cy="94.85611510791368" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="688.8888888888889" cy="86.94244604316548" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="714.4444444444443" cy="86.94244604316548" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="740.0" cy="86.94244604316548" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="765.5555555555555" cy="79.02877697841727" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="791.1111111111112" cy="79.02877697841727" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="816.6666666666666" cy="86.94244604316548" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="842.2222222222222" cy="58.88489208633095" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="867.7777777777778" cy="50.97122302158273" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="893.3333333333333" cy="58.88489208633095" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="918.8888888888889" cy="66.79856115107913" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="944.4444444444445" cy="66.79856115107913" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="970.0" cy="71.11510791366908" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="995.5555555555555" cy="71.11510791366908" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1021.1111111111111" cy="71.11510791366908" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1046.6666666666667" cy="86.94244604316548" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1072.2222222222222" cy="86.94244604316548" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1097.7777777777778" cy="86.94244604316548" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1123.3333333333333" cy="86.94244604316548" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1148.888888888889" cy="94.85611510791368" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1174.4444444444443" cy="94.85611510791368" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1200.0" cy="94.85611510791368" r="4" stroke="black" stroke-width="4" fill="white"></circle><g class="y-axis-line"><rect x="0" y="0" width="65" height="130" stroke="transparent" stroke-width="0" fill="transparent"></rect><text x="0" y="19.0" fill="transparent" stroke="transparent" font-size="25">30.0</text><text x="0" y="126.0" fill="transparent" stroke="transparent" font-size="25">16.1</text></g><g class="vert-line"><rect x="40.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="60.0" y="20" fill="transparent" stroke="transparent" font-size="30px">21.1</text></g><g class="vert-line"><rect x="65.55555555555556" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="85.55555555555556" y="20" fill="transparent" stroke="transparent" font-size="30px">21.1</text></g><g class="vert-line"><rect x="91.11111111111111" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="111.11111111111111" y="20" fill="transparent" stroke="transparent" font-size="30px">21.1</text></g><g class="vert-line"><rect x="116.66666666666667" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="136.66666666666669" y="20" fill="transparent" stroke="transparent" font-size="30px">21.1</text></g><g class="vert-line"><rect x="142.22222222222223" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="162.22222222222223" y="20" fill="transparent" stroke="transparent" font-size="30px">21.1</text></g><g class="vert-line"><rect x="167.77777777777777" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="187.77777777777777" y="20" fill="transparent" stroke="transparent" font-size="30px">21.1</text></g><g class="vert-line"><rect x="193.33333333333334" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="213.33333333333334" y="20" fill="transparent" stroke="transparent" font-size="30px">21.1</text></g><g class="vert-line"><rect x="218.88888888888889" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="238.88888888888889" y="20" fill="transparent" stroke="transparent" font-size="30px">21.1</text></g><g class="vert-line"><rect x="244.44444444444446" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="264.44444444444446" y="20" fill="transparent" stroke="transparent" font-size="30px">21.1</text></g><g class="vert-line"><rect x="270.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="290.0" y="20" fill="transparent" stroke="transparent" font-size="30px">20.0</text></g><g class="vert-line"><rect x="295.55555555555554" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="315.55555555555554" y="20" fill="transparent" stroke="transparent" font-size="30px">18.9</text></g><g class="vert-line"><rect x="321.1111111111111" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="341.1111111111111" y="20" fill="transparent" stroke="transparent" font-size="30px">17.2</text></g><g class="vert-line"><rect x="346.6666666666667" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="366.6666666666667" y="20" fill="transparent" stroke="transparent" font-size="30px">17.2</text></g><g class="vert-line"><rect x="372.2222222222222" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="392.2222222222222" y="20" fill="transparent" stroke="transparent" font-size="30px">17.2</text></g><g class="vert-line"><rect x="397.77777777777777" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="417.77777777777777" y="20" fill="transparent" stroke="transparent" font-size="30px">17.2</text></g><g class="vert-line"><rect x="423.3333333333333" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="443.3333333333333" y="20" fill="transparent" stroke="transparent" font-size="30px">17.8</text></g><g class="vert-line"><rect x="448.8888888888889" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="468.8888888888889" y="20" fill="transparent" stroke="transparent" font-size="30px">17.8</text></g><g class="vert-line"><rect x="474.44444444444446" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="494.44444444444446" y="20" fill="transparent" stroke="transparent" font-size="30px">17.8</text></g><g class="vert-line"><rect x="500.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="520.0" y="20" fill="transparent" stroke="transparent" font-size="30px">17.8</text></g><g class="vert-line"><rect x="525.5555555555555" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="545.5555555555555" y="20" fill="transparent" stroke="transparent" font-size="30px">17.8</text></g><g class="vert-line"><rect x="551.1111111111111" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="571.1111111111111" y="20" fill="transparent" stroke="transparent" font-size="30px">17.8</text></g><g class="vert-line"><rect x="576.6666666666666" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="596.6666666666666" y="20" fill="transparent" stroke="transparent" font-size="30px">18.9</text></g><g class="vert-line"><rect x="602.2222222222222" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="622.2222222222222" y="20" fill="transparent" stroke="transparent" font-size="30px">18.9</text></g><g class="vert-line"><rect x="627.7777777777777" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="647.7777777777777" y="20" fill="transparent" stroke="transparent" font-size="30px">18.9</text></g><g class="vert-line"><rect x="653.3333333333334" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="673.3333333333334" y="20" fill="transparent" stroke="transparent" font-size="30px">18.9</text></g><g class="vert-line"><rect x="678.8888888888889" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="698.8888888888889" y="20" fill="transparent" stroke="transparent" font-size="30px">20.0</text></g><g class="vert-line"><rect x="704.4444444444443" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="724.4444444444443" y="20" fill="transparent" stroke="transparent" font-size="30px">20.0</text></g><g class="vert-line"><rect x="730.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="750.0" y="20" fill="transparent" stroke="transparent" font-size="30px">20.0</text></g><g class="vert-line"><rect x="755.5555555555555" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="775.5555555555555" y="20" fill="transparent" stroke="transparent" font-size="30px">21.1</text></g><g class="vert-line"><rect x="781.1111111111112" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="801.1111111111112" y="20" fill="transparent" stroke="transparent" font-size="30px">21.1</text></g><g class="vert-line"><rect x="806.6666666666666" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="826.6666666666666" y="20" fill="transparent" stroke="transparent" font-size="30px">20.0</text></g><g class="vert-line"><rect x="832.2222222222222" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="852.2222222222222" y="20" fill="transparent" stroke="transparent" font-size="30px">23.9</text></g><g class="vert-line"><rect x="857.7777777777778" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="877.7777777777778" y="20" fill="transparent" stroke="transparent" font-size="30px">25.0</text></g><g class="vert-line"><rect x="883.3333333333333" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="903.3333333333333" y="20" fill="transparent" stroke="transparent" font-size="30px">23.9</text></g><g class="vert-line"><rect x="908.8888888888889" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="928.8888888888889" y="20" fill="transparent" stroke="transparent" font-size="30px">22.8</text></g><g class="vert-line"><rect x="934.4444444444445" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="954.4444444444445" y="20" fill="transparent" stroke="transparent" font-size="30px">22.8</text></g><g class="vert-line"><rect x="960.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="980.0" y="20" fill="transparent" stroke="transparent" font-size="30px">22.2</text></g><g class="vert-line"><rect x="985.5555555555555" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1005.5555555555555" y="20" fill="transparent" stroke="transparent" font-size="30px">22.2</text></g><g class="vert-line"><rect x="1011.1111111111111" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1031.111111111111" y="20" fill="transparent" stroke="transparent" font-size="30px">22.2</text></g><g class="vert-line"><rect x="1036.6666666666667" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1056.6666666666667" y="20" fill="transparent" stroke="transparent" font-size="30px">20.0</text></g><g class="vert-line"><rect x="1062.2222222222222" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1082.2222222222222" y="20" fill="transparent" stroke="transparent" font-size="30px">20.0</text></g><g class="vert-line"><rect x="1087.7777777777778" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1107.7777777777778" y="20" fill="transparent" stroke="transparent" font-size="30px">20.0</text></g><g class="vert-line"><rect x="1113.3333333333333" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1133.3333333333333" y="20" fill="transparent" stroke="transparent" font-size="30px">20.0</text></g><g class="vert-line"><rect x="1138.888888888889" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1158.888888888889" y="20" fill="transparent" stroke="transparent" font-size="30px">18.9</text></g><g class="vert-line"><rect x="1164.4444444444443" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1184.4444444444443" y="20" fill="transparent" stroke="transparent" font-size="30px">18.9</text></g><g class="vert-line"><rect x="1190.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1210.0" y="20" fill="transparent" stroke="transparent" font-size="30px">18.9</text></g></svg></div></td>
    <td class="gt_row gt_left"><div><svg viewbox="0 0 1250 130" style="height: 2em; margin-left: auto; margin-right: auto; font-size: inherit; overflow: visible; vertical-align: middle; position:relative;"><defs><pattern id="area_pattern" width="8" height="8" patternunits="userSpaceOnUse"><path class="pattern-line" d="M 0,8 l 8,-8 M -1,1 l 4,-4 M 6,10 l 4,-4" stroke="#FF0000" stroke-width="1.5" stroke-linecap="round" shape-rendering="geometricPrecision"></path></pattern></defs><style> text { font-family: ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace; stroke-width: 0.15em; paint-order: stroke; stroke-linejoin: round; cursor: default; } .vert-line:hover rect { fill: #911EB4; fill-opacity: 40%; stroke: #FFFFFF60; color: red; } .vert-line:hover text { stroke: white; fill: #212427; } .horizontal-line:hover text {stroke: white; fill: #212427; } .ref-line:hover rect { stroke: #FFFFFF60; } .ref-line:hover line { stroke: #FF0000; } .ref-line:hover text { stroke: white; fill: #212427; } .y-axis-line:hover rect { fill: #EDEDED; fill-opacity: 60%; stroke: #FFFFFF60; color: red; } .y-axis-line:hover text { stroke: white; stroke-width: 0.20em; fill: #1A1C1F; } </style><path d="M 50.0,78.4920634920635 C 62.5,78.4920634920635 63.05555555555556,84.84126984126983 75.55555555555556,84.84126984126983 C 88.05555555555556,84.84126984126983 88.61111111111111,84.84126984126983 101.11111111111111,84.84126984126983 C 113.61111111111111,84.84126984126983 114.16666666666667,89.60317460317461 126.66666666666667,89.60317460317461 C 139.16666666666669,89.60317460317461 139.72222222222223,89.60317460317461 152.22222222222223,89.60317460317461 C 164.72222222222223,89.60317460317461 165.27777777777777,89.60317460317461 177.77777777777777,89.60317460317461 C 190.27777777777777,89.60317460317461 190.83333333333334,89.60317460317461 203.33333333333334,89.60317460317461 C 215.83333333333334,89.60317460317461 216.38888888888889,89.60317460317461 228.88888888888889,89.60317460317461 C 241.38888888888889,89.60317460317461 241.94444444444446,84.84126984126983 254.44444444444446,84.84126984126983 C 266.94444444444446,84.84126984126983 267.5,72.14285714285714 280.0,72.14285714285714 C 292.5,72.14285714285714 293.05555555555554,72.14285714285714 305.55555555555554,72.14285714285714 C 318.05555555555554,72.14285714285714 318.6111111111111,43.57142857142857 331.1111111111111,43.57142857142857 C 343.6111111111111,43.57142857142857 344.1666666666667,24.523809523809526 356.6666666666667,24.523809523809526 C 369.1666666666667,24.523809523809526 369.7222222222222,24.523809523809526 382.2222222222222,24.523809523809526 C 394.7222222222222,24.523809523809526 395.27777777777777,24.523809523809526 407.77777777777777,24.523809523809526 C 420.27777777777777,24.523809523809526 420.8333333333333,34.04761904761905 433.3333333333333,34.04761904761905 C 445.8333333333333,34.04761904761905 446.3888888888889,34.04761904761905 458.8888888888889,34.04761904761905 C 471.3888888888889,34.04761904761905 471.94444444444446,34.04761904761905 484.44444444444446,34.04761904761905 C 496.94444444444446,34.04761904761905 497.5,34.04761904761905 510.0,34.04761904761905 C 522.5,34.04761904761905 523.0555555555555,34.04761904761905 535.5555555555555,34.04761904761905 C 548.0555555555555,34.04761904761905 548.6111111111111,34.04761904761905 561.1111111111111,34.04761904761905 C 573.6111111111111,34.04761904761905 574.1666666666666,41.98412698412699 586.6666666666666,41.98412698412699 C 599.1666666666666,41.98412698412699 599.7222222222222,41.98412698412699 612.2222222222222,41.98412698412699 C 624.7222222222222,41.98412698412699 625.2777777777777,41.98412698412699 637.7777777777777,41.98412698412699 C 650.2777777777777,41.98412698412699 650.8333333333334,41.98412698412699 663.3333333333334,41.98412698412699 C 675.8333333333334,41.98412698412699 676.3888888888889,49.92063492063492 688.8888888888889,49.92063492063492 C 701.3888888888889,49.92063492063492 701.9444444444443,49.92063492063492 714.4444444444443,49.92063492063492 C 726.9444444444443,49.92063492063492 727.5,49.92063492063492 740.0,49.92063492063492 C 752.5,49.92063492063492 753.0555555555555,57.85714285714286 765.5555555555555,57.85714285714286 C 778.0555555555555,57.85714285714286 778.6111111111112,57.85714285714286 791.1111111111112,57.85714285714286 C 803.6111111111112,57.85714285714286 804.1666666666666,49.92063492063492 816.6666666666666,49.92063492063492 C 829.1666666666666,49.92063492063492 829.7222222222222,83.25396825396827 842.2222222222222,83.25396825396827 C 854.7222222222222,83.25396825396827 855.2777777777778,88.01587301587303 867.7777777777778,88.01587301587303 C 880.2777777777778,88.01587301587303 880.8333333333333,89.60317460317461 893.3333333333333,89.60317460317461 C 905.8333333333333,89.60317460317461 906.3888888888889,83.25396825396827 918.8888888888889,83.25396825396827 C 931.3888888888889,83.25396825396827 931.9444444444445,83.25396825396827 944.4444444444445,83.25396825396827 C 956.9444444444445,83.25396825396827 957.5,78.4920634920635 970.0,78.4920634920635 C 982.5,78.4920634920635 983.0555555555555,72.14285714285714 995.5555555555555,72.14285714285714 C 1008.0555555555555,72.14285714285714 1008.6111111111111,64.20634920634922 1021.1111111111111,64.20634920634922 C 1033.611111111111,64.20634920634922 1034.1666666666667,49.92063492063492 1046.6666666666667,49.92063492063492 C 1059.1666666666667,49.92063492063492 1059.7222222222222,49.92063492063492 1072.2222222222222,49.92063492063492 C 1084.7222222222222,49.92063492063492 1085.2777777777778,49.92063492063492 1097.7777777777778,49.92063492063492 C 1110.2777777777778,49.92063492063492 1110.8333333333333,41.98412698412699 1123.3333333333333,41.98412698412699 C 1135.8333333333333,41.98412698412699 1136.388888888889,34.04761904761905 1148.888888888889,34.04761904761905 C 1161.388888888889,34.04761904761905 1161.9444444444443,34.04761904761905 1174.4444444444443,34.04761904761905 C 1186.9444444444443,34.04761904761905 1187.5,34.04761904761905 1200.0,34.04761904761905" stroke="gray" stroke-width="4" fill="none"></path><circle cx="50.0" cy="78.4920634920635" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="75.55555555555556" cy="84.84126984126983" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="101.11111111111111" cy="84.84126984126983" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="126.66666666666667" cy="89.60317460317461" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="152.22222222222223" cy="89.60317460317461" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="177.77777777777777" cy="89.60317460317461" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="203.33333333333334" cy="89.60317460317461" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="228.88888888888889" cy="89.60317460317461" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="254.44444444444446" cy="84.84126984126983" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="280.0" cy="72.14285714285714" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="305.55555555555554" cy="72.14285714285714" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="331.1111111111111" cy="43.57142857142857" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="356.6666666666667" cy="24.523809523809526" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="382.2222222222222" cy="24.523809523809526" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="407.77777777777777" cy="24.523809523809526" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="433.3333333333333" cy="34.04761904761905" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="458.8888888888889" cy="34.04761904761905" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="484.44444444444446" cy="34.04761904761905" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="510.0" cy="34.04761904761905" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="535.5555555555555" cy="34.04761904761905" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="561.1111111111111" cy="34.04761904761905" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="586.6666666666666" cy="41.98412698412699" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="612.2222222222222" cy="41.98412698412699" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="637.7777777777777" cy="41.98412698412699" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="663.3333333333334" cy="41.98412698412699" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="688.8888888888889" cy="49.92063492063492" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="714.4444444444443" cy="49.92063492063492" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="740.0" cy="49.92063492063492" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="765.5555555555555" cy="57.85714285714286" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="791.1111111111112" cy="57.85714285714286" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="816.6666666666666" cy="49.92063492063492" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="842.2222222222222" cy="83.25396825396827" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="867.7777777777778" cy="88.01587301587303" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="893.3333333333333" cy="89.60317460317461" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="918.8888888888889" cy="83.25396825396827" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="944.4444444444445" cy="83.25396825396827" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="970.0" cy="78.4920634920635" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="995.5555555555555" cy="72.14285714285714" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1021.1111111111111" cy="64.20634920634922" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1046.6666666666667" cy="49.92063492063492" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1072.2222222222222" cy="49.92063492063492" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1097.7777777777778" cy="49.92063492063492" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1123.3333333333333" cy="41.98412698412699" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1148.888888888889" cy="34.04761904761905" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1174.4444444444443" cy="34.04761904761905" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1200.0" cy="34.04761904761905" r="4" stroke="black" stroke-width="4" fill="white"></circle><g class="y-axis-line"><rect x="0" y="0" width="65" height="130" stroke="transparent" stroke-width="0" fill="transparent"></rect><text x="0" y="19.0" fill="transparent" stroke="transparent" font-size="25">100</text><text x="0" y="126.0" fill="transparent" stroke="transparent" font-size="25">37.0</text></g><g class="vert-line"><rect x="40.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="60.0" y="20" fill="transparent" stroke="transparent" font-size="30px">60.0</text></g><g class="vert-line"><rect x="65.55555555555556" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="85.55555555555556" y="20" fill="transparent" stroke="transparent" font-size="30px">56.0</text></g><g class="vert-line"><rect x="91.11111111111111" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="111.11111111111111" y="20" fill="transparent" stroke="transparent" font-size="30px">56.0</text></g><g class="vert-line"><rect x="116.66666666666667" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="136.66666666666669" y="20" fill="transparent" stroke="transparent" font-size="30px">53.0</text></g><g class="vert-line"><rect x="142.22222222222223" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="162.22222222222223" y="20" fill="transparent" stroke="transparent" font-size="30px">53.0</text></g><g class="vert-line"><rect x="167.77777777777777" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="187.77777777777777" y="20" fill="transparent" stroke="transparent" font-size="30px">53.0</text></g><g class="vert-line"><rect x="193.33333333333334" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="213.33333333333334" y="20" fill="transparent" stroke="transparent" font-size="30px">53.0</text></g><g class="vert-line"><rect x="218.88888888888889" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="238.88888888888889" y="20" fill="transparent" stroke="transparent" font-size="30px">53.0</text></g><g class="vert-line"><rect x="244.44444444444446" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="264.44444444444446" y="20" fill="transparent" stroke="transparent" font-size="30px">56.0</text></g><g class="vert-line"><rect x="270.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="290.0" y="20" fill="transparent" stroke="transparent" font-size="30px">64.0</text></g><g class="vert-line"><rect x="295.55555555555554" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="315.55555555555554" y="20" fill="transparent" stroke="transparent" font-size="30px">64.0</text></g><g class="vert-line"><rect x="321.1111111111111" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="341.1111111111111" y="20" fill="transparent" stroke="transparent" font-size="30px">82.0</text></g><g class="vert-line"><rect x="346.6666666666667" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="366.6666666666667" y="20" fill="transparent" stroke="transparent" font-size="30px">94.0</text></g><g class="vert-line"><rect x="372.2222222222222" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="392.2222222222222" y="20" fill="transparent" stroke="transparent" font-size="30px">94.0</text></g><g class="vert-line"><rect x="397.77777777777777" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="417.77777777777777" y="20" fill="transparent" stroke="transparent" font-size="30px">94.0</text></g><g class="vert-line"><rect x="423.3333333333333" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="443.3333333333333" y="20" fill="transparent" stroke="transparent" font-size="30px">88.0</text></g><g class="vert-line"><rect x="448.8888888888889" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="468.8888888888889" y="20" fill="transparent" stroke="transparent" font-size="30px">88.0</text></g><g class="vert-line"><rect x="474.44444444444446" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="494.44444444444446" y="20" fill="transparent" stroke="transparent" font-size="30px">88.0</text></g><g class="vert-line"><rect x="500.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="520.0" y="20" fill="transparent" stroke="transparent" font-size="30px">88.0</text></g><g class="vert-line"><rect x="525.5555555555555" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="545.5555555555555" y="20" fill="transparent" stroke="transparent" font-size="30px">88.0</text></g><g class="vert-line"><rect x="551.1111111111111" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="571.1111111111111" y="20" fill="transparent" stroke="transparent" font-size="30px">88.0</text></g><g class="vert-line"><rect x="576.6666666666666" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="596.6666666666666" y="20" fill="transparent" stroke="transparent" font-size="30px">83.0</text></g><g class="vert-line"><rect x="602.2222222222222" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="622.2222222222222" y="20" fill="transparent" stroke="transparent" font-size="30px">83.0</text></g><g class="vert-line"><rect x="627.7777777777777" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="647.7777777777777" y="20" fill="transparent" stroke="transparent" font-size="30px">83.0</text></g><g class="vert-line"><rect x="653.3333333333334" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="673.3333333333334" y="20" fill="transparent" stroke="transparent" font-size="30px">83.0</text></g><g class="vert-line"><rect x="678.8888888888889" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="698.8888888888889" y="20" fill="transparent" stroke="transparent" font-size="30px">78.0</text></g><g class="vert-line"><rect x="704.4444444444443" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="724.4444444444443" y="20" fill="transparent" stroke="transparent" font-size="30px">78.0</text></g><g class="vert-line"><rect x="730.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="750.0" y="20" fill="transparent" stroke="transparent" font-size="30px">78.0</text></g><g class="vert-line"><rect x="755.5555555555555" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="775.5555555555555" y="20" fill="transparent" stroke="transparent" font-size="30px">73.0</text></g><g class="vert-line"><rect x="781.1111111111112" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="801.1111111111112" y="20" fill="transparent" stroke="transparent" font-size="30px">73.0</text></g><g class="vert-line"><rect x="806.6666666666666" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="826.6666666666666" y="20" fill="transparent" stroke="transparent" font-size="30px">78.0</text></g><g class="vert-line"><rect x="832.2222222222222" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="852.2222222222222" y="20" fill="transparent" stroke="transparent" font-size="30px">57.0</text></g><g class="vert-line"><rect x="857.7777777777778" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="877.7777777777778" y="20" fill="transparent" stroke="transparent" font-size="30px">54.0</text></g><g class="vert-line"><rect x="883.3333333333333" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="903.3333333333333" y="20" fill="transparent" stroke="transparent" font-size="30px">53.0</text></g><g class="vert-line"><rect x="908.8888888888889" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="928.8888888888889" y="20" fill="transparent" stroke="transparent" font-size="30px">57.0</text></g><g class="vert-line"><rect x="934.4444444444445" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="954.4444444444445" y="20" fill="transparent" stroke="transparent" font-size="30px">57.0</text></g><g class="vert-line"><rect x="960.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="980.0" y="20" fill="transparent" stroke="transparent" font-size="30px">60.0</text></g><g class="vert-line"><rect x="985.5555555555555" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1005.5555555555555" y="20" fill="transparent" stroke="transparent" font-size="30px">64.0</text></g><g class="vert-line"><rect x="1011.1111111111111" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1031.111111111111" y="20" fill="transparent" stroke="transparent" font-size="30px">69.0</text></g><g class="vert-line"><rect x="1036.6666666666667" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1056.6666666666667" y="20" fill="transparent" stroke="transparent" font-size="30px">78.0</text></g><g class="vert-line"><rect x="1062.2222222222222" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1082.2222222222222" y="20" fill="transparent" stroke="transparent" font-size="30px">78.0</text></g><g class="vert-line"><rect x="1087.7777777777778" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1107.7777777777778" y="20" fill="transparent" stroke="transparent" font-size="30px">78.0</text></g><g class="vert-line"><rect x="1113.3333333333333" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1133.3333333333333" y="20" fill="transparent" stroke="transparent" font-size="30px">83.0</text></g><g class="vert-line"><rect x="1138.888888888889" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1158.888888888889" y="20" fill="transparent" stroke="transparent" font-size="30px">88.0</text></g><g class="vert-line"><rect x="1164.4444444444443" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1184.4444444444443" y="20" fill="transparent" stroke="transparent" font-size="30px">88.0</text></g><g class="vert-line"><rect x="1190.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1210.0" y="20" fill="transparent" stroke="transparent" font-size="30px">88.0</text></g></svg></div></td>
  </tr>
  <tr>
    <td class="gt_row gt_left">Sat, May 6, 2023</td>
    <td class="gt_row gt_left"><div><svg viewbox="0 0 1150 130" style="height: 2em; margin-left: auto; margin-right: auto; font-size: inherit; overflow: visible; vertical-align: middle; position:relative;"><defs><pattern id="area_pattern" width="8" height="8" patternunits="userSpaceOnUse"><path class="pattern-line" d="M 0,8 l 8,-8 M -1,1 l 4,-4 M 6,10 l 4,-4" stroke="#FF0000" stroke-width="1.5" stroke-linecap="round" shape-rendering="geometricPrecision"></path></pattern></defs><style> text { font-family: ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace; stroke-width: 0.15em; paint-order: stroke; stroke-linejoin: round; cursor: default; } .vert-line:hover rect { fill: #911EB4; fill-opacity: 40%; stroke: #FFFFFF60; color: red; } .vert-line:hover text { stroke: white; fill: #212427; } .horizontal-line:hover text {stroke: white; fill: #212427; } .ref-line:hover rect { stroke: #FFFFFF60; } .ref-line:hover line { stroke: #FF0000; } .ref-line:hover text { stroke: white; fill: #212427; } .y-axis-line:hover rect { fill: #EDEDED; fill-opacity: 60%; stroke: #FFFFFF60; color: red; } .y-axis-line:hover text { stroke: white; stroke-width: 0.20em; fill: #1A1C1F; } </style><path d="M 50.0,94.85611510791368 C 62.5,94.85611510791368 63.109756097560975,94.85611510791368 75.60975609756098,94.85611510791368 C 88.10975609756098,94.85611510791368 88.71951219512195,94.85611510791368 101.21951219512195,94.85611510791368 C 113.71951219512195,94.85611510791368 114.32926829268293,94.85611510791368 126.82926829268293,94.85611510791368 C 139.3292682926829,94.85611510791368 139.9390243902439,102.76978417266189 152.4390243902439,102.76978417266189 C 164.9390243902439,102.76978417266189 165.54878048780486,102.76978417266189 178.04878048780486,102.76978417266189 C 190.54878048780486,102.76978417266189 191.15853658536585,102.76978417266189 203.65853658536585,102.76978417266189 C 216.15853658536585,102.76978417266189 216.76829268292684,107.08633093525181 229.26829268292684,107.08633093525181 C 241.76829268292684,107.08633093525181 242.3780487804878,107.08633093525181 254.8780487804878,107.08633093525181 C 267.3780487804878,107.08633093525181 267.9878048780488,102.76978417266189 280.4878048780488,102.76978417266189 C 292.9878048780488,102.76978417266189 293.5975609756097,107.08633093525181 306.0975609756097,107.08633093525181 C 318.5975609756097,107.08633093525181 319.20731707317077,107.08633093525181 331.70731707317077,107.08633093525181 C 344.20731707317077,107.08633093525181 344.8170731707317,102.76978417266189 357.3170731707317,102.76978417266189 C 369.8170731707317,102.76978417266189 370.4268292682927,94.85611510791368 382.9268292682927,94.85611510791368 C 395.4268292682927,94.85611510791368 396.0365853658537,86.94244604316548 408.5365853658537,86.94244604316548 C 421.0365853658537,86.94244604316548 421.6463414634146,79.02877697841727 434.1463414634146,79.02877697841727 C 446.6463414634146,79.02877697841727 447.2560975609756,71.11510791366908 459.7560975609756,71.11510791366908 C 472.2560975609756,71.11510791366908 472.86585365853654,71.11510791366908 485.36585365853654,71.11510791366908 C 497.86585365853654,71.11510791366908 498.4756097560976,58.88489208633095 510.9756097560976,58.88489208633095 C 523.4756097560976,58.88489208633095 524.0853658536586,58.88489208633095 536.5853658536586,58.88489208633095 C 549.0853658536586,58.88489208633095 549.6951219512194,66.79856115107913 562.1951219512194,66.79856115107913 C 574.6951219512194,66.79856115107913 575.3048780487806,66.79856115107913 587.8048780487806,66.79856115107913 C 600.3048780487806,66.79856115107913 600.9146341463415,66.79856115107913 613.4146341463415,66.79856115107913 C 625.9146341463415,66.79856115107913 626.5243902439025,66.79856115107913 639.0243902439025,66.79856115107913 C 651.5243902439025,66.79856115107913 652.1341463414634,58.88489208633095 664.6341463414634,58.88489208633095 C 677.1341463414634,58.88489208633095 677.7439024390244,50.97122302158273 690.2439024390244,50.97122302158273 C 702.7439024390244,50.97122302158273 703.3536585365854,58.88489208633095 715.8536585365854,58.88489208633095 C 728.3536585365854,58.88489208633095 728.9634146341464,50.97122302158273 741.4634146341464,50.97122302158273 C 753.9634146341464,50.97122302158273 754.5731707317074,50.97122302158273 767.0731707317074,50.97122302158273 C 779.5731707317074,50.97122302158273 780.1829268292682,50.97122302158273 792.6829268292682,50.97122302158273 C 805.1829268292682,50.97122302158273 805.7926829268292,50.97122302158273 818.2926829268292,50.97122302158273 C 830.7926829268292,50.97122302158273 831.4024390243902,50.97122302158273 843.9024390243902,50.97122302158273 C 856.4024390243902,50.97122302158273 857.0121951219512,66.79856115107913 869.5121951219512,66.79856115107913 C 882.0121951219512,66.79856115107913 882.6219512195122,66.79856115107913 895.1219512195122,66.79856115107913 C 907.6219512195122,66.79856115107913 908.2317073170731,66.79856115107913 920.7317073170731,66.79856115107913 C 933.2317073170731,66.79856115107913 933.8414634146342,71.11510791366908 946.3414634146342,71.11510791366908 C 958.8414634146342,71.11510791366908 959.4512195121952,79.02877697841727 971.9512195121952,79.02877697841727 C 984.4512195121952,79.02877697841727 985.0609756097562,79.02877697841727 997.5609756097562,79.02877697841727 C 1010.0609756097562,79.02877697841727 1010.6707317073171,79.02877697841727 1023.1707317073171,79.02877697841727 C 1035.6707317073171,79.02877697841727 1036.280487804878,79.02877697841727 1048.780487804878,79.02877697841727 C 1061.280487804878,79.02877697841727 1061.890243902439,86.94244604316548 1074.390243902439,86.94244604316548 C 1086.890243902439,86.94244604316548 1087.5,86.94244604316548 1100.0,86.94244604316548" stroke="gray" stroke-width="4" fill="none"></path><circle cx="50.0" cy="94.85611510791368" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="75.60975609756098" cy="94.85611510791368" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="101.21951219512195" cy="94.85611510791368" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="126.82926829268293" cy="94.85611510791368" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="152.4390243902439" cy="102.76978417266189" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="178.04878048780486" cy="102.76978417266189" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="203.65853658536585" cy="102.76978417266189" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="229.26829268292684" cy="107.08633093525181" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="254.8780487804878" cy="107.08633093525181" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="280.4878048780488" cy="102.76978417266189" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="306.0975609756097" cy="107.08633093525181" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="331.70731707317077" cy="107.08633093525181" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="357.3170731707317" cy="102.76978417266189" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="382.9268292682927" cy="94.85611510791368" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="408.5365853658537" cy="86.94244604316548" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="434.1463414634146" cy="79.02877697841727" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="459.7560975609756" cy="71.11510791366908" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="485.36585365853654" cy="71.11510791366908" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="510.9756097560976" cy="58.88489208633095" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="536.5853658536586" cy="58.88489208633095" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="562.1951219512194" cy="66.79856115107913" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="587.8048780487806" cy="66.79856115107913" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="613.4146341463415" cy="66.79856115107913" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="639.0243902439025" cy="66.79856115107913" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="664.6341463414634" cy="58.88489208633095" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="690.2439024390244" cy="50.97122302158273" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="715.8536585365854" cy="58.88489208633095" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="741.4634146341464" cy="50.97122302158273" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="767.0731707317074" cy="50.97122302158273" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="792.6829268292682" cy="50.97122302158273" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="818.2926829268292" cy="50.97122302158273" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="843.9024390243902" cy="50.97122302158273" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="869.5121951219512" cy="66.79856115107913" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="895.1219512195122" cy="66.79856115107913" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="920.7317073170731" cy="66.79856115107913" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="946.3414634146342" cy="71.11510791366908" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="971.9512195121952" cy="79.02877697841727" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="997.5609756097562" cy="79.02877697841727" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1023.1707317073171" cy="79.02877697841727" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1048.780487804878" cy="79.02877697841727" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1074.390243902439" cy="86.94244604316548" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1100.0" cy="86.94244604316548" r="4" stroke="black" stroke-width="4" fill="white"></circle><g class="y-axis-line"><rect x="0" y="0" width="65" height="130" stroke="transparent" stroke-width="0" fill="transparent"></rect><text x="0" y="19.0" fill="transparent" stroke="transparent" font-size="25">30.0</text><text x="0" y="126.0" fill="transparent" stroke="transparent" font-size="25">16.1</text></g><g class="vert-line"><rect x="40.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="60.0" y="20" fill="transparent" stroke="transparent" font-size="30px">18.9</text></g><g class="vert-line"><rect x="65.60975609756098" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="85.60975609756098" y="20" fill="transparent" stroke="transparent" font-size="30px">18.9</text></g><g class="vert-line"><rect x="91.21951219512195" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="111.21951219512195" y="20" fill="transparent" stroke="transparent" font-size="30px">18.9</text></g><g class="vert-line"><rect x="116.82926829268293" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="136.8292682926829" y="20" fill="transparent" stroke="transparent" font-size="30px">18.9</text></g><g class="vert-line"><rect x="142.4390243902439" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="162.4390243902439" y="20" fill="transparent" stroke="transparent" font-size="30px">17.8</text></g><g class="vert-line"><rect x="168.04878048780486" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="188.04878048780486" y="20" fill="transparent" stroke="transparent" font-size="30px">17.8</text></g><g class="vert-line"><rect x="193.65853658536585" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="213.65853658536585" y="20" fill="transparent" stroke="transparent" font-size="30px">17.8</text></g><g class="vert-line"><rect x="219.26829268292684" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="239.26829268292684" y="20" fill="transparent" stroke="transparent" font-size="30px">17.2</text></g><g class="vert-line"><rect x="244.8780487804878" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="264.8780487804878" y="20" fill="transparent" stroke="transparent" font-size="30px">17.2</text></g><g class="vert-line"><rect x="270.4878048780488" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="290.4878048780488" y="20" fill="transparent" stroke="transparent" font-size="30px">17.8</text></g><g class="vert-line"><rect x="296.0975609756097" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="316.0975609756097" y="20" fill="transparent" stroke="transparent" font-size="30px">17.2</text></g><g class="vert-line"><rect x="321.70731707317077" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="341.70731707317077" y="20" fill="transparent" stroke="transparent" font-size="30px">17.2</text></g><g class="vert-line"><rect x="347.3170731707317" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="367.3170731707317" y="20" fill="transparent" stroke="transparent" font-size="30px">17.8</text></g><g class="vert-line"><rect x="372.9268292682927" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="392.9268292682927" y="20" fill="transparent" stroke="transparent" font-size="30px">18.9</text></g><g class="vert-line"><rect x="398.5365853658537" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="418.5365853658537" y="20" fill="transparent" stroke="transparent" font-size="30px">20.0</text></g><g class="vert-line"><rect x="424.1463414634146" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="444.1463414634146" y="20" fill="transparent" stroke="transparent" font-size="30px">21.1</text></g><g class="vert-line"><rect x="449.7560975609756" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="469.7560975609756" y="20" fill="transparent" stroke="transparent" font-size="30px">22.2</text></g><g class="vert-line"><rect x="475.36585365853654" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="495.36585365853654" y="20" fill="transparent" stroke="transparent" font-size="30px">22.2</text></g><g class="vert-line"><rect x="500.9756097560976" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="520.9756097560976" y="20" fill="transparent" stroke="transparent" font-size="30px">23.9</text></g><g class="vert-line"><rect x="526.5853658536586" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="546.5853658536586" y="20" fill="transparent" stroke="transparent" font-size="30px">23.9</text></g><g class="vert-line"><rect x="552.1951219512194" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="572.1951219512194" y="20" fill="transparent" stroke="transparent" font-size="30px">22.8</text></g><g class="vert-line"><rect x="577.8048780487806" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="597.8048780487806" y="20" fill="transparent" stroke="transparent" font-size="30px">22.8</text></g><g class="vert-line"><rect x="603.4146341463415" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="623.4146341463415" y="20" fill="transparent" stroke="transparent" font-size="30px">22.8</text></g><g class="vert-line"><rect x="629.0243902439025" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="649.0243902439025" y="20" fill="transparent" stroke="transparent" font-size="30px">22.8</text></g><g class="vert-line"><rect x="654.6341463414634" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="674.6341463414634" y="20" fill="transparent" stroke="transparent" font-size="30px">23.9</text></g><g class="vert-line"><rect x="680.2439024390244" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="700.2439024390244" y="20" fill="transparent" stroke="transparent" font-size="30px">25.0</text></g><g class="vert-line"><rect x="705.8536585365854" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="725.8536585365854" y="20" fill="transparent" stroke="transparent" font-size="30px">23.9</text></g><g class="vert-line"><rect x="731.4634146341464" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="751.4634146341464" y="20" fill="transparent" stroke="transparent" font-size="30px">25.0</text></g><g class="vert-line"><rect x="757.0731707317074" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="777.0731707317074" y="20" fill="transparent" stroke="transparent" font-size="30px">25.0</text></g><g class="vert-line"><rect x="782.6829268292682" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="802.6829268292682" y="20" fill="transparent" stroke="transparent" font-size="30px">25.0</text></g><g class="vert-line"><rect x="808.2926829268292" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="828.2926829268292" y="20" fill="transparent" stroke="transparent" font-size="30px">25.0</text></g><g class="vert-line"><rect x="833.9024390243902" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="853.9024390243902" y="20" fill="transparent" stroke="transparent" font-size="30px">25.0</text></g><g class="vert-line"><rect x="859.5121951219512" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="879.5121951219512" y="20" fill="transparent" stroke="transparent" font-size="30px">22.8</text></g><g class="vert-line"><rect x="885.1219512195122" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="905.1219512195122" y="20" fill="transparent" stroke="transparent" font-size="30px">22.8</text></g><g class="vert-line"><rect x="910.7317073170731" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="930.7317073170731" y="20" fill="transparent" stroke="transparent" font-size="30px">22.8</text></g><g class="vert-line"><rect x="936.3414634146342" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="956.3414634146342" y="20" fill="transparent" stroke="transparent" font-size="30px">22.2</text></g><g class="vert-line"><rect x="961.9512195121952" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="981.9512195121952" y="20" fill="transparent" stroke="transparent" font-size="30px">21.1</text></g><g class="vert-line"><rect x="987.5609756097562" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1007.5609756097562" y="20" fill="transparent" stroke="transparent" font-size="30px">21.1</text></g><g class="vert-line"><rect x="1013.1707317073171" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1033.1707317073171" y="20" fill="transparent" stroke="transparent" font-size="30px">21.1</text></g><g class="vert-line"><rect x="1038.780487804878" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1058.780487804878" y="20" fill="transparent" stroke="transparent" font-size="30px">21.1</text></g><g class="vert-line"><rect x="1064.390243902439" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1084.390243902439" y="20" fill="transparent" stroke="transparent" font-size="30px">20.0</text></g><g class="vert-line"><rect x="1090.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1110.0" y="20" fill="transparent" stroke="transparent" font-size="30px">20.0</text></g></svg></div></td>
    <td class="gt_row gt_left"><div><svg viewbox="0 0 1150 130" style="height: 2em; margin-left: auto; margin-right: auto; font-size: inherit; overflow: visible; vertical-align: middle; position:relative;"><defs><pattern id="area_pattern" width="8" height="8" patternunits="userSpaceOnUse"><path class="pattern-line" d="M 0,8 l 8,-8 M -1,1 l 4,-4 M 6,10 l 4,-4" stroke="#FF0000" stroke-width="1.5" stroke-linecap="round" shape-rendering="geometricPrecision"></path></pattern></defs><style> text { font-family: ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace; stroke-width: 0.15em; paint-order: stroke; stroke-linejoin: round; cursor: default; } .vert-line:hover rect { fill: #911EB4; fill-opacity: 40%; stroke: #FFFFFF60; color: red; } .vert-line:hover text { stroke: white; fill: #212427; } .horizontal-line:hover text {stroke: white; fill: #212427; } .ref-line:hover rect { stroke: #FFFFFF60; } .ref-line:hover line { stroke: #FF0000; } .ref-line:hover text { stroke: white; fill: #212427; } .y-axis-line:hover rect { fill: #EDEDED; fill-opacity: 60%; stroke: #FFFFFF60; color: red; } .y-axis-line:hover text { stroke: white; stroke-width: 0.20em; fill: #1A1C1F; } </style><path d="M 50.0,34.04761904761905 C 62.5,34.04761904761905 63.109756097560975,24.523809523809526 75.60975609756098,24.523809523809526 C 88.10975609756098,24.523809523809526 88.71951219512195,24.523809523809526 101.21951219512195,24.523809523809526 C 113.71951219512195,24.523809523809526 114.32926829268293,41.98412698412699 126.82926829268293,41.98412698412699 C 139.3292682926829,41.98412698412699 139.9390243902439,34.04761904761905 152.4390243902439,34.04761904761905 C 164.9390243902439,34.04761904761905 165.54878048780486,34.04761904761905 178.04878048780486,34.04761904761905 C 190.54878048780486,34.04761904761905 191.15853658536585,41.98412698412699 203.65853658536585,41.98412698412699 C 216.15853658536585,41.98412698412699 216.76829268292684,34.04761904761905 229.26829268292684,34.04761904761905 C 241.76829268292684,34.04761904761905 242.3780487804878,24.523809523809526 254.8780487804878,24.523809523809526 C 267.3780487804878,24.523809523809526 267.9878048780488,34.04761904761905 280.4878048780488,34.04761904761905 C 292.9878048780488,34.04761904761905 293.5975609756097,43.57142857142857 306.0975609756097,43.57142857142857 C 318.5975609756097,43.57142857142857 319.20731707317077,43.57142857142857 331.70731707317077,43.57142857142857 C 344.20731707317077,43.57142857142857 344.8170731707317,51.50793650793651 357.3170731707317,51.50793650793651 C 369.8170731707317,51.50793650793651 370.4268292682927,49.92063492063492 382.9268292682927,49.92063492063492 C 395.4268292682927,49.92063492063492 396.0365853658537,57.85714285714286 408.5365853658537,57.85714285714286 C 421.0365853658537,57.85714285714286 421.6463414634146,65.79365079365078 434.1463414634146,65.79365079365078 C 446.6463414634146,65.79365079365078 447.2560975609756,72.14285714285714 459.7560975609756,72.14285714285714 C 472.2560975609756,72.14285714285714 472.86585365853654,72.14285714285714 485.36585365853654,72.14285714285714 C 497.86585365853654,72.14285714285714 498.4756097560976,89.60317460317461 510.9756097560976,89.60317460317461 C 523.4756097560976,89.60317460317461 524.0853658536586,89.60317460317461 536.5853658536586,89.60317460317461 C 549.0853658536586,89.60317460317461 549.6951219512194,83.25396825396827 562.1951219512194,83.25396825396827 C 574.6951219512194,83.25396825396827 575.3048780487806,83.25396825396827 587.8048780487806,83.25396825396827 C 600.3048780487806,83.25396825396827 600.9146341463415,83.25396825396827 613.4146341463415,83.25396825396827 C 625.9146341463415,83.25396825396827 626.5243902439025,83.25396825396827 639.0243902439025,83.25396825396827 C 651.5243902439025,83.25396825396827 652.1341463414634,83.25396825396827 664.6341463414634,83.25396825396827 C 677.1341463414634,83.25396825396827 677.7439024390244,94.36507936507937 690.2439024390244,94.36507936507937 C 702.7439024390244,94.36507936507937 703.3536585365854,94.36507936507937 715.8536585365854,94.36507936507937 C 728.3536585365854,94.36507936507937 728.9634146341464,103.88888888888889 741.4634146341464,103.88888888888889 C 753.9634146341464,103.88888888888889 754.5731707317074,99.12698412698413 767.0731707317074,99.12698412698413 C 779.5731707317074,99.12698412698413 780.1829268292682,99.12698412698413 792.6829268292682,99.12698412698413 C 805.1829268292682,99.12698412698413 805.7926829268292,99.12698412698413 818.2926829268292,99.12698412698413 C 830.7926829268292,99.12698412698413 831.4024390243902,103.88888888888889 843.9024390243902,103.88888888888889 C 856.4024390243902,103.88888888888889 857.0121951219512,83.25396825396827 869.5121951219512,83.25396825396827 C 882.0121951219512,83.25396825396827 882.6219512195122,99.12698412698413 895.1219512195122,99.12698412698413 C 907.6219512195122,99.12698412698413 908.2317073170731,99.12698412698413 920.7317073170731,99.12698412698413 C 933.2317073170731,99.12698412698413 933.8414634146342,94.36507936507937 946.3414634146342,94.36507936507937 C 958.8414634146342,94.36507936507937 959.4512195121952,72.14285714285714 971.9512195121952,72.14285714285714 C 984.4512195121952,72.14285714285714 985.0609756097562,78.4920634920635 997.5609756097562,78.4920634920635 C 1010.0609756097562,78.4920634920635 1010.6707317073171,89.60317460317461 1023.1707317073171,89.60317460317461 C 1035.6707317073171,89.60317460317461 1036.280487804878,72.14285714285714 1048.780487804878,72.14285714285714 C 1061.280487804878,72.14285714285714 1061.890243902439,65.79365079365078 1074.390243902439,65.79365079365078 C 1086.890243902439,65.79365079365078 1087.5,49.92063492063492 1100.0,49.92063492063492" stroke="gray" stroke-width="4" fill="none"></path><circle cx="50.0" cy="34.04761904761905" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="75.60975609756098" cy="24.523809523809526" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="101.21951219512195" cy="24.523809523809526" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="126.82926829268293" cy="41.98412698412699" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="152.4390243902439" cy="34.04761904761905" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="178.04878048780486" cy="34.04761904761905" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="203.65853658536585" cy="41.98412698412699" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="229.26829268292684" cy="34.04761904761905" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="254.8780487804878" cy="24.523809523809526" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="280.4878048780488" cy="34.04761904761905" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="306.0975609756097" cy="43.57142857142857" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="331.70731707317077" cy="43.57142857142857" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="357.3170731707317" cy="51.50793650793651" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="382.9268292682927" cy="49.92063492063492" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="408.5365853658537" cy="57.85714285714286" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="434.1463414634146" cy="65.79365079365078" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="459.7560975609756" cy="72.14285714285714" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="485.36585365853654" cy="72.14285714285714" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="510.9756097560976" cy="89.60317460317461" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="536.5853658536586" cy="89.60317460317461" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="562.1951219512194" cy="83.25396825396827" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="587.8048780487806" cy="83.25396825396827" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="613.4146341463415" cy="83.25396825396827" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="639.0243902439025" cy="83.25396825396827" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="664.6341463414634" cy="83.25396825396827" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="690.2439024390244" cy="94.36507936507937" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="715.8536585365854" cy="94.36507936507937" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="741.4634146341464" cy="103.88888888888889" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="767.0731707317074" cy="99.12698412698413" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="792.6829268292682" cy="99.12698412698413" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="818.2926829268292" cy="99.12698412698413" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="843.9024390243902" cy="103.88888888888889" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="869.5121951219512" cy="83.25396825396827" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="895.1219512195122" cy="99.12698412698413" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="920.7317073170731" cy="99.12698412698413" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="946.3414634146342" cy="94.36507936507937" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="971.9512195121952" cy="72.14285714285714" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="997.5609756097562" cy="78.4920634920635" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1023.1707317073171" cy="89.60317460317461" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1048.780487804878" cy="72.14285714285714" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1074.390243902439" cy="65.79365079365078" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1100.0" cy="49.92063492063492" r="4" stroke="black" stroke-width="4" fill="white"></circle><g class="y-axis-line"><rect x="0" y="0" width="65" height="130" stroke="transparent" stroke-width="0" fill="transparent"></rect><text x="0" y="19.0" fill="transparent" stroke="transparent" font-size="25">100</text><text x="0" y="126.0" fill="transparent" stroke="transparent" font-size="25">37.0</text></g><g class="vert-line"><rect x="40.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="60.0" y="20" fill="transparent" stroke="transparent" font-size="30px">88.0</text></g><g class="vert-line"><rect x="65.60975609756098" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="85.60975609756098" y="20" fill="transparent" stroke="transparent" font-size="30px">94.0</text></g><g class="vert-line"><rect x="91.21951219512195" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="111.21951219512195" y="20" fill="transparent" stroke="transparent" font-size="30px">94.0</text></g><g class="vert-line"><rect x="116.82926829268293" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="136.8292682926829" y="20" fill="transparent" stroke="transparent" font-size="30px">83.0</text></g><g class="vert-line"><rect x="142.4390243902439" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="162.4390243902439" y="20" fill="transparent" stroke="transparent" font-size="30px">88.0</text></g><g class="vert-line"><rect x="168.04878048780486" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="188.04878048780486" y="20" fill="transparent" stroke="transparent" font-size="30px">88.0</text></g><g class="vert-line"><rect x="193.65853658536585" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="213.65853658536585" y="20" fill="transparent" stroke="transparent" font-size="30px">83.0</text></g><g class="vert-line"><rect x="219.26829268292684" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="239.26829268292684" y="20" fill="transparent" stroke="transparent" font-size="30px">88.0</text></g><g class="vert-line"><rect x="244.8780487804878" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="264.8780487804878" y="20" fill="transparent" stroke="transparent" font-size="30px">94.0</text></g><g class="vert-line"><rect x="270.4878048780488" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="290.4878048780488" y="20" fill="transparent" stroke="transparent" font-size="30px">88.0</text></g><g class="vert-line"><rect x="296.0975609756097" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="316.0975609756097" y="20" fill="transparent" stroke="transparent" font-size="30px">82.0</text></g><g class="vert-line"><rect x="321.70731707317077" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="341.70731707317077" y="20" fill="transparent" stroke="transparent" font-size="30px">82.0</text></g><g class="vert-line"><rect x="347.3170731707317" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="367.3170731707317" y="20" fill="transparent" stroke="transparent" font-size="30px">77.0</text></g><g class="vert-line"><rect x="372.9268292682927" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="392.9268292682927" y="20" fill="transparent" stroke="transparent" font-size="30px">78.0</text></g><g class="vert-line"><rect x="398.5365853658537" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="418.5365853658537" y="20" fill="transparent" stroke="transparent" font-size="30px">73.0</text></g><g class="vert-line"><rect x="424.1463414634146" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="444.1463414634146" y="20" fill="transparent" stroke="transparent" font-size="30px">68.0</text></g><g class="vert-line"><rect x="449.7560975609756" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="469.7560975609756" y="20" fill="transparent" stroke="transparent" font-size="30px">64.0</text></g><g class="vert-line"><rect x="475.36585365853654" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="495.36585365853654" y="20" fill="transparent" stroke="transparent" font-size="30px">64.0</text></g><g class="vert-line"><rect x="500.9756097560976" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="520.9756097560976" y="20" fill="transparent" stroke="transparent" font-size="30px">53.0</text></g><g class="vert-line"><rect x="526.5853658536586" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="546.5853658536586" y="20" fill="transparent" stroke="transparent" font-size="30px">53.0</text></g><g class="vert-line"><rect x="552.1951219512194" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="572.1951219512194" y="20" fill="transparent" stroke="transparent" font-size="30px">57.0</text></g><g class="vert-line"><rect x="577.8048780487806" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="597.8048780487806" y="20" fill="transparent" stroke="transparent" font-size="30px">57.0</text></g><g class="vert-line"><rect x="603.4146341463415" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="623.4146341463415" y="20" fill="transparent" stroke="transparent" font-size="30px">57.0</text></g><g class="vert-line"><rect x="629.0243902439025" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="649.0243902439025" y="20" fill="transparent" stroke="transparent" font-size="30px">57.0</text></g><g class="vert-line"><rect x="654.6341463414634" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="674.6341463414634" y="20" fill="transparent" stroke="transparent" font-size="30px">57.0</text></g><g class="vert-line"><rect x="680.2439024390244" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="700.2439024390244" y="20" fill="transparent" stroke="transparent" font-size="30px">50.0</text></g><g class="vert-line"><rect x="705.8536585365854" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="725.8536585365854" y="20" fill="transparent" stroke="transparent" font-size="30px">50.0</text></g><g class="vert-line"><rect x="731.4634146341464" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="751.4634146341464" y="20" fill="transparent" stroke="transparent" font-size="30px">44.0</text></g><g class="vert-line"><rect x="757.0731707317074" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="777.0731707317074" y="20" fill="transparent" stroke="transparent" font-size="30px">47.0</text></g><g class="vert-line"><rect x="782.6829268292682" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="802.6829268292682" y="20" fill="transparent" stroke="transparent" font-size="30px">47.0</text></g><g class="vert-line"><rect x="808.2926829268292" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="828.2926829268292" y="20" fill="transparent" stroke="transparent" font-size="30px">47.0</text></g><g class="vert-line"><rect x="833.9024390243902" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="853.9024390243902" y="20" fill="transparent" stroke="transparent" font-size="30px">44.0</text></g><g class="vert-line"><rect x="859.5121951219512" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="879.5121951219512" y="20" fill="transparent" stroke="transparent" font-size="30px">57.0</text></g><g class="vert-line"><rect x="885.1219512195122" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="905.1219512195122" y="20" fill="transparent" stroke="transparent" font-size="30px">47.0</text></g><g class="vert-line"><rect x="910.7317073170731" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="930.7317073170731" y="20" fill="transparent" stroke="transparent" font-size="30px">47.0</text></g><g class="vert-line"><rect x="936.3414634146342" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="956.3414634146342" y="20" fill="transparent" stroke="transparent" font-size="30px">50.0</text></g><g class="vert-line"><rect x="961.9512195121952" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="981.9512195121952" y="20" fill="transparent" stroke="transparent" font-size="30px">64.0</text></g><g class="vert-line"><rect x="987.5609756097562" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1007.5609756097562" y="20" fill="transparent" stroke="transparent" font-size="30px">60.0</text></g><g class="vert-line"><rect x="1013.1707317073171" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1033.1707317073171" y="20" fill="transparent" stroke="transparent" font-size="30px">53.0</text></g><g class="vert-line"><rect x="1038.780487804878" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1058.780487804878" y="20" fill="transparent" stroke="transparent" font-size="30px">64.0</text></g><g class="vert-line"><rect x="1064.390243902439" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1084.390243902439" y="20" fill="transparent" stroke="transparent" font-size="30px">68.0</text></g><g class="vert-line"><rect x="1090.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1110.0" y="20" fill="transparent" stroke="transparent" font-size="30px">78.0</text></g></svg></div></td>
  </tr>
  <tr>
    <td class="gt_row gt_left">Sun, May 7, 2023</td>
    <td class="gt_row gt_left"><div><svg viewbox="0 0 1225 130" style="height: 2em; margin-left: auto; margin-right: auto; font-size: inherit; overflow: visible; vertical-align: middle; position:relative;"><defs><pattern id="area_pattern" width="8" height="8" patternunits="userSpaceOnUse"><path class="pattern-line" d="M 0,8 l 8,-8 M -1,1 l 4,-4 M 6,10 l 4,-4" stroke="#FF0000" stroke-width="1.5" stroke-linecap="round" shape-rendering="geometricPrecision"></path></pattern></defs><style> text { font-family: ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace; stroke-width: 0.15em; paint-order: stroke; stroke-linejoin: round; cursor: default; } .vert-line:hover rect { fill: #911EB4; fill-opacity: 40%; stroke: #FFFFFF60; color: red; } .vert-line:hover text { stroke: white; fill: #212427; } .horizontal-line:hover text {stroke: white; fill: #212427; } .ref-line:hover rect { stroke: #FFFFFF60; } .ref-line:hover line { stroke: #FF0000; } .ref-line:hover text { stroke: white; fill: #212427; } .y-axis-line:hover rect { fill: #EDEDED; fill-opacity: 60%; stroke: #FFFFFF60; color: red; } .y-axis-line:hover text { stroke: white; stroke-width: 0.20em; fill: #1A1C1F; } </style><path d="M 50.0,86.94244604316548 C 62.5,86.94244604316548 63.06818181818181,86.94244604316548 75.56818181818181,86.94244604316548 C 88.06818181818181,86.94244604316548 88.63636363636364,94.85611510791368 101.13636363636364,94.85611510791368 C 113.63636363636364,94.85611510791368 114.20454545454545,86.94244604316548 126.70454545454545,86.94244604316548 C 139.20454545454544,86.94244604316548 139.77272727272728,86.94244604316548 152.27272727272728,86.94244604316548 C 164.77272727272728,86.94244604316548 165.3409090909091,86.94244604316548 177.8409090909091,86.94244604316548 C 190.3409090909091,86.94244604316548 190.9090909090909,86.94244604316548 203.4090909090909,86.94244604316548 C 215.9090909090909,86.94244604316548 216.47727272727272,86.94244604316548 228.97727272727272,86.94244604316548 C 241.47727272727272,86.94244604316548 242.04545454545456,86.94244604316548 254.54545454545456,86.94244604316548 C 267.04545454545456,86.94244604316548 267.6136363636364,79.02877697841727 280.1136363636364,79.02877697841727 C 292.6136363636364,79.02877697841727 293.1818181818182,86.94244604316548 305.6818181818182,86.94244604316548 C 318.1818181818182,86.94244604316548 318.75,86.94244604316548 331.25,86.94244604316548 C 343.75,86.94244604316548 344.3181818181818,86.94244604316548 356.8181818181818,86.94244604316548 C 369.3181818181818,86.94244604316548 369.8863636363636,86.94244604316548 382.3863636363636,86.94244604316548 C 394.8863636363636,86.94244604316548 395.45454545454544,86.94244604316548 407.95454545454544,86.94244604316548 C 420.45454545454544,86.94244604316548 421.02272727272725,86.94244604316548 433.52272727272725,86.94244604316548 C 446.02272727272725,86.94244604316548 446.5909090909091,79.02877697841727 459.0909090909091,79.02877697841727 C 471.5909090909091,79.02877697841727 472.1590909090909,79.02877697841727 484.6590909090909,79.02877697841727 C 497.1590909090909,79.02877697841727 497.72727272727275,71.11510791366908 510.22727272727275,71.11510791366908 C 522.7272727272727,71.11510791366908 523.2954545454545,66.79856115107913 535.7954545454545,66.79856115107913 C 548.2954545454545,66.79856115107913 548.8636363636364,58.88489208633095 561.3636363636364,58.88489208633095 C 573.8636363636364,58.88489208633095 574.4318181818182,50.97122302158273 586.9318181818182,50.97122302158273 C 599.4318181818182,50.97122302158273 600.0,43.057553956834525 612.5,43.057553956834525 C 625.0,43.057553956834525 625.5681818181818,43.057553956834525 638.0681818181818,43.057553956834525 C 650.5681818181818,43.057553956834525 651.1363636363636,43.057553956834525 663.6363636363636,43.057553956834525 C 676.1363636363636,43.057553956834525 676.7045454545455,50.97122302158273 689.2045454545455,50.97122302158273 C 701.7045454545455,50.97122302158273 702.2727272727273,66.79856115107913 714.7727272727273,66.79856115107913 C 727.2727272727273,66.79856115107913 727.8409090909091,66.79856115107913 740.3409090909091,66.79856115107913 C 752.8409090909091,66.79856115107913 753.4090909090909,58.88489208633095 765.9090909090909,58.88489208633095 C 778.4090909090909,58.88489208633095 778.9772727272727,58.88489208633095 791.4772727272727,58.88489208633095 C 803.9772727272727,58.88489208633095 804.5454545454545,66.79856115107913 817.0454545454545,66.79856115107913 C 829.5454545454545,66.79856115107913 830.1136363636364,66.79856115107913 842.6136363636364,66.79856115107913 C 855.1136363636364,66.79856115107913 855.6818181818182,58.88489208633095 868.1818181818182,58.88489208633095 C 880.6818181818182,58.88489208633095 881.25,58.88489208633095 893.75,58.88489208633095 C 906.25,58.88489208633095 906.8181818181818,66.79856115107913 919.3181818181818,66.79856115107913 C 931.8181818181818,66.79856115107913 932.3863636363636,58.88489208633095 944.8863636363636,58.88489208633095 C 957.3863636363636,58.88489208633095 957.9545454545455,66.79856115107913 970.4545454545455,66.79856115107913 C 982.9545454545455,66.79856115107913 983.5227272727273,66.79856115107913 996.0227272727273,66.79856115107913 C 1008.5227272727273,66.79856115107913 1009.0909090909091,71.11510791366908 1021.5909090909091,71.11510791366908 C 1034.090909090909,71.11510791366908 1034.659090909091,66.79856115107913 1047.159090909091,66.79856115107913 C 1059.659090909091,66.79856115107913 1060.2272727272727,58.88489208633095 1072.7272727272727,58.88489208633095 C 1085.2272727272727,58.88489208633095 1085.7954545454545,58.88489208633095 1098.2954545454545,58.88489208633095 C 1110.7954545454545,58.88489208633095 1111.3636363636365,58.88489208633095 1123.8636363636365,58.88489208633095 C 1136.3636363636365,58.88489208633095 1136.9318181818182,66.79856115107913 1149.4318181818182,66.79856115107913 C 1161.9318181818182,66.79856115107913 1162.5,66.79856115107913 1175.0,66.79856115107913" stroke="gray" stroke-width="4" fill="none"></path><circle cx="50.0" cy="86.94244604316548" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="75.56818181818181" cy="86.94244604316548" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="101.13636363636364" cy="94.85611510791368" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="126.70454545454545" cy="86.94244604316548" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="152.27272727272728" cy="86.94244604316548" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="177.8409090909091" cy="86.94244604316548" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="203.4090909090909" cy="86.94244604316548" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="228.97727272727272" cy="86.94244604316548" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="254.54545454545456" cy="86.94244604316548" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="280.1136363636364" cy="79.02877697841727" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="305.6818181818182" cy="86.94244604316548" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="331.25" cy="86.94244604316548" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="356.8181818181818" cy="86.94244604316548" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="382.3863636363636" cy="86.94244604316548" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="407.95454545454544" cy="86.94244604316548" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="433.52272727272725" cy="86.94244604316548" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="459.0909090909091" cy="79.02877697841727" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="484.6590909090909" cy="79.02877697841727" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="510.22727272727275" cy="71.11510791366908" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="535.7954545454545" cy="66.79856115107913" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="561.3636363636364" cy="58.88489208633095" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="586.9318181818182" cy="50.97122302158273" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="612.5" cy="43.057553956834525" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="638.0681818181818" cy="43.057553956834525" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="663.6363636363636" cy="43.057553956834525" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="689.2045454545455" cy="50.97122302158273" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="714.7727272727273" cy="66.79856115107913" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="740.3409090909091" cy="66.79856115107913" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="765.9090909090909" cy="58.88489208633095" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="791.4772727272727" cy="58.88489208633095" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="817.0454545454545" cy="66.79856115107913" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="842.6136363636364" cy="66.79856115107913" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="868.1818181818182" cy="58.88489208633095" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="893.75" cy="58.88489208633095" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="919.3181818181818" cy="66.79856115107913" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="944.8863636363636" cy="58.88489208633095" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="970.4545454545455" cy="66.79856115107913" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="996.0227272727273" cy="66.79856115107913" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1021.5909090909091" cy="71.11510791366908" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1047.159090909091" cy="66.79856115107913" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1072.7272727272727" cy="58.88489208633095" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1098.2954545454545" cy="58.88489208633095" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1123.8636363636365" cy="58.88489208633095" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1149.4318181818182" cy="66.79856115107913" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1175.0" cy="66.79856115107913" r="4" stroke="black" stroke-width="4" fill="white"></circle><g class="y-axis-line"><rect x="0" y="0" width="65" height="130" stroke="transparent" stroke-width="0" fill="transparent"></rect><text x="0" y="19.0" fill="transparent" stroke="transparent" font-size="25">30.0</text><text x="0" y="126.0" fill="transparent" stroke="transparent" font-size="25">16.1</text></g><g class="vert-line"><rect x="40.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="60.0" y="20" fill="transparent" stroke="transparent" font-size="30px">20.0</text></g><g class="vert-line"><rect x="65.56818181818181" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="85.56818181818181" y="20" fill="transparent" stroke="transparent" font-size="30px">20.0</text></g><g class="vert-line"><rect x="91.13636363636364" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="111.13636363636364" y="20" fill="transparent" stroke="transparent" font-size="30px">18.9</text></g><g class="vert-line"><rect x="116.70454545454545" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="136.70454545454544" y="20" fill="transparent" stroke="transparent" font-size="30px">20.0</text></g><g class="vert-line"><rect x="142.27272727272728" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="162.27272727272728" y="20" fill="transparent" stroke="transparent" font-size="30px">20.0</text></g><g class="vert-line"><rect x="167.8409090909091" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="187.8409090909091" y="20" fill="transparent" stroke="transparent" font-size="30px">20.0</text></g><g class="vert-line"><rect x="193.4090909090909" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="213.4090909090909" y="20" fill="transparent" stroke="transparent" font-size="30px">20.0</text></g><g class="vert-line"><rect x="218.97727272727272" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="238.97727272727272" y="20" fill="transparent" stroke="transparent" font-size="30px">20.0</text></g><g class="vert-line"><rect x="244.54545454545456" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="264.54545454545456" y="20" fill="transparent" stroke="transparent" font-size="30px">20.0</text></g><g class="vert-line"><rect x="270.1136363636364" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="290.1136363636364" y="20" fill="transparent" stroke="transparent" font-size="30px">21.1</text></g><g class="vert-line"><rect x="295.6818181818182" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="315.6818181818182" y="20" fill="transparent" stroke="transparent" font-size="30px">20.0</text></g><g class="vert-line"><rect x="321.25" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="341.25" y="20" fill="transparent" stroke="transparent" font-size="30px">20.0</text></g><g class="vert-line"><rect x="346.8181818181818" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="366.8181818181818" y="20" fill="transparent" stroke="transparent" font-size="30px">20.0</text></g><g class="vert-line"><rect x="372.3863636363636" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="392.3863636363636" y="20" fill="transparent" stroke="transparent" font-size="30px">20.0</text></g><g class="vert-line"><rect x="397.95454545454544" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="417.95454545454544" y="20" fill="transparent" stroke="transparent" font-size="30px">20.0</text></g><g class="vert-line"><rect x="423.52272727272725" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="443.52272727272725" y="20" fill="transparent" stroke="transparent" font-size="30px">20.0</text></g><g class="vert-line"><rect x="449.0909090909091" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="469.0909090909091" y="20" fill="transparent" stroke="transparent" font-size="30px">21.1</text></g><g class="vert-line"><rect x="474.6590909090909" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="494.6590909090909" y="20" fill="transparent" stroke="transparent" font-size="30px">21.1</text></g><g class="vert-line"><rect x="500.22727272727275" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="520.2272727272727" y="20" fill="transparent" stroke="transparent" font-size="30px">22.2</text></g><g class="vert-line"><rect x="525.7954545454545" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="545.7954545454545" y="20" fill="transparent" stroke="transparent" font-size="30px">22.8</text></g><g class="vert-line"><rect x="551.3636363636364" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="571.3636363636364" y="20" fill="transparent" stroke="transparent" font-size="30px">23.9</text></g><g class="vert-line"><rect x="576.9318181818182" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="596.9318181818182" y="20" fill="transparent" stroke="transparent" font-size="30px">25.0</text></g><g class="vert-line"><rect x="602.5" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="622.5" y="20" fill="transparent" stroke="transparent" font-size="30px">26.1</text></g><g class="vert-line"><rect x="628.0681818181818" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="648.0681818181818" y="20" fill="transparent" stroke="transparent" font-size="30px">26.1</text></g><g class="vert-line"><rect x="653.6363636363636" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="673.6363636363636" y="20" fill="transparent" stroke="transparent" font-size="30px">26.1</text></g><g class="vert-line"><rect x="679.2045454545455" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="699.2045454545455" y="20" fill="transparent" stroke="transparent" font-size="30px">25.0</text></g><g class="vert-line"><rect x="704.7727272727273" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="724.7727272727273" y="20" fill="transparent" stroke="transparent" font-size="30px">22.8</text></g><g class="vert-line"><rect x="730.3409090909091" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="750.3409090909091" y="20" fill="transparent" stroke="transparent" font-size="30px">22.8</text></g><g class="vert-line"><rect x="755.9090909090909" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="775.9090909090909" y="20" fill="transparent" stroke="transparent" font-size="30px">23.9</text></g><g class="vert-line"><rect x="781.4772727272727" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="801.4772727272727" y="20" fill="transparent" stroke="transparent" font-size="30px">23.9</text></g><g class="vert-line"><rect x="807.0454545454545" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="827.0454545454545" y="20" fill="transparent" stroke="transparent" font-size="30px">22.8</text></g><g class="vert-line"><rect x="832.6136363636364" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="852.6136363636364" y="20" fill="transparent" stroke="transparent" font-size="30px">22.8</text></g><g class="vert-line"><rect x="858.1818181818182" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="878.1818181818182" y="20" fill="transparent" stroke="transparent" font-size="30px">23.9</text></g><g class="vert-line"><rect x="883.75" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="903.75" y="20" fill="transparent" stroke="transparent" font-size="30px">23.9</text></g><g class="vert-line"><rect x="909.3181818181818" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="929.3181818181818" y="20" fill="transparent" stroke="transparent" font-size="30px">22.8</text></g><g class="vert-line"><rect x="934.8863636363636" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="954.8863636363636" y="20" fill="transparent" stroke="transparent" font-size="30px">23.9</text></g><g class="vert-line"><rect x="960.4545454545455" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="980.4545454545455" y="20" fill="transparent" stroke="transparent" font-size="30px">22.8</text></g><g class="vert-line"><rect x="986.0227272727273" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1006.0227272727273" y="20" fill="transparent" stroke="transparent" font-size="30px">22.8</text></g><g class="vert-line"><rect x="1011.5909090909091" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1031.590909090909" y="20" fill="transparent" stroke="transparent" font-size="30px">22.2</text></g><g class="vert-line"><rect x="1037.159090909091" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1057.159090909091" y="20" fill="transparent" stroke="transparent" font-size="30px">22.8</text></g><g class="vert-line"><rect x="1062.7272727272727" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1082.7272727272727" y="20" fill="transparent" stroke="transparent" font-size="30px">23.9</text></g><g class="vert-line"><rect x="1088.2954545454545" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1108.2954545454545" y="20" fill="transparent" stroke="transparent" font-size="30px">23.9</text></g><g class="vert-line"><rect x="1113.8636363636365" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1133.8636363636365" y="20" fill="transparent" stroke="transparent" font-size="30px">23.9</text></g><g class="vert-line"><rect x="1139.4318181818182" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1159.4318181818182" y="20" fill="transparent" stroke="transparent" font-size="30px">22.8</text></g><g class="vert-line"><rect x="1165.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1185.0" y="20" fill="transparent" stroke="transparent" font-size="30px">22.8</text></g></svg></div></td>
    <td class="gt_row gt_left"><div><svg viewbox="0 0 1225 130" style="height: 2em; margin-left: auto; margin-right: auto; font-size: inherit; overflow: visible; vertical-align: middle; position:relative;"><defs><pattern id="area_pattern" width="8" height="8" patternunits="userSpaceOnUse"><path class="pattern-line" d="M 0,8 l 8,-8 M -1,1 l 4,-4 M 6,10 l 4,-4" stroke="#FF0000" stroke-width="1.5" stroke-linecap="round" shape-rendering="geometricPrecision"></path></pattern></defs><style> text { font-family: ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace; stroke-width: 0.15em; paint-order: stroke; stroke-linejoin: round; cursor: default; } .vert-line:hover rect { fill: #911EB4; fill-opacity: 40%; stroke: #FFFFFF60; color: red; } .vert-line:hover text { stroke: white; fill: #212427; } .horizontal-line:hover text {stroke: white; fill: #212427; } .ref-line:hover rect { stroke: #FFFFFF60; } .ref-line:hover line { stroke: #FF0000; } .ref-line:hover text { stroke: white; fill: #212427; } .y-axis-line:hover rect { fill: #EDEDED; fill-opacity: 60%; stroke: #FFFFFF60; color: red; } .y-axis-line:hover text { stroke: white; stroke-width: 0.20em; fill: #1A1C1F; } </style><path d="M 50.0,49.92063492063492 C 62.5,49.92063492063492 63.06818181818181,49.92063492063492 75.56818181818181,49.92063492063492 C 88.06818181818181,49.92063492063492 88.63636363636364,41.98412698412699 101.13636363636364,41.98412698412699 C 113.63636363636364,41.98412698412699 114.20454545454545,49.92063492063492 126.70454545454545,49.92063492063492 C 139.20454545454544,49.92063492063492 139.77272727272728,49.92063492063492 152.27272727272728,49.92063492063492 C 164.77272727272728,49.92063492063492 165.3409090909091,49.92063492063492 177.8409090909091,49.92063492063492 C 190.3409090909091,49.92063492063492 190.9090909090909,49.92063492063492 203.4090909090909,49.92063492063492 C 215.9090909090909,49.92063492063492 216.47727272727272,49.92063492063492 228.97727272727272,49.92063492063492 C 241.47727272727272,49.92063492063492 242.04545454545456,49.92063492063492 254.54545454545456,49.92063492063492 C 267.04545454545456,49.92063492063492 267.6136363636364,65.79365079365078 280.1136363636364,65.79365079365078 C 292.6136363636364,65.79365079365078 293.1818181818182,49.92063492063492 305.6818181818182,49.92063492063492 C 318.1818181818182,49.92063492063492 318.75,57.85714285714286 331.25,57.85714285714286 C 343.75,57.85714285714286 344.3181818181818,57.85714285714286 356.8181818181818,57.85714285714286 C 369.3181818181818,57.85714285714286 369.8863636363636,57.85714285714286 382.3863636363636,57.85714285714286 C 394.8863636363636,57.85714285714286 395.45454545454544,49.92063492063492 407.95454545454544,49.92063492063492 C 420.45454545454544,49.92063492063492 421.02272727272725,49.92063492063492 433.52272727272725,49.92063492063492 C 446.02272727272725,49.92063492063492 446.5909090909091,57.85714285714286 459.0909090909091,57.85714285714286 C 471.5909090909091,57.85714285714286 472.1590909090909,57.85714285714286 484.6590909090909,57.85714285714286 C 497.1590909090909,57.85714285714286 497.72727272727275,72.14285714285714 510.22727272727275,72.14285714285714 C 522.7272727272727,72.14285714285714 523.2954545454545,70.55555555555556 535.7954545454545,70.55555555555556 C 548.2954545454545,70.55555555555556 548.8636363636364,76.9047619047619 561.3636363636364,76.9047619047619 C 573.8636363636364,76.9047619047619 574.4318181818182,88.01587301587303 586.9318181818182,88.01587301587303 C 599.4318181818182,88.01587301587303 600.0,99.12698412698413 612.5,99.12698412698413 C 625.0,99.12698412698413 625.5681818181818,99.12698412698413 638.0681818181818,99.12698412698413 C 650.5681818181818,99.12698412698413 651.1363636363636,92.77777777777779 663.6363636363636,92.77777777777779 C 676.1363636363636,92.77777777777779 676.7045454545455,83.25396825396827 689.2045454545455,83.25396825396827 C 701.7045454545455,83.25396825396827 702.2727272727273,70.55555555555556 714.7727272727273,70.55555555555556 C 727.2727272727273,70.55555555555556 727.8409090909091,70.55555555555556 740.3409090909091,70.55555555555556 C 752.8409090909091,70.55555555555556 753.4090909090909,76.9047619047619 765.9090909090909,76.9047619047619 C 778.4090909090909,76.9047619047619 778.9772727272727,76.9047619047619 791.4772727272727,76.9047619047619 C 803.9772727272727,76.9047619047619 804.5454545454545,70.55555555555556 817.0454545454545,70.55555555555556 C 829.5454545454545,70.55555555555556 830.1136363636364,70.55555555555556 842.6136363636364,70.55555555555556 C 855.1136363636364,70.55555555555556 855.6818181818182,76.9047619047619 868.1818181818182,76.9047619047619 C 880.6818181818182,76.9047619047619 881.25,76.9047619047619 893.75,76.9047619047619 C 906.25,76.9047619047619 906.8181818181818,70.55555555555556 919.3181818181818,70.55555555555556 C 931.8181818181818,70.55555555555556 932.3863636363636,76.9047619047619 944.8863636363636,76.9047619047619 C 957.3863636363636,76.9047619047619 957.9545454545455,70.55555555555556 970.4545454545455,70.55555555555556 C 982.9545454545455,70.55555555555556 983.5227272727273,70.55555555555556 996.0227272727273,70.55555555555556 C 1008.5227272727273,70.55555555555556 1009.0909090909091,64.20634920634922 1021.5909090909091,64.20634920634922 C 1034.090909090909,64.20634920634922 1034.659090909091,76.9047619047619 1047.159090909091,76.9047619047619 C 1059.659090909091,76.9047619047619 1060.2272727272727,89.60317460317461 1072.7272727272727,89.60317460317461 C 1085.2272727272727,89.60317460317461 1085.7954545454545,99.12698412698413 1098.2954545454545,99.12698412698413 C 1110.7954545454545,99.12698412698413 1111.3636363636365,99.12698412698413 1123.8636363636365,99.12698412698413 C 1136.3636363636365,99.12698412698413 1136.9318181818182,99.12698412698413 1149.4318181818182,99.12698412698413 C 1161.9318181818182,99.12698412698413 1162.5,99.12698412698413 1175.0,99.12698412698413" stroke="gray" stroke-width="4" fill="none"></path><circle cx="50.0" cy="49.92063492063492" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="75.56818181818181" cy="49.92063492063492" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="101.13636363636364" cy="41.98412698412699" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="126.70454545454545" cy="49.92063492063492" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="152.27272727272728" cy="49.92063492063492" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="177.8409090909091" cy="49.92063492063492" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="203.4090909090909" cy="49.92063492063492" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="228.97727272727272" cy="49.92063492063492" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="254.54545454545456" cy="49.92063492063492" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="280.1136363636364" cy="65.79365079365078" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="305.6818181818182" cy="49.92063492063492" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="331.25" cy="57.85714285714286" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="356.8181818181818" cy="57.85714285714286" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="382.3863636363636" cy="57.85714285714286" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="407.95454545454544" cy="49.92063492063492" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="433.52272727272725" cy="49.92063492063492" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="459.0909090909091" cy="57.85714285714286" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="484.6590909090909" cy="57.85714285714286" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="510.22727272727275" cy="72.14285714285714" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="535.7954545454545" cy="70.55555555555556" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="561.3636363636364" cy="76.9047619047619" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="586.9318181818182" cy="88.01587301587303" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="612.5" cy="99.12698412698413" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="638.0681818181818" cy="99.12698412698413" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="663.6363636363636" cy="92.77777777777779" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="689.2045454545455" cy="83.25396825396827" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="714.7727272727273" cy="70.55555555555556" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="740.3409090909091" cy="70.55555555555556" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="765.9090909090909" cy="76.9047619047619" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="791.4772727272727" cy="76.9047619047619" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="817.0454545454545" cy="70.55555555555556" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="842.6136363636364" cy="70.55555555555556" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="868.1818181818182" cy="76.9047619047619" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="893.75" cy="76.9047619047619" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="919.3181818181818" cy="70.55555555555556" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="944.8863636363636" cy="76.9047619047619" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="970.4545454545455" cy="70.55555555555556" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="996.0227272727273" cy="70.55555555555556" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1021.5909090909091" cy="64.20634920634922" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1047.159090909091" cy="76.9047619047619" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1072.7272727272727" cy="89.60317460317461" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1098.2954545454545" cy="99.12698412698413" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1123.8636363636365" cy="99.12698412698413" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1149.4318181818182" cy="99.12698412698413" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1175.0" cy="99.12698412698413" r="4" stroke="black" stroke-width="4" fill="white"></circle><g class="y-axis-line"><rect x="0" y="0" width="65" height="130" stroke="transparent" stroke-width="0" fill="transparent"></rect><text x="0" y="19.0" fill="transparent" stroke="transparent" font-size="25">100</text><text x="0" y="126.0" fill="transparent" stroke="transparent" font-size="25">37.0</text></g><g class="vert-line"><rect x="40.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="60.0" y="20" fill="transparent" stroke="transparent" font-size="30px">78.0</text></g><g class="vert-line"><rect x="65.56818181818181" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="85.56818181818181" y="20" fill="transparent" stroke="transparent" font-size="30px">78.0</text></g><g class="vert-line"><rect x="91.13636363636364" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="111.13636363636364" y="20" fill="transparent" stroke="transparent" font-size="30px">83.0</text></g><g class="vert-line"><rect x="116.70454545454545" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="136.70454545454544" y="20" fill="transparent" stroke="transparent" font-size="30px">78.0</text></g><g class="vert-line"><rect x="142.27272727272728" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="162.27272727272728" y="20" fill="transparent" stroke="transparent" font-size="30px">78.0</text></g><g class="vert-line"><rect x="167.8409090909091" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="187.8409090909091" y="20" fill="transparent" stroke="transparent" font-size="30px">78.0</text></g><g class="vert-line"><rect x="193.4090909090909" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="213.4090909090909" y="20" fill="transparent" stroke="transparent" font-size="30px">78.0</text></g><g class="vert-line"><rect x="218.97727272727272" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="238.97727272727272" y="20" fill="transparent" stroke="transparent" font-size="30px">78.0</text></g><g class="vert-line"><rect x="244.54545454545456" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="264.54545454545456" y="20" fill="transparent" stroke="transparent" font-size="30px">78.0</text></g><g class="vert-line"><rect x="270.1136363636364" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="290.1136363636364" y="20" fill="transparent" stroke="transparent" font-size="30px">68.0</text></g><g class="vert-line"><rect x="295.6818181818182" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="315.6818181818182" y="20" fill="transparent" stroke="transparent" font-size="30px">78.0</text></g><g class="vert-line"><rect x="321.25" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="341.25" y="20" fill="transparent" stroke="transparent" font-size="30px">73.0</text></g><g class="vert-line"><rect x="346.8181818181818" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="366.8181818181818" y="20" fill="transparent" stroke="transparent" font-size="30px">73.0</text></g><g class="vert-line"><rect x="372.3863636363636" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="392.3863636363636" y="20" fill="transparent" stroke="transparent" font-size="30px">73.0</text></g><g class="vert-line"><rect x="397.95454545454544" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="417.95454545454544" y="20" fill="transparent" stroke="transparent" font-size="30px">78.0</text></g><g class="vert-line"><rect x="423.52272727272725" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="443.52272727272725" y="20" fill="transparent" stroke="transparent" font-size="30px">78.0</text></g><g class="vert-line"><rect x="449.0909090909091" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="469.0909090909091" y="20" fill="transparent" stroke="transparent" font-size="30px">73.0</text></g><g class="vert-line"><rect x="474.6590909090909" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="494.6590909090909" y="20" fill="transparent" stroke="transparent" font-size="30px">73.0</text></g><g class="vert-line"><rect x="500.22727272727275" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="520.2272727272727" y="20" fill="transparent" stroke="transparent" font-size="30px">64.0</text></g><g class="vert-line"><rect x="525.7954545454545" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="545.7954545454545" y="20" fill="transparent" stroke="transparent" font-size="30px">65.0</text></g><g class="vert-line"><rect x="551.3636363636364" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="571.3636363636364" y="20" fill="transparent" stroke="transparent" font-size="30px">61.0</text></g><g class="vert-line"><rect x="576.9318181818182" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="596.9318181818182" y="20" fill="transparent" stroke="transparent" font-size="30px">54.0</text></g><g class="vert-line"><rect x="602.5" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="622.5" y="20" fill="transparent" stroke="transparent" font-size="30px">47.0</text></g><g class="vert-line"><rect x="628.0681818181818" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="648.0681818181818" y="20" fill="transparent" stroke="transparent" font-size="30px">47.0</text></g><g class="vert-line"><rect x="653.6363636363636" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="673.6363636363636" y="20" fill="transparent" stroke="transparent" font-size="30px">51.0</text></g><g class="vert-line"><rect x="679.2045454545455" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="699.2045454545455" y="20" fill="transparent" stroke="transparent" font-size="30px">57.0</text></g><g class="vert-line"><rect x="704.7727272727273" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="724.7727272727273" y="20" fill="transparent" stroke="transparent" font-size="30px">65.0</text></g><g class="vert-line"><rect x="730.3409090909091" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="750.3409090909091" y="20" fill="transparent" stroke="transparent" font-size="30px">65.0</text></g><g class="vert-line"><rect x="755.9090909090909" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="775.9090909090909" y="20" fill="transparent" stroke="transparent" font-size="30px">61.0</text></g><g class="vert-line"><rect x="781.4772727272727" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="801.4772727272727" y="20" fill="transparent" stroke="transparent" font-size="30px">61.0</text></g><g class="vert-line"><rect x="807.0454545454545" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="827.0454545454545" y="20" fill="transparent" stroke="transparent" font-size="30px">65.0</text></g><g class="vert-line"><rect x="832.6136363636364" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="852.6136363636364" y="20" fill="transparent" stroke="transparent" font-size="30px">65.0</text></g><g class="vert-line"><rect x="858.1818181818182" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="878.1818181818182" y="20" fill="transparent" stroke="transparent" font-size="30px">61.0</text></g><g class="vert-line"><rect x="883.75" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="903.75" y="20" fill="transparent" stroke="transparent" font-size="30px">61.0</text></g><g class="vert-line"><rect x="909.3181818181818" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="929.3181818181818" y="20" fill="transparent" stroke="transparent" font-size="30px">65.0</text></g><g class="vert-line"><rect x="934.8863636363636" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="954.8863636363636" y="20" fill="transparent" stroke="transparent" font-size="30px">61.0</text></g><g class="vert-line"><rect x="960.4545454545455" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="980.4545454545455" y="20" fill="transparent" stroke="transparent" font-size="30px">65.0</text></g><g class="vert-line"><rect x="986.0227272727273" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1006.0227272727273" y="20" fill="transparent" stroke="transparent" font-size="30px">65.0</text></g><g class="vert-line"><rect x="1011.5909090909091" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1031.590909090909" y="20" fill="transparent" stroke="transparent" font-size="30px">69.0</text></g><g class="vert-line"><rect x="1037.159090909091" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1057.159090909091" y="20" fill="transparent" stroke="transparent" font-size="30px">61.0</text></g><g class="vert-line"><rect x="1062.7272727272727" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1082.7272727272727" y="20" fill="transparent" stroke="transparent" font-size="30px">53.0</text></g><g class="vert-line"><rect x="1088.2954545454545" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1108.2954545454545" y="20" fill="transparent" stroke="transparent" font-size="30px">47.0</text></g><g class="vert-line"><rect x="1113.8636363636365" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1133.8636363636365" y="20" fill="transparent" stroke="transparent" font-size="30px">47.0</text></g><g class="vert-line"><rect x="1139.4318181818182" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1159.4318181818182" y="20" fill="transparent" stroke="transparent" font-size="30px">47.0</text></g><g class="vert-line"><rect x="1165.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1185.0" y="20" fill="transparent" stroke="transparent" font-size="30px">47.0</text></g></svg></div></td>
  </tr>
  <tr>
    <td class="gt_row gt_left">Mon, May 8, 2023</td>
    <td class="gt_row gt_left"><div><svg viewbox="0 0 1350 130" style="height: 2em; margin-left: auto; margin-right: auto; font-size: inherit; overflow: visible; vertical-align: middle; position:relative;"><defs><pattern id="area_pattern" width="8" height="8" patternunits="userSpaceOnUse"><path class="pattern-line" d="M 0,8 l 8,-8 M -1,1 l 4,-4 M 6,10 l 4,-4" stroke="#FF0000" stroke-width="1.5" stroke-linecap="round" shape-rendering="geometricPrecision"></path></pattern></defs><style> text { font-family: ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace; stroke-width: 0.15em; paint-order: stroke; stroke-linejoin: round; cursor: default; } .vert-line:hover rect { fill: #911EB4; fill-opacity: 40%; stroke: #FFFFFF60; color: red; } .vert-line:hover text { stroke: white; fill: #212427; } .horizontal-line:hover text {stroke: white; fill: #212427; } .ref-line:hover rect { stroke: #FFFFFF60; } .ref-line:hover line { stroke: #FF0000; } .ref-line:hover text { stroke: white; fill: #212427; } .y-axis-line:hover rect { fill: #EDEDED; fill-opacity: 60%; stroke: #FFFFFF60; color: red; } .y-axis-line:hover text { stroke: white; stroke-width: 0.20em; fill: #1A1C1F; } </style><path d="M 50.0,71.11510791366908 C 62.5,71.11510791366908 63.01020408163265,79.02877697841727 75.51020408163265,79.02877697841727 C 88.01020408163265,79.02877697841727 88.5204081632653,79.02877697841727 101.0204081632653,79.02877697841727 C 113.5204081632653,79.02877697841727 114.03061224489795,86.94244604316548 126.53061224489795,86.94244604316548 C 139.03061224489795,86.94244604316548 139.5408163265306,86.94244604316548 152.0408163265306,86.94244604316548 C 164.5408163265306,86.94244604316548 165.05102040816325,94.85611510791368 177.55102040816325,94.85611510791368 C 190.05102040816325,94.85611510791368 190.5612244897959,94.85611510791368 203.0612244897959,94.85611510791368 C 215.5612244897959,94.85611510791368 216.07142857142856,94.85611510791368 228.57142857142856,94.85611510791368 C 241.07142857142856,94.85611510791368 241.5816326530612,102.76978417266189 254.0816326530612,102.76978417266189 C 266.5816326530612,102.76978417266189 267.09183673469386,94.85611510791368 279.59183673469386,94.85611510791368 C 292.09183673469386,94.85611510791368 292.6020408163265,102.76978417266189 305.1020408163265,102.76978417266189 C 317.6020408163265,102.76978417266189 318.11224489795916,94.85611510791368 330.61224489795916,94.85611510791368 C 343.11224489795916,94.85611510791368 343.6224489795918,102.76978417266189 356.1224489795918,102.76978417266189 C 368.6224489795918,102.76978417266189 369.1326530612245,102.76978417266189 381.6326530612245,102.76978417266189 C 394.1326530612245,102.76978417266189 394.6428571428571,102.76978417266189 407.1428571428571,102.76978417266189 C 419.6428571428571,102.76978417266189 420.1530612244898,102.76978417266189 432.6530612244898,102.76978417266189 C 445.1530612244898,102.76978417266189 445.6632653061224,102.76978417266189 458.1632653061224,102.76978417266189 C 470.6632653061224,102.76978417266189 471.1734693877551,102.76978417266189 483.6734693877551,102.76978417266189 C 496.1734693877551,102.76978417266189 496.68367346938777,94.85611510791368 509.18367346938777,94.85611510791368 C 521.6836734693877,94.85611510791368 522.1938775510204,94.85611510791368 534.6938775510204,94.85611510791368 C 547.1938775510204,94.85611510791368 547.704081632653,94.85611510791368 560.204081632653,94.85611510791368 C 572.704081632653,94.85611510791368 573.2142857142857,94.85611510791368 585.7142857142857,94.85611510791368 C 598.2142857142857,94.85611510791368 598.7244897959183,94.85611510791368 611.2244897959183,94.85611510791368 C 623.7244897959183,94.85611510791368 624.2346938775511,86.94244604316548 636.7346938775511,86.94244604316548 C 649.2346938775511,86.94244604316548 649.7448979591836,94.85611510791368 662.2448979591836,94.85611510791368 C 674.7448979591836,94.85611510791368 675.2551020408164,86.94244604316548 687.7551020408164,86.94244604316548 C 700.2551020408164,86.94244604316548 700.765306122449,79.02877697841727 713.265306122449,79.02877697841727 C 725.765306122449,79.02877697841727 726.2755102040816,79.02877697841727 738.7755102040816,79.02877697841727 C 751.2755102040816,79.02877697841727 751.7857142857142,79.02877697841727 764.2857142857142,79.02877697841727 C 776.7857142857142,79.02877697841727 777.2959183673469,79.02877697841727 789.7959183673469,79.02877697841727 C 802.2959183673469,79.02877697841727 802.8061224489796,79.02877697841727 815.3061224489796,79.02877697841727 C 827.8061224489796,79.02877697841727 828.3163265306123,79.02877697841727 840.8163265306123,79.02877697841727 C 853.3163265306123,79.02877697841727 853.8265306122448,86.94244604316548 866.3265306122448,86.94244604316548 C 878.8265306122448,86.94244604316548 879.3367346938775,86.94244604316548 891.8367346938775,86.94244604316548 C 904.3367346938775,86.94244604316548 904.8469387755102,79.02877697841727 917.3469387755102,79.02877697841727 C 929.8469387755102,79.02877697841727 930.3571428571429,86.94244604316548 942.8571428571429,86.94244604316548 C 955.3571428571429,86.94244604316548 955.8673469387755,79.02877697841727 968.3673469387755,79.02877697841727 C 980.8673469387755,79.02877697841727 981.3775510204081,79.02877697841727 993.8775510204081,79.02877697841727 C 1006.3775510204081,79.02877697841727 1006.8877551020407,71.11510791366908 1019.3877551020407,71.11510791366908 C 1031.8877551020407,71.11510791366908 1032.3979591836735,66.79856115107913 1044.8979591836735,66.79856115107913 C 1057.3979591836735,66.79856115107913 1057.908163265306,58.88489208633095 1070.408163265306,58.88489208633095 C 1082.908163265306,58.88489208633095 1083.4183673469388,66.79856115107913 1095.9183673469388,66.79856115107913 C 1108.4183673469388,66.79856115107913 1108.9285714285713,66.79856115107913 1121.4285714285713,66.79856115107913 C 1133.9285714285713,66.79856115107913 1134.438775510204,71.11510791366908 1146.938775510204,71.11510791366908 C 1159.438775510204,71.11510791366908 1159.9489795918366,71.11510791366908 1172.4489795918366,71.11510791366908 C 1184.9489795918366,71.11510791366908 1185.4591836734694,79.02877697841727 1197.9591836734694,79.02877697841727 C 1210.4591836734694,79.02877697841727 1210.9693877551022,79.02877697841727 1223.4693877551022,79.02877697841727 C 1235.9693877551022,79.02877697841727 1236.4795918367347,94.85611510791368 1248.9795918367347,94.85611510791368 C 1261.4795918367347,94.85611510791368 1261.9897959183672,94.85611510791368 1274.4897959183672,94.85611510791368 C 1286.9897959183672,94.85611510791368 1287.5,94.85611510791368 1300.0,94.85611510791368" stroke="gray" stroke-width="4" fill="none"></path><circle cx="50.0" cy="71.11510791366908" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="75.51020408163265" cy="79.02877697841727" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="101.0204081632653" cy="79.02877697841727" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="126.53061224489795" cy="86.94244604316548" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="152.0408163265306" cy="86.94244604316548" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="177.55102040816325" cy="94.85611510791368" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="203.0612244897959" cy="94.85611510791368" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="228.57142857142856" cy="94.85611510791368" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="254.0816326530612" cy="102.76978417266189" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="279.59183673469386" cy="94.85611510791368" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="305.1020408163265" cy="102.76978417266189" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="330.61224489795916" cy="94.85611510791368" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="356.1224489795918" cy="102.76978417266189" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="381.6326530612245" cy="102.76978417266189" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="407.1428571428571" cy="102.76978417266189" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="432.6530612244898" cy="102.76978417266189" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="458.1632653061224" cy="102.76978417266189" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="483.6734693877551" cy="102.76978417266189" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="509.18367346938777" cy="94.85611510791368" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="534.6938775510204" cy="94.85611510791368" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="560.204081632653" cy="94.85611510791368" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="585.7142857142857" cy="94.85611510791368" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="611.2244897959183" cy="94.85611510791368" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="636.7346938775511" cy="86.94244604316548" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="662.2448979591836" cy="94.85611510791368" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="687.7551020408164" cy="86.94244604316548" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="713.265306122449" cy="79.02877697841727" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="738.7755102040816" cy="79.02877697841727" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="764.2857142857142" cy="79.02877697841727" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="789.7959183673469" cy="79.02877697841727" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="815.3061224489796" cy="79.02877697841727" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="840.8163265306123" cy="79.02877697841727" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="866.3265306122448" cy="86.94244604316548" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="891.8367346938775" cy="86.94244604316548" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="917.3469387755102" cy="79.02877697841727" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="942.8571428571429" cy="86.94244604316548" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="968.3673469387755" cy="79.02877697841727" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="993.8775510204081" cy="79.02877697841727" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1019.3877551020407" cy="71.11510791366908" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1044.8979591836735" cy="66.79856115107913" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1070.408163265306" cy="58.88489208633095" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1095.9183673469388" cy="66.79856115107913" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1121.4285714285713" cy="66.79856115107913" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1146.938775510204" cy="71.11510791366908" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1172.4489795918366" cy="71.11510791366908" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1197.9591836734694" cy="79.02877697841727" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1223.4693877551022" cy="79.02877697841727" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1248.9795918367347" cy="94.85611510791368" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1274.4897959183672" cy="94.85611510791368" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1300.0" cy="94.85611510791368" r="4" stroke="black" stroke-width="4" fill="white"></circle><g class="y-axis-line"><rect x="0" y="0" width="65" height="130" stroke="transparent" stroke-width="0" fill="transparent"></rect><text x="0" y="19.0" fill="transparent" stroke="transparent" font-size="25">30.0</text><text x="0" y="126.0" fill="transparent" stroke="transparent" font-size="25">16.1</text></g><g class="vert-line"><rect x="40.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="60.0" y="20" fill="transparent" stroke="transparent" font-size="30px">22.2</text></g><g class="vert-line"><rect x="65.51020408163265" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="85.51020408163265" y="20" fill="transparent" stroke="transparent" font-size="30px">21.1</text></g><g class="vert-line"><rect x="91.0204081632653" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="111.0204081632653" y="20" fill="transparent" stroke="transparent" font-size="30px">21.1</text></g><g class="vert-line"><rect x="116.53061224489795" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="136.53061224489795" y="20" fill="transparent" stroke="transparent" font-size="30px">20.0</text></g><g class="vert-line"><rect x="142.0408163265306" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="162.0408163265306" y="20" fill="transparent" stroke="transparent" font-size="30px">20.0</text></g><g class="vert-line"><rect x="167.55102040816325" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="187.55102040816325" y="20" fill="transparent" stroke="transparent" font-size="30px">18.9</text></g><g class="vert-line"><rect x="193.0612244897959" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="213.0612244897959" y="20" fill="transparent" stroke="transparent" font-size="30px">18.9</text></g><g class="vert-line"><rect x="218.57142857142856" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="238.57142857142856" y="20" fill="transparent" stroke="transparent" font-size="30px">18.9</text></g><g class="vert-line"><rect x="244.0816326530612" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="264.0816326530612" y="20" fill="transparent" stroke="transparent" font-size="30px">17.8</text></g><g class="vert-line"><rect x="269.59183673469386" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="289.59183673469386" y="20" fill="transparent" stroke="transparent" font-size="30px">18.9</text></g><g class="vert-line"><rect x="295.1020408163265" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="315.1020408163265" y="20" fill="transparent" stroke="transparent" font-size="30px">17.8</text></g><g class="vert-line"><rect x="320.61224489795916" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="340.61224489795916" y="20" fill="transparent" stroke="transparent" font-size="30px">18.9</text></g><g class="vert-line"><rect x="346.1224489795918" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="366.1224489795918" y="20" fill="transparent" stroke="transparent" font-size="30px">17.8</text></g><g class="vert-line"><rect x="371.6326530612245" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="391.6326530612245" y="20" fill="transparent" stroke="transparent" font-size="30px">17.8</text></g><g class="vert-line"><rect x="397.1428571428571" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="417.1428571428571" y="20" fill="transparent" stroke="transparent" font-size="30px">17.8</text></g><g class="vert-line"><rect x="422.6530612244898" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="442.6530612244898" y="20" fill="transparent" stroke="transparent" font-size="30px">17.8</text></g><g class="vert-line"><rect x="448.1632653061224" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="468.1632653061224" y="20" fill="transparent" stroke="transparent" font-size="30px">17.8</text></g><g class="vert-line"><rect x="473.6734693877551" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="493.6734693877551" y="20" fill="transparent" stroke="transparent" font-size="30px">17.8</text></g><g class="vert-line"><rect x="499.18367346938777" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="519.1836734693877" y="20" fill="transparent" stroke="transparent" font-size="30px">18.9</text></g><g class="vert-line"><rect x="524.6938775510204" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="544.6938775510204" y="20" fill="transparent" stroke="transparent" font-size="30px">18.9</text></g><g class="vert-line"><rect x="550.204081632653" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="570.204081632653" y="20" fill="transparent" stroke="transparent" font-size="30px">18.9</text></g><g class="vert-line"><rect x="575.7142857142857" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="595.7142857142857" y="20" fill="transparent" stroke="transparent" font-size="30px">18.9</text></g><g class="vert-line"><rect x="601.2244897959183" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="621.2244897959183" y="20" fill="transparent" stroke="transparent" font-size="30px">18.9</text></g><g class="vert-line"><rect x="626.7346938775511" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="646.7346938775511" y="20" fill="transparent" stroke="transparent" font-size="30px">20.0</text></g><g class="vert-line"><rect x="652.2448979591836" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="672.2448979591836" y="20" fill="transparent" stroke="transparent" font-size="30px">18.9</text></g><g class="vert-line"><rect x="677.7551020408164" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="697.7551020408164" y="20" fill="transparent" stroke="transparent" font-size="30px">20.0</text></g><g class="vert-line"><rect x="703.265306122449" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="723.265306122449" y="20" fill="transparent" stroke="transparent" font-size="30px">21.1</text></g><g class="vert-line"><rect x="728.7755102040816" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="748.7755102040816" y="20" fill="transparent" stroke="transparent" font-size="30px">21.1</text></g><g class="vert-line"><rect x="754.2857142857142" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="774.2857142857142" y="20" fill="transparent" stroke="transparent" font-size="30px">21.1</text></g><g class="vert-line"><rect x="779.7959183673469" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="799.7959183673469" y="20" fill="transparent" stroke="transparent" font-size="30px">21.1</text></g><g class="vert-line"><rect x="805.3061224489796" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="825.3061224489796" y="20" fill="transparent" stroke="transparent" font-size="30px">21.1</text></g><g class="vert-line"><rect x="830.8163265306123" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="850.8163265306123" y="20" fill="transparent" stroke="transparent" font-size="30px">21.1</text></g><g class="vert-line"><rect x="856.3265306122448" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="876.3265306122448" y="20" fill="transparent" stroke="transparent" font-size="30px">20.0</text></g><g class="vert-line"><rect x="881.8367346938775" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="901.8367346938775" y="20" fill="transparent" stroke="transparent" font-size="30px">20.0</text></g><g class="vert-line"><rect x="907.3469387755102" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="927.3469387755102" y="20" fill="transparent" stroke="transparent" font-size="30px">21.1</text></g><g class="vert-line"><rect x="932.8571428571429" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="952.8571428571429" y="20" fill="transparent" stroke="transparent" font-size="30px">20.0</text></g><g class="vert-line"><rect x="958.3673469387755" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="978.3673469387755" y="20" fill="transparent" stroke="transparent" font-size="30px">21.1</text></g><g class="vert-line"><rect x="983.8775510204081" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1003.8775510204081" y="20" fill="transparent" stroke="transparent" font-size="30px">21.1</text></g><g class="vert-line"><rect x="1009.3877551020407" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1029.3877551020407" y="20" fill="transparent" stroke="transparent" font-size="30px">22.2</text></g><g class="vert-line"><rect x="1034.8979591836735" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1054.8979591836735" y="20" fill="transparent" stroke="transparent" font-size="30px">22.8</text></g><g class="vert-line"><rect x="1060.408163265306" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1080.408163265306" y="20" fill="transparent" stroke="transparent" font-size="30px">23.9</text></g><g class="vert-line"><rect x="1085.9183673469388" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1105.9183673469388" y="20" fill="transparent" stroke="transparent" font-size="30px">22.8</text></g><g class="vert-line"><rect x="1111.4285714285713" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1131.4285714285713" y="20" fill="transparent" stroke="transparent" font-size="30px">22.8</text></g><g class="vert-line"><rect x="1136.938775510204" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1156.938775510204" y="20" fill="transparent" stroke="transparent" font-size="30px">22.2</text></g><g class="vert-line"><rect x="1162.4489795918366" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1182.4489795918366" y="20" fill="transparent" stroke="transparent" font-size="30px">22.2</text></g><g class="vert-line"><rect x="1187.9591836734694" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1207.9591836734694" y="20" fill="transparent" stroke="transparent" font-size="30px">21.1</text></g><g class="vert-line"><rect x="1213.4693877551022" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1233.4693877551022" y="20" fill="transparent" stroke="transparent" font-size="30px">21.1</text></g><g class="vert-line"><rect x="1238.9795918367347" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1258.9795918367347" y="20" fill="transparent" stroke="transparent" font-size="30px">18.9</text></g><g class="vert-line"><rect x="1264.4897959183672" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1284.4897959183672" y="20" fill="transparent" stroke="transparent" font-size="30px">18.9</text></g><g class="vert-line"><rect x="1290.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1310.0" y="20" fill="transparent" stroke="transparent" font-size="30px">18.9</text></g></svg></div></td>
    <td class="gt_row gt_left"><div><svg viewbox="0 0 1350 130" style="height: 2em; margin-left: auto; margin-right: auto; font-size: inherit; overflow: visible; vertical-align: middle; position:relative;"><defs><pattern id="area_pattern" width="8" height="8" patternunits="userSpaceOnUse"><path class="pattern-line" d="M 0,8 l 8,-8 M -1,1 l 4,-4 M 6,10 l 4,-4" stroke="#FF0000" stroke-width="1.5" stroke-linecap="round" shape-rendering="geometricPrecision"></path></pattern></defs><style> text { font-family: ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace; stroke-width: 0.15em; paint-order: stroke; stroke-linejoin: round; cursor: default; } .vert-line:hover rect { fill: #911EB4; fill-opacity: 40%; stroke: #FFFFFF60; color: red; } .vert-line:hover text { stroke: white; fill: #212427; } .horizontal-line:hover text {stroke: white; fill: #212427; } .ref-line:hover rect { stroke: #FFFFFF60; } .ref-line:hover line { stroke: #FF0000; } .ref-line:hover text { stroke: white; fill: #212427; } .y-axis-line:hover rect { fill: #EDEDED; fill-opacity: 60%; stroke: #FFFFFF60; color: red; } .y-axis-line:hover text { stroke: white; stroke-width: 0.20em; fill: #1A1C1F; } </style><path d="M 50.0,78.4920634920635 C 62.5,78.4920634920635 63.01020408163265,65.79365079365078 75.51020408163265,65.79365079365078 C 88.01020408163265,65.79365079365078 88.5204081632653,57.85714285714286 101.0204081632653,57.85714285714286 C 113.5204081632653,57.85714285714286 114.03061224489795,49.92063492063492 126.53061224489795,49.92063492063492 C 139.03061224489795,49.92063492063492 139.5408163265306,49.92063492063492 152.0408163265306,49.92063492063492 C 164.5408163265306,49.92063492063492 165.05102040816325,34.04761904761905 177.55102040816325,34.04761904761905 C 190.05102040816325,34.04761904761905 190.5612244897959,41.98412698412699 203.0612244897959,41.98412698412699 C 215.5612244897959,41.98412698412699 216.07142857142856,34.04761904761905 228.57142857142856,34.04761904761905 C 241.07142857142856,34.04761904761905 241.5816326530612,34.04761904761905 254.0816326530612,34.04761904761905 C 266.5816326530612,34.04761904761905 267.09183673469386,41.98412698412699 279.59183673469386,41.98412698412699 C 292.09183673469386,41.98412698412699 292.6020408163265,24.523809523809526 305.1020408163265,24.523809523809526 C 317.6020408163265,24.523809523809526 318.11224489795916,34.04761904761905 330.61224489795916,34.04761904761905 C 343.11224489795916,34.04761904761905 343.6224489795918,24.523809523809526 356.1224489795918,24.523809523809526 C 368.6224489795918,24.523809523809526 369.1326530612245,24.523809523809526 381.6326530612245,24.523809523809526 C 394.1326530612245,24.523809523809526 394.6428571428571,24.523809523809526 407.1428571428571,24.523809523809526 C 419.6428571428571,24.523809523809526 420.1530612244898,15.0 432.6530612244898,15.0 C 445.1530612244898,15.0 445.6632653061224,15.0 458.1632653061224,15.0 C 470.6632653061224,15.0 471.1734693877551,15.0 483.6734693877551,15.0 C 496.1734693877551,15.0 496.68367346938777,24.523809523809526 509.18367346938777,24.523809523809526 C 521.6836734693877,24.523809523809526 522.1938775510204,24.523809523809526 534.6938775510204,24.523809523809526 C 547.1938775510204,24.523809523809526 547.704081632653,24.523809523809526 560.204081632653,24.523809523809526 C 572.704081632653,24.523809523809526 573.2142857142857,24.523809523809526 585.7142857142857,24.523809523809526 C 598.2142857142857,24.523809523809526 598.7244897959183,24.523809523809526 611.2244897959183,24.523809523809526 C 623.7244897959183,24.523809523809526 624.2346938775511,34.04761904761905 636.7346938775511,34.04761904761905 C 649.2346938775511,34.04761904761905 649.7448979591836,34.04761904761905 662.2448979591836,34.04761904761905 C 674.7448979591836,34.04761904761905 675.2551020408164,34.04761904761905 687.7551020408164,34.04761904761905 C 700.2551020408164,34.04761904761905 700.765306122449,49.92063492063492 713.265306122449,49.92063492063492 C 725.765306122449,49.92063492063492 726.2755102040816,49.92063492063492 738.7755102040816,49.92063492063492 C 751.2755102040816,49.92063492063492 751.7857142857142,49.92063492063492 764.2857142857142,49.92063492063492 C 776.7857142857142,49.92063492063492 777.2959183673469,49.92063492063492 789.7959183673469,49.92063492063492 C 802.2959183673469,49.92063492063492 802.8061224489796,49.92063492063492 815.3061224489796,49.92063492063492 C 827.8061224489796,49.92063492063492 828.3163265306123,49.92063492063492 840.8163265306123,49.92063492063492 C 853.3163265306123,49.92063492063492 853.8265306122448,41.98412698412699 866.3265306122448,41.98412698412699 C 878.8265306122448,41.98412698412699 879.3367346938775,41.98412698412699 891.8367346938775,41.98412698412699 C 904.3367346938775,41.98412698412699 904.8469387755102,49.92063492063492 917.3469387755102,49.92063492063492 C 929.8469387755102,49.92063492063492 930.3571428571429,41.98412698412699 942.8571428571429,41.98412698412699 C 955.3571428571429,41.98412698412699 955.8673469387755,49.92063492063492 968.3673469387755,49.92063492063492 C 980.8673469387755,49.92063492063492 981.3775510204081,49.92063492063492 993.8775510204081,49.92063492063492 C 1006.3775510204081,49.92063492063492 1006.8877551020407,57.85714285714286 1019.3877551020407,57.85714285714286 C 1031.8877551020407,57.85714285714286 1032.3979591836735,64.20634920634922 1044.8979591836735,64.20634920634922 C 1057.3979591836735,64.20634920634922 1057.908163265306,70.55555555555556 1070.408163265306,70.55555555555556 C 1082.908163265306,70.55555555555556 1083.4183673469388,64.20634920634922 1095.9183673469388,64.20634920634922 C 1108.4183673469388,64.20634920634922 1108.9285714285713,70.55555555555556 1121.4285714285713,70.55555555555556 C 1133.9285714285713,70.55555555555556 1134.438775510204,57.85714285714286 1146.938775510204,57.85714285714286 C 1159.438775510204,57.85714285714286 1159.9489795918366,57.85714285714286 1172.4489795918366,57.85714285714286 C 1184.9489795918366,57.85714285714286 1185.4591836734694,49.92063492063492 1197.9591836734694,49.92063492063492 C 1210.4591836734694,49.92063492063492 1210.9693877551022,49.92063492063492 1223.4693877551022,49.92063492063492 C 1235.9693877551022,49.92063492063492 1236.4795918367347,34.04761904761905 1248.9795918367347,34.04761904761905 C 1261.4795918367347,34.04761904761905 1261.9897959183672,34.04761904761905 1274.4897959183672,34.04761904761905 C 1286.9897959183672,34.04761904761905 1287.5,34.04761904761905 1300.0,34.04761904761905" stroke="gray" stroke-width="4" fill="none"></path><circle cx="50.0" cy="78.4920634920635" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="75.51020408163265" cy="65.79365079365078" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="101.0204081632653" cy="57.85714285714286" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="126.53061224489795" cy="49.92063492063492" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="152.0408163265306" cy="49.92063492063492" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="177.55102040816325" cy="34.04761904761905" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="203.0612244897959" cy="41.98412698412699" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="228.57142857142856" cy="34.04761904761905" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="254.0816326530612" cy="34.04761904761905" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="279.59183673469386" cy="41.98412698412699" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="305.1020408163265" cy="24.523809523809526" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="330.61224489795916" cy="34.04761904761905" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="356.1224489795918" cy="24.523809523809526" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="381.6326530612245" cy="24.523809523809526" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="407.1428571428571" cy="24.523809523809526" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="432.6530612244898" cy="15.0" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="458.1632653061224" cy="15.0" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="483.6734693877551" cy="15.0" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="509.18367346938777" cy="24.523809523809526" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="534.6938775510204" cy="24.523809523809526" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="560.204081632653" cy="24.523809523809526" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="585.7142857142857" cy="24.523809523809526" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="611.2244897959183" cy="24.523809523809526" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="636.7346938775511" cy="34.04761904761905" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="662.2448979591836" cy="34.04761904761905" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="687.7551020408164" cy="34.04761904761905" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="713.265306122449" cy="49.92063492063492" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="738.7755102040816" cy="49.92063492063492" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="764.2857142857142" cy="49.92063492063492" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="789.7959183673469" cy="49.92063492063492" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="815.3061224489796" cy="49.92063492063492" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="840.8163265306123" cy="49.92063492063492" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="866.3265306122448" cy="41.98412698412699" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="891.8367346938775" cy="41.98412698412699" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="917.3469387755102" cy="49.92063492063492" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="942.8571428571429" cy="41.98412698412699" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="968.3673469387755" cy="49.92063492063492" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="993.8775510204081" cy="49.92063492063492" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1019.3877551020407" cy="57.85714285714286" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1044.8979591836735" cy="64.20634920634922" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1070.408163265306" cy="70.55555555555556" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1095.9183673469388" cy="64.20634920634922" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1121.4285714285713" cy="70.55555555555556" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1146.938775510204" cy="57.85714285714286" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1172.4489795918366" cy="57.85714285714286" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1197.9591836734694" cy="49.92063492063492" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1223.4693877551022" cy="49.92063492063492" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1248.9795918367347" cy="34.04761904761905" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1274.4897959183672" cy="34.04761904761905" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1300.0" cy="34.04761904761905" r="4" stroke="black" stroke-width="4" fill="white"></circle><g class="y-axis-line"><rect x="0" y="0" width="65" height="130" stroke="transparent" stroke-width="0" fill="transparent"></rect><text x="0" y="19.0" fill="transparent" stroke="transparent" font-size="25">100</text><text x="0" y="126.0" fill="transparent" stroke="transparent" font-size="25">37</text></g><g class="vert-line"><rect x="40.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="60.0" y="20" fill="transparent" stroke="transparent" font-size="30px">60</text></g><g class="vert-line"><rect x="65.51020408163265" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="85.51020408163265" y="20" fill="transparent" stroke="transparent" font-size="30px">68</text></g><g class="vert-line"><rect x="91.0204081632653" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="111.0204081632653" y="20" fill="transparent" stroke="transparent" font-size="30px">73</text></g><g class="vert-line"><rect x="116.53061224489795" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="136.53061224489795" y="20" fill="transparent" stroke="transparent" font-size="30px">78</text></g><g class="vert-line"><rect x="142.0408163265306" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="162.0408163265306" y="20" fill="transparent" stroke="transparent" font-size="30px">78</text></g><g class="vert-line"><rect x="167.55102040816325" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="187.55102040816325" y="20" fill="transparent" stroke="transparent" font-size="30px">88</text></g><g class="vert-line"><rect x="193.0612244897959" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="213.0612244897959" y="20" fill="transparent" stroke="transparent" font-size="30px">83</text></g><g class="vert-line"><rect x="218.57142857142856" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="238.57142857142856" y="20" fill="transparent" stroke="transparent" font-size="30px">88</text></g><g class="vert-line"><rect x="244.0816326530612" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="264.0816326530612" y="20" fill="transparent" stroke="transparent" font-size="30px">88</text></g><g class="vert-line"><rect x="269.59183673469386" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="289.59183673469386" y="20" fill="transparent" stroke="transparent" font-size="30px">83</text></g><g class="vert-line"><rect x="295.1020408163265" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="315.1020408163265" y="20" fill="transparent" stroke="transparent" font-size="30px">94</text></g><g class="vert-line"><rect x="320.61224489795916" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="340.61224489795916" y="20" fill="transparent" stroke="transparent" font-size="30px">88</text></g><g class="vert-line"><rect x="346.1224489795918" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="366.1224489795918" y="20" fill="transparent" stroke="transparent" font-size="30px">94</text></g><g class="vert-line"><rect x="371.6326530612245" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="391.6326530612245" y="20" fill="transparent" stroke="transparent" font-size="30px">94</text></g><g class="vert-line"><rect x="397.1428571428571" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="417.1428571428571" y="20" fill="transparent" stroke="transparent" font-size="30px">94</text></g><g class="vert-line"><rect x="422.6530612244898" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="442.6530612244898" y="20" fill="transparent" stroke="transparent" font-size="30px">100</text></g><g class="vert-line"><rect x="448.1632653061224" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="468.1632653061224" y="20" fill="transparent" stroke="transparent" font-size="30px">100</text></g><g class="vert-line"><rect x="473.6734693877551" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="493.6734693877551" y="20" fill="transparent" stroke="transparent" font-size="30px">100</text></g><g class="vert-line"><rect x="499.18367346938777" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="519.1836734693877" y="20" fill="transparent" stroke="transparent" font-size="30px">94</text></g><g class="vert-line"><rect x="524.6938775510204" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="544.6938775510204" y="20" fill="transparent" stroke="transparent" font-size="30px">94</text></g><g class="vert-line"><rect x="550.204081632653" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="570.204081632653" y="20" fill="transparent" stroke="transparent" font-size="30px">94</text></g><g class="vert-line"><rect x="575.7142857142857" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="595.7142857142857" y="20" fill="transparent" stroke="transparent" font-size="30px">94</text></g><g class="vert-line"><rect x="601.2244897959183" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="621.2244897959183" y="20" fill="transparent" stroke="transparent" font-size="30px">94</text></g><g class="vert-line"><rect x="626.7346938775511" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="646.7346938775511" y="20" fill="transparent" stroke="transparent" font-size="30px">88</text></g><g class="vert-line"><rect x="652.2448979591836" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="672.2448979591836" y="20" fill="transparent" stroke="transparent" font-size="30px">88</text></g><g class="vert-line"><rect x="677.7551020408164" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="697.7551020408164" y="20" fill="transparent" stroke="transparent" font-size="30px">88</text></g><g class="vert-line"><rect x="703.265306122449" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="723.265306122449" y="20" fill="transparent" stroke="transparent" font-size="30px">78</text></g><g class="vert-line"><rect x="728.7755102040816" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="748.7755102040816" y="20" fill="transparent" stroke="transparent" font-size="30px">78</text></g><g class="vert-line"><rect x="754.2857142857142" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="774.2857142857142" y="20" fill="transparent" stroke="transparent" font-size="30px">78</text></g><g class="vert-line"><rect x="779.7959183673469" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="799.7959183673469" y="20" fill="transparent" stroke="transparent" font-size="30px">78</text></g><g class="vert-line"><rect x="805.3061224489796" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="825.3061224489796" y="20" fill="transparent" stroke="transparent" font-size="30px">78</text></g><g class="vert-line"><rect x="830.8163265306123" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="850.8163265306123" y="20" fill="transparent" stroke="transparent" font-size="30px">78</text></g><g class="vert-line"><rect x="856.3265306122448" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="876.3265306122448" y="20" fill="transparent" stroke="transparent" font-size="30px">83</text></g><g class="vert-line"><rect x="881.8367346938775" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="901.8367346938775" y="20" fill="transparent" stroke="transparent" font-size="30px">83</text></g><g class="vert-line"><rect x="907.3469387755102" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="927.3469387755102" y="20" fill="transparent" stroke="transparent" font-size="30px">78</text></g><g class="vert-line"><rect x="932.8571428571429" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="952.8571428571429" y="20" fill="transparent" stroke="transparent" font-size="30px">83</text></g><g class="vert-line"><rect x="958.3673469387755" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="978.3673469387755" y="20" fill="transparent" stroke="transparent" font-size="30px">78</text></g><g class="vert-line"><rect x="983.8775510204081" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1003.8775510204081" y="20" fill="transparent" stroke="transparent" font-size="30px">78</text></g><g class="vert-line"><rect x="1009.3877551020407" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1029.3877551020407" y="20" fill="transparent" stroke="transparent" font-size="30px">73</text></g><g class="vert-line"><rect x="1034.8979591836735" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1054.8979591836735" y="20" fill="transparent" stroke="transparent" font-size="30px">69</text></g><g class="vert-line"><rect x="1060.408163265306" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1080.408163265306" y="20" fill="transparent" stroke="transparent" font-size="30px">65</text></g><g class="vert-line"><rect x="1085.9183673469388" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1105.9183673469388" y="20" fill="transparent" stroke="transparent" font-size="30px">69</text></g><g class="vert-line"><rect x="1111.4285714285713" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1131.4285714285713" y="20" fill="transparent" stroke="transparent" font-size="30px">65</text></g><g class="vert-line"><rect x="1136.938775510204" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1156.938775510204" y="20" fill="transparent" stroke="transparent" font-size="30px">73</text></g><g class="vert-line"><rect x="1162.4489795918366" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1182.4489795918366" y="20" fill="transparent" stroke="transparent" font-size="30px">73</text></g><g class="vert-line"><rect x="1187.9591836734694" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1207.9591836734694" y="20" fill="transparent" stroke="transparent" font-size="30px">78</text></g><g class="vert-line"><rect x="1213.4693877551022" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1233.4693877551022" y="20" fill="transparent" stroke="transparent" font-size="30px">78</text></g><g class="vert-line"><rect x="1238.9795918367347" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1258.9795918367347" y="20" fill="transparent" stroke="transparent" font-size="30px">88</text></g><g class="vert-line"><rect x="1264.4897959183672" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1284.4897959183672" y="20" fill="transparent" stroke="transparent" font-size="30px">88</text></g><g class="vert-line"><rect x="1290.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1310.0" y="20" fill="transparent" stroke="transparent" font-size="30px">88</text></g></svg></div></td>
  </tr>
  <tr>
    <td class="gt_row gt_left">Tue, May 9, 2023</td>
    <td class="gt_row gt_left"><div><svg viewbox="0 0 1325 130" style="height: 2em; margin-left: auto; margin-right: auto; font-size: inherit; overflow: visible; vertical-align: middle; position:relative;"><defs><pattern id="area_pattern" width="8" height="8" patternunits="userSpaceOnUse"><path class="pattern-line" d="M 0,8 l 8,-8 M -1,1 l 4,-4 M 6,10 l 4,-4" stroke="#FF0000" stroke-width="1.5" stroke-linecap="round" shape-rendering="geometricPrecision"></path></pattern></defs><style> text { font-family: ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace; stroke-width: 0.15em; paint-order: stroke; stroke-linejoin: round; cursor: default; } .vert-line:hover rect { fill: #911EB4; fill-opacity: 40%; stroke: #FFFFFF60; color: red; } .vert-line:hover text { stroke: white; fill: #212427; } .horizontal-line:hover text {stroke: white; fill: #212427; } .ref-line:hover rect { stroke: #FFFFFF60; } .ref-line:hover line { stroke: #FF0000; } .ref-line:hover text { stroke: white; fill: #212427; } .y-axis-line:hover rect { fill: #EDEDED; fill-opacity: 60%; stroke: #FFFFFF60; color: red; } .y-axis-line:hover text { stroke: white; stroke-width: 0.20em; fill: #1A1C1F; } </style><path d="M 50.0,86.94244604316548 C 62.5,86.94244604316548 63.02083333333333,79.02877697841727 75.52083333333333,79.02877697841727 C 88.02083333333333,79.02877697841727 88.54166666666666,66.79856115107913 101.04166666666666,66.79856115107913 C 113.54166666666666,66.79856115107913 114.0625,58.88489208633095 126.5625,58.88489208633095 C 139.0625,58.88489208633095 139.58333333333331,66.79856115107913 152.08333333333331,66.79856115107913 C 164.58333333333331,66.79856115107913 165.10416666666669,66.79856115107913 177.60416666666669,66.79856115107913 C 190.10416666666669,66.79856115107913 190.625,71.11510791366908 203.125,71.11510791366908 C 215.625,71.11510791366908 216.14583333333334,79.02877697841727 228.64583333333334,79.02877697841727 C 241.14583333333334,79.02877697841727 241.66666666666666,102.76978417266189 254.16666666666666,102.76978417266189 C 266.66666666666663,102.76978417266189 267.1875,102.76978417266189 279.6875,102.76978417266189 C 292.1875,102.76978417266189 292.70833333333337,94.85611510791368 305.20833333333337,94.85611510791368 C 317.70833333333337,94.85611510791368 318.22916666666663,94.85611510791368 330.72916666666663,94.85611510791368 C 343.22916666666663,94.85611510791368 343.75,94.85611510791368 356.25,94.85611510791368 C 368.75,94.85611510791368 369.2708333333333,102.76978417266189 381.7708333333333,102.76978417266189 C 394.2708333333333,102.76978417266189 394.7916666666667,102.76978417266189 407.2916666666667,102.76978417266189 C 419.7916666666667,102.76978417266189 420.3125,107.08633093525181 432.8125,107.08633093525181 C 445.3125,107.08633093525181 445.8333333333333,107.08633093525181 458.3333333333333,107.08633093525181 C 470.8333333333333,107.08633093525181 471.3541666666667,107.08633093525181 483.8541666666667,107.08633093525181 C 496.3541666666667,107.08633093525181 496.875,107.08633093525181 509.375,107.08633093525181 C 521.875,107.08633093525181 522.3958333333333,102.76978417266189 534.8958333333333,102.76978417266189 C 547.3958333333333,102.76978417266189 547.9166666666667,102.76978417266189 560.4166666666667,102.76978417266189 C 572.9166666666667,102.76978417266189 573.4375,102.76978417266189 585.9375,102.76978417266189 C 598.4375,102.76978417266189 598.9583333333333,102.76978417266189 611.4583333333333,102.76978417266189 C 623.9583333333333,102.76978417266189 624.4791666666667,102.76978417266189 636.9791666666667,102.76978417266189 C 649.4791666666667,102.76978417266189 650.0,102.76978417266189 662.5,102.76978417266189 C 675.0,102.76978417266189 675.5208333333334,102.76978417266189 688.0208333333334,102.76978417266189 C 700.5208333333334,102.76978417266189 701.0416666666666,94.85611510791368 713.5416666666666,94.85611510791368 C 726.0416666666666,94.85611510791368 726.5625,86.94244604316548 739.0625,86.94244604316548 C 751.5625,86.94244604316548 752.0833333333334,94.85611510791368 764.5833333333334,94.85611510791368 C 777.0833333333334,94.85611510791368 777.6041666666666,94.85611510791368 790.1041666666666,94.85611510791368 C 802.6041666666666,94.85611510791368 803.125,79.02877697841727 815.625,79.02877697841727 C 828.125,79.02877697841727 828.6458333333334,66.79856115107913 841.1458333333334,66.79856115107913 C 853.6458333333334,66.79856115107913 854.1666666666666,30.827338129496404 866.6666666666666,30.827338129496404 C 879.1666666666666,30.827338129496404 879.6875,15.0 892.1875,15.0 C 904.6875,15.0 905.2083333333334,15.0 917.7083333333334,15.0 C 930.2083333333334,15.0 930.7291666666666,15.0 943.2291666666666,15.0 C 955.7291666666666,15.0 956.25,35.14388489208634 968.75,35.14388489208634 C 981.25,35.14388489208634 981.7708333333334,30.827338129496404 994.2708333333334,30.827338129496404 C 1006.7708333333334,30.827338129496404 1007.2916666666666,22.913669064748206 1019.7916666666666,22.913669064748206 C 1032.2916666666665,22.913669064748206 1032.8125,22.913669064748206 1045.3125,22.913669064748206 C 1057.8125,22.913669064748206 1058.3333333333335,22.913669064748206 1070.8333333333335,22.913669064748206 C 1083.3333333333335,22.913669064748206 1083.8541666666665,35.14388489208634 1096.3541666666665,35.14388489208634 C 1108.8541666666665,35.14388489208634 1109.375,35.14388489208634 1121.875,35.14388489208634 C 1134.375,35.14388489208634 1134.8958333333335,35.14388489208634 1147.3958333333335,35.14388489208634 C 1159.8958333333335,35.14388489208634 1160.4166666666665,35.14388489208634 1172.9166666666665,35.14388489208634 C 1185.4166666666665,35.14388489208634 1185.9375,35.14388489208634 1198.4375,35.14388489208634 C 1210.9375,35.14388489208634 1211.4583333333335,43.057553956834525 1223.9583333333335,43.057553956834525 C 1236.4583333333335,43.057553956834525 1236.9791666666665,43.057553956834525 1249.4791666666665,43.057553956834525 C 1261.9791666666665,43.057553956834525 1262.5,50.97122302158273 1275.0,50.97122302158273" stroke="gray" stroke-width="4" fill="none"></path><circle cx="50.0" cy="86.94244604316548" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="75.52083333333333" cy="79.02877697841727" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="101.04166666666666" cy="66.79856115107913" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="126.5625" cy="58.88489208633095" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="152.08333333333331" cy="66.79856115107913" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="177.60416666666669" cy="66.79856115107913" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="203.125" cy="71.11510791366908" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="228.64583333333334" cy="79.02877697841727" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="254.16666666666666" cy="102.76978417266189" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="279.6875" cy="102.76978417266189" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="305.20833333333337" cy="94.85611510791368" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="330.72916666666663" cy="94.85611510791368" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="356.25" cy="94.85611510791368" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="381.7708333333333" cy="102.76978417266189" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="407.2916666666667" cy="102.76978417266189" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="432.8125" cy="107.08633093525181" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="458.3333333333333" cy="107.08633093525181" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="483.8541666666667" cy="107.08633093525181" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="509.375" cy="107.08633093525181" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="534.8958333333333" cy="102.76978417266189" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="560.4166666666667" cy="102.76978417266189" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="585.9375" cy="102.76978417266189" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="611.4583333333333" cy="102.76978417266189" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="636.9791666666667" cy="102.76978417266189" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="662.5" cy="102.76978417266189" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="688.0208333333334" cy="102.76978417266189" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="713.5416666666666" cy="94.85611510791368" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="739.0625" cy="86.94244604316548" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="764.5833333333334" cy="94.85611510791368" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="790.1041666666666" cy="94.85611510791368" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="815.625" cy="79.02877697841727" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="841.1458333333334" cy="66.79856115107913" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="866.6666666666666" cy="30.827338129496404" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="892.1875" cy="15.0" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="917.7083333333334" cy="15.0" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="943.2291666666666" cy="15.0" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="968.75" cy="35.14388489208634" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="994.2708333333334" cy="30.827338129496404" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1019.7916666666666" cy="22.913669064748206" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1045.3125" cy="22.913669064748206" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1070.8333333333335" cy="22.913669064748206" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1096.3541666666665" cy="35.14388489208634" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1121.875" cy="35.14388489208634" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1147.3958333333335" cy="35.14388489208634" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1172.9166666666665" cy="35.14388489208634" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1198.4375" cy="35.14388489208634" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1223.9583333333335" cy="43.057553956834525" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1249.4791666666665" cy="43.057553956834525" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1275.0" cy="50.97122302158273" r="4" stroke="black" stroke-width="4" fill="white"></circle><g class="y-axis-line"><rect x="0" y="0" width="65" height="130" stroke="transparent" stroke-width="0" fill="transparent"></rect><text x="0" y="19.0" fill="transparent" stroke="transparent" font-size="25">30.0</text><text x="0" y="126.0" fill="transparent" stroke="transparent" font-size="25">16.1</text></g><g class="vert-line"><rect x="40.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="60.0" y="20" fill="transparent" stroke="transparent" font-size="30px">20.0</text></g><g class="vert-line"><rect x="65.52083333333333" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="85.52083333333333" y="20" fill="transparent" stroke="transparent" font-size="30px">21.1</text></g><g class="vert-line"><rect x="91.04166666666666" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="111.04166666666666" y="20" fill="transparent" stroke="transparent" font-size="30px">22.8</text></g><g class="vert-line"><rect x="116.5625" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="136.5625" y="20" fill="transparent" stroke="transparent" font-size="30px">23.9</text></g><g class="vert-line"><rect x="142.08333333333331" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="162.08333333333331" y="20" fill="transparent" stroke="transparent" font-size="30px">22.8</text></g><g class="vert-line"><rect x="167.60416666666669" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="187.60416666666669" y="20" fill="transparent" stroke="transparent" font-size="30px">22.8</text></g><g class="vert-line"><rect x="193.125" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="213.125" y="20" fill="transparent" stroke="transparent" font-size="30px">22.2</text></g><g class="vert-line"><rect x="218.64583333333334" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="238.64583333333334" y="20" fill="transparent" stroke="transparent" font-size="30px">21.1</text></g><g class="vert-line"><rect x="244.16666666666666" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="264.16666666666663" y="20" fill="transparent" stroke="transparent" font-size="30px">17.8</text></g><g class="vert-line"><rect x="269.6875" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="289.6875" y="20" fill="transparent" stroke="transparent" font-size="30px">17.8</text></g><g class="vert-line"><rect x="295.20833333333337" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="315.20833333333337" y="20" fill="transparent" stroke="transparent" font-size="30px">18.9</text></g><g class="vert-line"><rect x="320.72916666666663" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="340.72916666666663" y="20" fill="transparent" stroke="transparent" font-size="30px">18.9</text></g><g class="vert-line"><rect x="346.25" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="366.25" y="20" fill="transparent" stroke="transparent" font-size="30px">18.9</text></g><g class="vert-line"><rect x="371.7708333333333" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="391.7708333333333" y="20" fill="transparent" stroke="transparent" font-size="30px">17.8</text></g><g class="vert-line"><rect x="397.2916666666667" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="417.2916666666667" y="20" fill="transparent" stroke="transparent" font-size="30px">17.8</text></g><g class="vert-line"><rect x="422.8125" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="442.8125" y="20" fill="transparent" stroke="transparent" font-size="30px">17.2</text></g><g class="vert-line"><rect x="448.3333333333333" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="468.3333333333333" y="20" fill="transparent" stroke="transparent" font-size="30px">17.2</text></g><g class="vert-line"><rect x="473.8541666666667" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="493.8541666666667" y="20" fill="transparent" stroke="transparent" font-size="30px">17.2</text></g><g class="vert-line"><rect x="499.375" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="519.375" y="20" fill="transparent" stroke="transparent" font-size="30px">17.2</text></g><g class="vert-line"><rect x="524.8958333333333" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="544.8958333333333" y="20" fill="transparent" stroke="transparent" font-size="30px">17.8</text></g><g class="vert-line"><rect x="550.4166666666667" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="570.4166666666667" y="20" fill="transparent" stroke="transparent" font-size="30px">17.8</text></g><g class="vert-line"><rect x="575.9375" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="595.9375" y="20" fill="transparent" stroke="transparent" font-size="30px">17.8</text></g><g class="vert-line"><rect x="601.4583333333333" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="621.4583333333333" y="20" fill="transparent" stroke="transparent" font-size="30px">17.8</text></g><g class="vert-line"><rect x="626.9791666666667" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="646.9791666666667" y="20" fill="transparent" stroke="transparent" font-size="30px">17.8</text></g><g class="vert-line"><rect x="652.5" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="672.5" y="20" fill="transparent" stroke="transparent" font-size="30px">17.8</text></g><g class="vert-line"><rect x="678.0208333333334" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="698.0208333333334" y="20" fill="transparent" stroke="transparent" font-size="30px">17.8</text></g><g class="vert-line"><rect x="703.5416666666666" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="723.5416666666666" y="20" fill="transparent" stroke="transparent" font-size="30px">18.9</text></g><g class="vert-line"><rect x="729.0625" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="749.0625" y="20" fill="transparent" stroke="transparent" font-size="30px">20.0</text></g><g class="vert-line"><rect x="754.5833333333334" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="774.5833333333334" y="20" fill="transparent" stroke="transparent" font-size="30px">18.9</text></g><g class="vert-line"><rect x="780.1041666666666" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="800.1041666666666" y="20" fill="transparent" stroke="transparent" font-size="30px">18.9</text></g><g class="vert-line"><rect x="805.625" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="825.625" y="20" fill="transparent" stroke="transparent" font-size="30px">21.1</text></g><g class="vert-line"><rect x="831.1458333333334" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="851.1458333333334" y="20" fill="transparent" stroke="transparent" font-size="30px">22.8</text></g><g class="vert-line"><rect x="856.6666666666666" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="876.6666666666666" y="20" fill="transparent" stroke="transparent" font-size="30px">27.8</text></g><g class="vert-line"><rect x="882.1875" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="902.1875" y="20" fill="transparent" stroke="transparent" font-size="30px">30.0</text></g><g class="vert-line"><rect x="907.7083333333334" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="927.7083333333334" y="20" fill="transparent" stroke="transparent" font-size="30px">30.0</text></g><g class="vert-line"><rect x="933.2291666666666" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="953.2291666666666" y="20" fill="transparent" stroke="transparent" font-size="30px">30.0</text></g><g class="vert-line"><rect x="958.75" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="978.75" y="20" fill="transparent" stroke="transparent" font-size="30px">27.2</text></g><g class="vert-line"><rect x="984.2708333333334" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1004.2708333333334" y="20" fill="transparent" stroke="transparent" font-size="30px">27.8</text></g><g class="vert-line"><rect x="1009.7916666666666" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1029.7916666666665" y="20" fill="transparent" stroke="transparent" font-size="30px">28.9</text></g><g class="vert-line"><rect x="1035.3125" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1055.3125" y="20" fill="transparent" stroke="transparent" font-size="30px">28.9</text></g><g class="vert-line"><rect x="1060.8333333333335" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1080.8333333333335" y="20" fill="transparent" stroke="transparent" font-size="30px">28.9</text></g><g class="vert-line"><rect x="1086.3541666666665" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1106.3541666666665" y="20" fill="transparent" stroke="transparent" font-size="30px">27.2</text></g><g class="vert-line"><rect x="1111.875" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1131.875" y="20" fill="transparent" stroke="transparent" font-size="30px">27.2</text></g><g class="vert-line"><rect x="1137.3958333333335" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1157.3958333333335" y="20" fill="transparent" stroke="transparent" font-size="30px">27.2</text></g><g class="vert-line"><rect x="1162.9166666666665" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1182.9166666666665" y="20" fill="transparent" stroke="transparent" font-size="30px">27.2</text></g><g class="vert-line"><rect x="1188.4375" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1208.4375" y="20" fill="transparent" stroke="transparent" font-size="30px">27.2</text></g><g class="vert-line"><rect x="1213.9583333333335" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1233.9583333333335" y="20" fill="transparent" stroke="transparent" font-size="30px">26.1</text></g><g class="vert-line"><rect x="1239.4791666666665" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1259.4791666666665" y="20" fill="transparent" stroke="transparent" font-size="30px">26.1</text></g><g class="vert-line"><rect x="1265.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1285.0" y="20" fill="transparent" stroke="transparent" font-size="30px">25.0</text></g></svg></div></td>
    <td class="gt_row gt_left"><div><svg viewbox="0 0 1325 130" style="height: 2em; margin-left: auto; margin-right: auto; font-size: inherit; overflow: visible; vertical-align: middle; position:relative;"><defs><pattern id="area_pattern" width="8" height="8" patternunits="userSpaceOnUse"><path class="pattern-line" d="M 0,8 l 8,-8 M -1,1 l 4,-4 M 6,10 l 4,-4" stroke="#FF0000" stroke-width="1.5" stroke-linecap="round" shape-rendering="geometricPrecision"></path></pattern></defs><style> text { font-family: ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace; stroke-width: 0.15em; paint-order: stroke; stroke-linejoin: round; cursor: default; } .vert-line:hover rect { fill: #911EB4; fill-opacity: 40%; stroke: #FFFFFF60; color: red; } .vert-line:hover text { stroke: white; fill: #212427; } .horizontal-line:hover text {stroke: white; fill: #212427; } .ref-line:hover rect { stroke: #FFFFFF60; } .ref-line:hover line { stroke: #FF0000; } .ref-line:hover text { stroke: white; fill: #212427; } .y-axis-line:hover rect { fill: #EDEDED; fill-opacity: 60%; stroke: #FFFFFF60; color: red; } .y-axis-line:hover text { stroke: white; stroke-width: 0.20em; fill: #1A1C1F; } </style><path d="M 50.0,41.98412698412699 C 62.5,41.98412698412699 63.02083333333333,57.85714285714286 75.52083333333333,57.85714285714286 C 88.02083333333333,57.85714285714286 88.54166666666666,83.25396825396827 101.04166666666666,83.25396825396827 C 113.54166666666666,83.25396825396827 114.0625,94.36507936507937 126.5625,94.36507936507937 C 139.0625,94.36507936507937 139.58333333333331,89.60317460317461 152.08333333333331,89.60317460317461 C 164.58333333333331,89.60317460317461 165.10416666666669,89.60317460317461 177.60416666666669,89.60317460317461 C 190.10416666666669,89.60317460317461 190.625,83.25396825396827 203.125,83.25396825396827 C 215.625,83.25396825396827 216.14583333333334,72.14285714285714 228.64583333333334,72.14285714285714 C 241.14583333333334,72.14285714285714 241.66666666666666,24.523809523809526 254.16666666666666,24.523809523809526 C 266.66666666666663,24.523809523809526 267.1875,24.523809523809526 279.6875,24.523809523809526 C 292.1875,24.523809523809526 292.70833333333337,34.04761904761905 305.20833333333337,34.04761904761905 C 317.70833333333337,34.04761904761905 318.22916666666663,34.04761904761905 330.72916666666663,34.04761904761905 C 343.22916666666663,34.04761904761905 343.75,24.523809523809526 356.25,24.523809523809526 C 368.75,24.523809523809526 369.2708333333333,15.0 381.7708333333333,15.0 C 394.2708333333333,15.0 394.7916666666667,24.523809523809526 407.2916666666667,24.523809523809526 C 419.7916666666667,24.523809523809526 420.3125,24.523809523809526 432.8125,24.523809523809526 C 445.3125,24.523809523809526 445.8333333333333,15.0 458.3333333333333,15.0 C 470.8333333333333,15.0 471.3541666666667,15.0 483.8541666666667,15.0 C 496.3541666666667,15.0 496.875,24.523809523809526 509.375,24.523809523809526 C 521.875,24.523809523809526 522.3958333333333,24.523809523809526 534.8958333333333,24.523809523809526 C 547.3958333333333,24.523809523809526 547.9166666666667,34.04761904761905 560.4166666666667,34.04761904761905 C 572.9166666666667,34.04761904761905 573.4375,34.04761904761905 585.9375,34.04761904761905 C 598.4375,34.04761904761905 598.9583333333333,34.04761904761905 611.4583333333333,34.04761904761905 C 623.9583333333333,34.04761904761905 624.4791666666667,34.04761904761905 636.9791666666667,34.04761904761905 C 649.4791666666667,34.04761904761905 650.0,34.04761904761905 662.5,34.04761904761905 C 675.0,34.04761904761905 675.5208333333334,34.04761904761905 688.0208333333334,34.04761904761905 C 700.5208333333334,34.04761904761905 701.0416666666666,41.98412698412699 713.5416666666666,41.98412698412699 C 726.0416666666666,41.98412698412699 726.5625,49.92063492063492 739.0625,49.92063492063492 C 751.5625,49.92063492063492 752.0833333333334,41.98412698412699 764.5833333333334,41.98412698412699 C 777.0833333333334,41.98412698412699 777.6041666666666,41.98412698412699 790.1041666666666,41.98412698412699 C 802.6041666666666,41.98412698412699 803.125,49.92063492063492 815.625,49.92063492063492 C 828.125,49.92063492063492 828.6458333333334,64.20634920634922 841.1458333333334,64.20634920634922 C 853.6458333333334,64.20634920634922 854.1666666666666,102.3015873015873 866.6666666666666,102.3015873015873 C 879.1666666666666,102.3015873015873 879.6875,115.0 892.1875,115.0 C 904.6875,115.0 905.2083333333334,115.0 917.7083333333334,115.0 C 930.2083333333334,115.0 930.7291666666666,115.0 943.2291666666666,115.0 C 955.7291666666666,115.0 956.25,97.53968253968253 968.75,97.53968253968253 C 981.25,97.53968253968253 981.7708333333334,107.06349206349206 994.2708333333334,107.06349206349206 C 1006.7708333333334,107.06349206349206 1007.2916666666666,107.06349206349206 1019.7916666666666,107.06349206349206 C 1032.2916666666665,107.06349206349206 1032.8125,110.23809523809523 1045.3125,110.23809523809523 C 1057.8125,110.23809523809523 1058.3333333333335,110.23809523809523 1070.8333333333335,110.23809523809523 C 1083.3333333333335,110.23809523809523 1083.8541666666665,97.53968253968253 1096.3541666666665,97.53968253968253 C 1108.8541666666665,97.53968253968253 1109.375,97.53968253968253 1121.875,97.53968253968253 C 1134.375,97.53968253968253 1134.8958333333335,102.3015873015873 1147.3958333333335,102.3015873015873 C 1159.8958333333335,102.3015873015873 1160.4166666666665,102.3015873015873 1172.9166666666665,102.3015873015873 C 1185.4166666666665,102.3015873015873 1185.9375,102.3015873015873 1198.4375,102.3015873015873 C 1210.9375,102.3015873015873 1211.4583333333335,99.12698412698413 1223.9583333333335,99.12698412698413 C 1236.4583333333335,99.12698412698413 1236.9791666666665,99.12698412698413 1249.4791666666665,99.12698412698413 C 1261.9791666666665,99.12698412698413 1262.5,94.36507936507937 1275.0,94.36507936507937" stroke="gray" stroke-width="4" fill="none"></path><circle cx="50.0" cy="41.98412698412699" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="75.52083333333333" cy="57.85714285714286" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="101.04166666666666" cy="83.25396825396827" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="126.5625" cy="94.36507936507937" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="152.08333333333331" cy="89.60317460317461" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="177.60416666666669" cy="89.60317460317461" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="203.125" cy="83.25396825396827" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="228.64583333333334" cy="72.14285714285714" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="254.16666666666666" cy="24.523809523809526" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="279.6875" cy="24.523809523809526" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="305.20833333333337" cy="34.04761904761905" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="330.72916666666663" cy="34.04761904761905" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="356.25" cy="24.523809523809526" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="381.7708333333333" cy="15.0" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="407.2916666666667" cy="24.523809523809526" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="432.8125" cy="24.523809523809526" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="458.3333333333333" cy="15.0" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="483.8541666666667" cy="15.0" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="509.375" cy="24.523809523809526" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="534.8958333333333" cy="24.523809523809526" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="560.4166666666667" cy="34.04761904761905" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="585.9375" cy="34.04761904761905" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="611.4583333333333" cy="34.04761904761905" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="636.9791666666667" cy="34.04761904761905" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="662.5" cy="34.04761904761905" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="688.0208333333334" cy="34.04761904761905" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="713.5416666666666" cy="41.98412698412699" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="739.0625" cy="49.92063492063492" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="764.5833333333334" cy="41.98412698412699" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="790.1041666666666" cy="41.98412698412699" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="815.625" cy="49.92063492063492" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="841.1458333333334" cy="64.20634920634922" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="866.6666666666666" cy="102.3015873015873" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="892.1875" cy="115.0" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="917.7083333333334" cy="115.0" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="943.2291666666666" cy="115.0" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="968.75" cy="97.53968253968253" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="994.2708333333334" cy="107.06349206349206" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1019.7916666666666" cy="107.06349206349206" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1045.3125" cy="110.23809523809523" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1070.8333333333335" cy="110.23809523809523" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1096.3541666666665" cy="97.53968253968253" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1121.875" cy="97.53968253968253" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1147.3958333333335" cy="102.3015873015873" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1172.9166666666665" cy="102.3015873015873" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1198.4375" cy="102.3015873015873" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1223.9583333333335" cy="99.12698412698413" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1249.4791666666665" cy="99.12698412698413" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1275.0" cy="94.36507936507937" r="4" stroke="black" stroke-width="4" fill="white"></circle><g class="y-axis-line"><rect x="0" y="0" width="65" height="130" stroke="transparent" stroke-width="0" fill="transparent"></rect><text x="0" y="19.0" fill="transparent" stroke="transparent" font-size="25">100</text><text x="0" y="126.0" fill="transparent" stroke="transparent" font-size="25">37.0</text></g><g class="vert-line"><rect x="40.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="60.0" y="20" fill="transparent" stroke="transparent" font-size="30px">83.0</text></g><g class="vert-line"><rect x="65.52083333333333" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="85.52083333333333" y="20" fill="transparent" stroke="transparent" font-size="30px">73.0</text></g><g class="vert-line"><rect x="91.04166666666666" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="111.04166666666666" y="20" fill="transparent" stroke="transparent" font-size="30px">57.0</text></g><g class="vert-line"><rect x="116.5625" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="136.5625" y="20" fill="transparent" stroke="transparent" font-size="30px">50.0</text></g><g class="vert-line"><rect x="142.08333333333331" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="162.08333333333331" y="20" fill="transparent" stroke="transparent" font-size="30px">53.0</text></g><g class="vert-line"><rect x="167.60416666666669" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="187.60416666666669" y="20" fill="transparent" stroke="transparent" font-size="30px">53.0</text></g><g class="vert-line"><rect x="193.125" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="213.125" y="20" fill="transparent" stroke="transparent" font-size="30px">57.0</text></g><g class="vert-line"><rect x="218.64583333333334" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="238.64583333333334" y="20" fill="transparent" stroke="transparent" font-size="30px">64.0</text></g><g class="vert-line"><rect x="244.16666666666666" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="264.16666666666663" y="20" fill="transparent" stroke="transparent" font-size="30px">94.0</text></g><g class="vert-line"><rect x="269.6875" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="289.6875" y="20" fill="transparent" stroke="transparent" font-size="30px">94.0</text></g><g class="vert-line"><rect x="295.20833333333337" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="315.20833333333337" y="20" fill="transparent" stroke="transparent" font-size="30px">88.0</text></g><g class="vert-line"><rect x="320.72916666666663" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="340.72916666666663" y="20" fill="transparent" stroke="transparent" font-size="30px">88.0</text></g><g class="vert-line"><rect x="346.25" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="366.25" y="20" fill="transparent" stroke="transparent" font-size="30px">94.0</text></g><g class="vert-line"><rect x="371.7708333333333" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="391.7708333333333" y="20" fill="transparent" stroke="transparent" font-size="30px">100</text></g><g class="vert-line"><rect x="397.2916666666667" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="417.2916666666667" y="20" fill="transparent" stroke="transparent" font-size="30px">94.0</text></g><g class="vert-line"><rect x="422.8125" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="442.8125" y="20" fill="transparent" stroke="transparent" font-size="30px">94.0</text></g><g class="vert-line"><rect x="448.3333333333333" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="468.3333333333333" y="20" fill="transparent" stroke="transparent" font-size="30px">100</text></g><g class="vert-line"><rect x="473.8541666666667" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="493.8541666666667" y="20" fill="transparent" stroke="transparent" font-size="30px">100</text></g><g class="vert-line"><rect x="499.375" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="519.375" y="20" fill="transparent" stroke="transparent" font-size="30px">94.0</text></g><g class="vert-line"><rect x="524.8958333333333" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="544.8958333333333" y="20" fill="transparent" stroke="transparent" font-size="30px">94.0</text></g><g class="vert-line"><rect x="550.4166666666667" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="570.4166666666667" y="20" fill="transparent" stroke="transparent" font-size="30px">88.0</text></g><g class="vert-line"><rect x="575.9375" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="595.9375" y="20" fill="transparent" stroke="transparent" font-size="30px">88.0</text></g><g class="vert-line"><rect x="601.4583333333333" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="621.4583333333333" y="20" fill="transparent" stroke="transparent" font-size="30px">88.0</text></g><g class="vert-line"><rect x="626.9791666666667" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="646.9791666666667" y="20" fill="transparent" stroke="transparent" font-size="30px">88.0</text></g><g class="vert-line"><rect x="652.5" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="672.5" y="20" fill="transparent" stroke="transparent" font-size="30px">88.0</text></g><g class="vert-line"><rect x="678.0208333333334" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="698.0208333333334" y="20" fill="transparent" stroke="transparent" font-size="30px">88.0</text></g><g class="vert-line"><rect x="703.5416666666666" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="723.5416666666666" y="20" fill="transparent" stroke="transparent" font-size="30px">83.0</text></g><g class="vert-line"><rect x="729.0625" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="749.0625" y="20" fill="transparent" stroke="transparent" font-size="30px">78.0</text></g><g class="vert-line"><rect x="754.5833333333334" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="774.5833333333334" y="20" fill="transparent" stroke="transparent" font-size="30px">83.0</text></g><g class="vert-line"><rect x="780.1041666666666" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="800.1041666666666" y="20" fill="transparent" stroke="transparent" font-size="30px">83.0</text></g><g class="vert-line"><rect x="805.625" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="825.625" y="20" fill="transparent" stroke="transparent" font-size="30px">78.0</text></g><g class="vert-line"><rect x="831.1458333333334" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="851.1458333333334" y="20" fill="transparent" stroke="transparent" font-size="30px">69.0</text></g><g class="vert-line"><rect x="856.6666666666666" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="876.6666666666666" y="20" fill="transparent" stroke="transparent" font-size="30px">45.0</text></g><g class="vert-line"><rect x="882.1875" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="902.1875" y="20" fill="transparent" stroke="transparent" font-size="30px">37.0</text></g><g class="vert-line"><rect x="907.7083333333334" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="927.7083333333334" y="20" fill="transparent" stroke="transparent" font-size="30px">37.0</text></g><g class="vert-line"><rect x="933.2291666666666" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="953.2291666666666" y="20" fill="transparent" stroke="transparent" font-size="30px">37.0</text></g><g class="vert-line"><rect x="958.75" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="978.75" y="20" fill="transparent" stroke="transparent" font-size="30px">48.0</text></g><g class="vert-line"><rect x="984.2708333333334" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1004.2708333333334" y="20" fill="transparent" stroke="transparent" font-size="30px">42.0</text></g><g class="vert-line"><rect x="1009.7916666666666" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1029.7916666666665" y="20" fill="transparent" stroke="transparent" font-size="30px">42.0</text></g><g class="vert-line"><rect x="1035.3125" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1055.3125" y="20" fill="transparent" stroke="transparent" font-size="30px">40.0</text></g><g class="vert-line"><rect x="1060.8333333333335" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1080.8333333333335" y="20" fill="transparent" stroke="transparent" font-size="30px">40.0</text></g><g class="vert-line"><rect x="1086.3541666666665" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1106.3541666666665" y="20" fill="transparent" stroke="transparent" font-size="30px">48.0</text></g><g class="vert-line"><rect x="1111.875" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1131.875" y="20" fill="transparent" stroke="transparent" font-size="30px">48.0</text></g><g class="vert-line"><rect x="1137.3958333333335" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1157.3958333333335" y="20" fill="transparent" stroke="transparent" font-size="30px">45.0</text></g><g class="vert-line"><rect x="1162.9166666666665" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1182.9166666666665" y="20" fill="transparent" stroke="transparent" font-size="30px">45.0</text></g><g class="vert-line"><rect x="1188.4375" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1208.4375" y="20" fill="transparent" stroke="transparent" font-size="30px">45.0</text></g><g class="vert-line"><rect x="1213.9583333333335" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1233.9583333333335" y="20" fill="transparent" stroke="transparent" font-size="30px">47.0</text></g><g class="vert-line"><rect x="1239.4791666666665" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1259.4791666666665" y="20" fill="transparent" stroke="transparent" font-size="30px">47.0</text></g><g class="vert-line"><rect x="1265.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1285.0" y="20" fill="transparent" stroke="transparent" font-size="30px">50.0</text></g></svg></div></td>
  </tr>
  <tr>
    <td class="gt_row gt_left">Wed, May 10, 2023</td>
    <td class="gt_row gt_left"><div><svg viewbox="0 0 1300 130" style="height: 2em; margin-left: auto; margin-right: auto; font-size: inherit; overflow: visible; vertical-align: middle; position:relative;"><defs><pattern id="area_pattern" width="8" height="8" patternunits="userSpaceOnUse"><path class="pattern-line" d="M 0,8 l 8,-8 M -1,1 l 4,-4 M 6,10 l 4,-4" stroke="#FF0000" stroke-width="1.5" stroke-linecap="round" shape-rendering="geometricPrecision"></path></pattern></defs><style> text { font-family: ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace; stroke-width: 0.15em; paint-order: stroke; stroke-linejoin: round; cursor: default; } .vert-line:hover rect { fill: #911EB4; fill-opacity: 40%; stroke: #FFFFFF60; color: red; } .vert-line:hover text { stroke: white; fill: #212427; } .horizontal-line:hover text {stroke: white; fill: #212427; } .ref-line:hover rect { stroke: #FFFFFF60; } .ref-line:hover line { stroke: #FF0000; } .ref-line:hover text { stroke: white; fill: #212427; } .y-axis-line:hover rect { fill: #EDEDED; fill-opacity: 60%; stroke: #FFFFFF60; color: red; } .y-axis-line:hover text { stroke: white; stroke-width: 0.20em; fill: #1A1C1F; } </style><path d="M 50.0,50.97122302158273 C 62.5,50.97122302158273 63.03191489361703,50.97122302158273 75.53191489361703,50.97122302158273 C 88.03191489361703,50.97122302158273 88.56382978723404,50.97122302158273 101.06382978723404,50.97122302158273 C 113.56382978723404,50.97122302158273 114.09574468085106,50.97122302158273 126.59574468085106,50.97122302158273 C 139.09574468085106,50.97122302158273 139.62765957446808,50.97122302158273 152.12765957446808,50.97122302158273 C 164.62765957446808,50.97122302158273 165.1595744680851,50.97122302158273 177.6595744680851,50.97122302158273 C 190.1595744680851,50.97122302158273 190.6914893617021,58.88489208633095 203.1914893617021,58.88489208633095 C 215.6914893617021,58.88489208633095 216.22340425531914,58.88489208633095 228.72340425531914,58.88489208633095 C 241.22340425531914,58.88489208633095 241.75531914893617,58.88489208633095 254.25531914893617,58.88489208633095 C 266.75531914893617,58.88489208633095 267.2872340425532,58.88489208633095 279.7872340425532,58.88489208633095 C 292.2872340425532,58.88489208633095 292.8191489361702,58.88489208633095 305.3191489361702,58.88489208633095 C 317.8191489361702,58.88489208633095 318.3510638297872,66.79856115107913 330.8510638297872,66.79856115107913 C 343.3510638297872,66.79856115107913 343.8829787234042,66.79856115107913 356.3829787234042,66.79856115107913 C 368.8829787234042,66.79856115107913 369.4148936170213,66.79856115107913 381.9148936170213,66.79856115107913 C 394.4148936170213,66.79856115107913 394.9468085106383,71.11510791366908 407.4468085106383,71.11510791366908 C 419.9468085106383,71.11510791366908 420.47872340425533,79.02877697841727 432.97872340425533,79.02877697841727 C 445.47872340425533,79.02877697841727 446.01063829787233,71.11510791366908 458.51063829787233,71.11510791366908 C 471.01063829787233,71.11510791366908 471.5425531914894,58.88489208633095 484.0425531914894,58.88489208633095 C 496.5425531914894,58.88489208633095 497.0744680851064,66.79856115107913 509.5744680851064,66.79856115107913 C 522.0744680851064,66.79856115107913 522.6063829787233,71.11510791366908 535.1063829787233,71.11510791366908 C 547.6063829787233,71.11510791366908 548.1382978723404,71.11510791366908 560.6382978723404,71.11510791366908 C 573.1382978723404,71.11510791366908 573.6702127659574,71.11510791366908 586.1702127659574,71.11510791366908 C 598.6702127659574,71.11510791366908 599.2021276595744,71.11510791366908 611.7021276595744,71.11510791366908 C 624.2021276595744,71.11510791366908 624.7340425531914,71.11510791366908 637.2340425531914,71.11510791366908 C 649.7340425531914,71.11510791366908 650.2659574468084,71.11510791366908 662.7659574468084,71.11510791366908 C 675.2659574468084,71.11510791366908 675.7978723404256,66.79856115107913 688.2978723404256,66.79856115107913 C 700.7978723404256,66.79856115107913 701.3297872340426,66.79856115107913 713.8297872340426,66.79856115107913 C 726.3297872340426,66.79856115107913 726.8617021276597,66.79856115107913 739.3617021276597,66.79856115107913 C 751.8617021276597,66.79856115107913 752.3936170212766,66.79856115107913 764.8936170212766,66.79856115107913 C 777.3936170212766,66.79856115107913 777.9255319148937,71.11510791366908 790.4255319148937,71.11510791366908 C 802.9255319148937,71.11510791366908 803.4574468085107,66.79856115107913 815.9574468085107,66.79856115107913 C 828.4574468085107,66.79856115107913 828.9893617021276,66.79856115107913 841.4893617021276,66.79856115107913 C 853.9893617021276,66.79856115107913 854.5212765957447,66.79856115107913 867.0212765957447,66.79856115107913 C 879.5212765957447,66.79856115107913 880.0531914893617,66.79856115107913 892.5531914893617,66.79856115107913 C 905.0531914893617,66.79856115107913 905.5851063829788,71.11510791366908 918.0851063829788,71.11510791366908 C 930.5851063829788,71.11510791366908 931.1170212765957,71.11510791366908 943.6170212765957,71.11510791366908 C 956.1170212765957,71.11510791366908 956.6489361702128,71.11510791366908 969.1489361702128,71.11510791366908 C 981.6489361702128,71.11510791366908 982.1808510638298,71.11510791366908 994.6808510638298,71.11510791366908 C 1007.1808510638298,71.11510791366908 1007.7127659574468,79.02877697841727 1020.2127659574468,79.02877697841727 C 1032.7127659574467,79.02877697841727 1033.2446808510638,79.02877697841727 1045.7446808510638,79.02877697841727 C 1058.2446808510638,79.02877697841727 1058.776595744681,79.02877697841727 1071.276595744681,79.02877697841727 C 1083.776595744681,79.02877697841727 1084.308510638298,79.02877697841727 1096.808510638298,79.02877697841727 C 1109.308510638298,79.02877697841727 1109.840425531915,86.94244604316548 1122.340425531915,86.94244604316548 C 1134.840425531915,86.94244604316548 1135.372340425532,86.94244604316548 1147.872340425532,86.94244604316548 C 1160.372340425532,86.94244604316548 1160.904255319149,86.94244604316548 1173.404255319149,86.94244604316548 C 1185.904255319149,86.94244604316548 1186.436170212766,86.94244604316548 1198.936170212766,86.94244604316548 C 1211.436170212766,86.94244604316548 1211.968085106383,86.94244604316548 1224.468085106383,86.94244604316548 C 1236.968085106383,86.94244604316548 1237.5,86.94244604316548 1250.0,86.94244604316548" stroke="gray" stroke-width="4" fill="none"></path><circle cx="50.0" cy="50.97122302158273" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="75.53191489361703" cy="50.97122302158273" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="101.06382978723404" cy="50.97122302158273" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="126.59574468085106" cy="50.97122302158273" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="152.12765957446808" cy="50.97122302158273" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="177.6595744680851" cy="50.97122302158273" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="203.1914893617021" cy="58.88489208633095" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="228.72340425531914" cy="58.88489208633095" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="254.25531914893617" cy="58.88489208633095" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="279.7872340425532" cy="58.88489208633095" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="305.3191489361702" cy="58.88489208633095" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="330.8510638297872" cy="66.79856115107913" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="356.3829787234042" cy="66.79856115107913" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="381.9148936170213" cy="66.79856115107913" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="407.4468085106383" cy="71.11510791366908" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="432.97872340425533" cy="79.02877697841727" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="458.51063829787233" cy="71.11510791366908" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="484.0425531914894" cy="58.88489208633095" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="509.5744680851064" cy="66.79856115107913" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="535.1063829787233" cy="71.11510791366908" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="560.6382978723404" cy="71.11510791366908" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="586.1702127659574" cy="71.11510791366908" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="611.7021276595744" cy="71.11510791366908" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="637.2340425531914" cy="71.11510791366908" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="662.7659574468084" cy="71.11510791366908" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="688.2978723404256" cy="66.79856115107913" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="713.8297872340426" cy="66.79856115107913" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="739.3617021276597" cy="66.79856115107913" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="764.8936170212766" cy="66.79856115107913" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="790.4255319148937" cy="71.11510791366908" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="815.9574468085107" cy="66.79856115107913" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="841.4893617021276" cy="66.79856115107913" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="867.0212765957447" cy="66.79856115107913" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="892.5531914893617" cy="66.79856115107913" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="918.0851063829788" cy="71.11510791366908" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="943.6170212765957" cy="71.11510791366908" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="969.1489361702128" cy="71.11510791366908" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="994.6808510638298" cy="71.11510791366908" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1020.2127659574468" cy="79.02877697841727" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1045.7446808510638" cy="79.02877697841727" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1071.276595744681" cy="79.02877697841727" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1096.808510638298" cy="79.02877697841727" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1122.340425531915" cy="86.94244604316548" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1147.872340425532" cy="86.94244604316548" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1173.404255319149" cy="86.94244604316548" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1198.936170212766" cy="86.94244604316548" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1224.468085106383" cy="86.94244604316548" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1250.0" cy="86.94244604316548" r="4" stroke="black" stroke-width="4" fill="white"></circle><g class="y-axis-line"><rect x="0" y="0" width="65" height="130" stroke="transparent" stroke-width="0" fill="transparent"></rect><text x="0" y="19.0" fill="transparent" stroke="transparent" font-size="25">30.0</text><text x="0" y="126.0" fill="transparent" stroke="transparent" font-size="25">16.1</text></g><g class="vert-line"><rect x="40.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="60.0" y="20" fill="transparent" stroke="transparent" font-size="30px">25.0</text></g><g class="vert-line"><rect x="65.53191489361703" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="85.53191489361703" y="20" fill="transparent" stroke="transparent" font-size="30px">25.0</text></g><g class="vert-line"><rect x="91.06382978723404" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="111.06382978723404" y="20" fill="transparent" stroke="transparent" font-size="30px">25.0</text></g><g class="vert-line"><rect x="116.59574468085106" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="136.59574468085106" y="20" fill="transparent" stroke="transparent" font-size="30px">25.0</text></g><g class="vert-line"><rect x="142.12765957446808" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="162.12765957446808" y="20" fill="transparent" stroke="transparent" font-size="30px">25.0</text></g><g class="vert-line"><rect x="167.6595744680851" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="187.6595744680851" y="20" fill="transparent" stroke="transparent" font-size="30px">25.0</text></g><g class="vert-line"><rect x="193.1914893617021" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="213.1914893617021" y="20" fill="transparent" stroke="transparent" font-size="30px">23.9</text></g><g class="vert-line"><rect x="218.72340425531914" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="238.72340425531914" y="20" fill="transparent" stroke="transparent" font-size="30px">23.9</text></g><g class="vert-line"><rect x="244.25531914893617" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="264.25531914893617" y="20" fill="transparent" stroke="transparent" font-size="30px">23.9</text></g><g class="vert-line"><rect x="269.7872340425532" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="289.7872340425532" y="20" fill="transparent" stroke="transparent" font-size="30px">23.9</text></g><g class="vert-line"><rect x="295.3191489361702" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="315.3191489361702" y="20" fill="transparent" stroke="transparent" font-size="30px">23.9</text></g><g class="vert-line"><rect x="320.8510638297872" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="340.8510638297872" y="20" fill="transparent" stroke="transparent" font-size="30px">22.8</text></g><g class="vert-line"><rect x="346.3829787234042" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="366.3829787234042" y="20" fill="transparent" stroke="transparent" font-size="30px">22.8</text></g><g class="vert-line"><rect x="371.9148936170213" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="391.9148936170213" y="20" fill="transparent" stroke="transparent" font-size="30px">22.8</text></g><g class="vert-line"><rect x="397.4468085106383" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="417.4468085106383" y="20" fill="transparent" stroke="transparent" font-size="30px">22.2</text></g><g class="vert-line"><rect x="422.97872340425533" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="442.97872340425533" y="20" fill="transparent" stroke="transparent" font-size="30px">21.1</text></g><g class="vert-line"><rect x="448.51063829787233" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="468.51063829787233" y="20" fill="transparent" stroke="transparent" font-size="30px">22.2</text></g><g class="vert-line"><rect x="474.0425531914894" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="494.0425531914894" y="20" fill="transparent" stroke="transparent" font-size="30px">23.9</text></g><g class="vert-line"><rect x="499.5744680851064" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="519.5744680851064" y="20" fill="transparent" stroke="transparent" font-size="30px">22.8</text></g><g class="vert-line"><rect x="525.1063829787233" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="545.1063829787233" y="20" fill="transparent" stroke="transparent" font-size="30px">22.2</text></g><g class="vert-line"><rect x="550.6382978723404" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="570.6382978723404" y="20" fill="transparent" stroke="transparent" font-size="30px">22.2</text></g><g class="vert-line"><rect x="576.1702127659574" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="596.1702127659574" y="20" fill="transparent" stroke="transparent" font-size="30px">22.2</text></g><g class="vert-line"><rect x="601.7021276595744" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="621.7021276595744" y="20" fill="transparent" stroke="transparent" font-size="30px">22.2</text></g><g class="vert-line"><rect x="627.2340425531914" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="647.2340425531914" y="20" fill="transparent" stroke="transparent" font-size="30px">22.2</text></g><g class="vert-line"><rect x="652.7659574468084" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="672.7659574468084" y="20" fill="transparent" stroke="transparent" font-size="30px">22.2</text></g><g class="vert-line"><rect x="678.2978723404256" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="698.2978723404256" y="20" fill="transparent" stroke="transparent" font-size="30px">22.8</text></g><g class="vert-line"><rect x="703.8297872340426" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="723.8297872340426" y="20" fill="transparent" stroke="transparent" font-size="30px">22.8</text></g><g class="vert-line"><rect x="729.3617021276597" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="749.3617021276597" y="20" fill="transparent" stroke="transparent" font-size="30px">22.8</text></g><g class="vert-line"><rect x="754.8936170212766" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="774.8936170212766" y="20" fill="transparent" stroke="transparent" font-size="30px">22.8</text></g><g class="vert-line"><rect x="780.4255319148937" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="800.4255319148937" y="20" fill="transparent" stroke="transparent" font-size="30px">22.2</text></g><g class="vert-line"><rect x="805.9574468085107" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="825.9574468085107" y="20" fill="transparent" stroke="transparent" font-size="30px">22.8</text></g><g class="vert-line"><rect x="831.4893617021276" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="851.4893617021276" y="20" fill="transparent" stroke="transparent" font-size="30px">22.8</text></g><g class="vert-line"><rect x="857.0212765957447" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="877.0212765957447" y="20" fill="transparent" stroke="transparent" font-size="30px">22.8</text></g><g class="vert-line"><rect x="882.5531914893617" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="902.5531914893617" y="20" fill="transparent" stroke="transparent" font-size="30px">22.8</text></g><g class="vert-line"><rect x="908.0851063829788" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="928.0851063829788" y="20" fill="transparent" stroke="transparent" font-size="30px">22.2</text></g><g class="vert-line"><rect x="933.6170212765957" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="953.6170212765957" y="20" fill="transparent" stroke="transparent" font-size="30px">22.2</text></g><g class="vert-line"><rect x="959.1489361702128" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="979.1489361702128" y="20" fill="transparent" stroke="transparent" font-size="30px">22.2</text></g><g class="vert-line"><rect x="984.6808510638298" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1004.6808510638298" y="20" fill="transparent" stroke="transparent" font-size="30px">22.2</text></g><g class="vert-line"><rect x="1010.2127659574468" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1030.2127659574467" y="20" fill="transparent" stroke="transparent" font-size="30px">21.1</text></g><g class="vert-line"><rect x="1035.7446808510638" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1055.7446808510638" y="20" fill="transparent" stroke="transparent" font-size="30px">21.1</text></g><g class="vert-line"><rect x="1061.276595744681" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1081.276595744681" y="20" fill="transparent" stroke="transparent" font-size="30px">21.1</text></g><g class="vert-line"><rect x="1086.808510638298" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1106.808510638298" y="20" fill="transparent" stroke="transparent" font-size="30px">21.1</text></g><g class="vert-line"><rect x="1112.340425531915" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1132.340425531915" y="20" fill="transparent" stroke="transparent" font-size="30px">20.0</text></g><g class="vert-line"><rect x="1137.872340425532" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1157.872340425532" y="20" fill="transparent" stroke="transparent" font-size="30px">20.0</text></g><g class="vert-line"><rect x="1163.404255319149" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1183.404255319149" y="20" fill="transparent" stroke="transparent" font-size="30px">20.0</text></g><g class="vert-line"><rect x="1188.936170212766" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1208.936170212766" y="20" fill="transparent" stroke="transparent" font-size="30px">20.0</text></g><g class="vert-line"><rect x="1214.468085106383" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1234.468085106383" y="20" fill="transparent" stroke="transparent" font-size="30px">20.0</text></g><g class="vert-line"><rect x="1240.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1260.0" y="20" fill="transparent" stroke="transparent" font-size="30px">20.0</text></g></svg></div></td>
    <td class="gt_row gt_left"><div><svg viewbox="0 0 1300 130" style="height: 2em; margin-left: auto; margin-right: auto; font-size: inherit; overflow: visible; vertical-align: middle; position:relative;"><defs><pattern id="area_pattern" width="8" height="8" patternunits="userSpaceOnUse"><path class="pattern-line" d="M 0,8 l 8,-8 M -1,1 l 4,-4 M 6,10 l 4,-4" stroke="#FF0000" stroke-width="1.5" stroke-linecap="round" shape-rendering="geometricPrecision"></path></pattern></defs><style> text { font-family: ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace; stroke-width: 0.15em; paint-order: stroke; stroke-linejoin: round; cursor: default; } .vert-line:hover rect { fill: #911EB4; fill-opacity: 40%; stroke: #FFFFFF60; color: red; } .vert-line:hover text { stroke: white; fill: #212427; } .horizontal-line:hover text {stroke: white; fill: #212427; } .ref-line:hover rect { stroke: #FFFFFF60; } .ref-line:hover line { stroke: #FF0000; } .ref-line:hover text { stroke: white; fill: #212427; } .y-axis-line:hover rect { fill: #EDEDED; fill-opacity: 60%; stroke: #FFFFFF60; color: red; } .y-axis-line:hover text { stroke: white; stroke-width: 0.20em; fill: #1A1C1F; } </style><path d="M 50.0,94.36507936507937 C 62.5,94.36507936507937 63.03191489361703,94.36507936507937 75.53191489361703,94.36507936507937 C 88.03191489361703,94.36507936507937 88.56382978723404,94.36507936507937 101.06382978723404,94.36507936507937 C 113.56382978723404,94.36507936507937 114.09574468085106,94.36507936507937 126.59574468085106,94.36507936507937 C 139.09574468085106,94.36507936507937 139.62765957446808,94.36507936507937 152.12765957446808,94.36507936507937 C 164.62765957446808,94.36507936507937 165.1595744680851,94.36507936507937 177.6595744680851,94.36507936507937 C 190.1595744680851,94.36507936507937 190.6914893617021,89.60317460317461 203.1914893617021,89.60317460317461 C 215.6914893617021,89.60317460317461 216.22340425531914,89.60317460317461 228.72340425531914,89.60317460317461 C 241.22340425531914,89.60317460317461 241.75531914893617,89.60317460317461 254.25531914893617,89.60317460317461 C 266.75531914893617,89.60317460317461 267.2872340425532,94.36507936507937 279.7872340425532,94.36507936507937 C 292.2872340425532,94.36507936507937 292.8191489361702,99.12698412698413 305.3191489361702,99.12698412698413 C 317.8191489361702,99.12698412698413 318.3510638297872,94.36507936507937 330.8510638297872,94.36507936507937 C 343.3510638297872,94.36507936507937 343.8829787234042,89.60317460317461 356.3829787234042,89.60317460317461 C 368.8829787234042,89.60317460317461 369.4148936170213,94.36507936507937 381.9148936170213,94.36507936507937 C 394.4148936170213,94.36507936507937 394.9468085106383,89.60317460317461 407.4468085106383,89.60317460317461 C 419.9468085106383,89.60317460317461 420.47872340425533,65.79365079365078 432.97872340425533,65.79365079365078 C 445.47872340425533,65.79365079365078 446.01063829787233,78.4920634920635 458.51063829787233,78.4920634920635 C 471.01063829787233,78.4920634920635 471.5425531914894,99.12698412698413 484.0425531914894,99.12698412698413 C 496.5425531914894,99.12698412698413 497.0744680851064,94.36507936507937 509.5744680851064,94.36507936507937 C 522.0744680851064,94.36507936507937 522.6063829787233,57.85714285714286 535.1063829787233,57.85714285714286 C 547.6063829787233,57.85714285714286 548.1382978723404,64.20634920634922 560.6382978723404,64.20634920634922 C 573.1382978723404,64.20634920634922 573.6702127659574,64.20634920634922 586.1702127659574,64.20634920634922 C 598.6702127659574,64.20634920634922 599.2021276595744,64.20634920634922 611.7021276595744,64.20634920634922 C 624.2021276595744,64.20634920634922 624.7340425531914,64.20634920634922 637.2340425531914,64.20634920634922 C 649.7340425531914,64.20634920634922 650.2659574468084,64.20634920634922 662.7659574468084,64.20634920634922 C 675.2659574468084,64.20634920634922 675.7978723404256,70.55555555555556 688.2978723404256,70.55555555555556 C 700.7978723404256,70.55555555555556 701.3297872340426,70.55555555555556 713.8297872340426,70.55555555555556 C 726.3297872340426,70.55555555555556 726.8617021276597,70.55555555555556 739.3617021276597,70.55555555555556 C 751.8617021276597,70.55555555555556 752.3936170212766,70.55555555555556 764.8936170212766,70.55555555555556 C 777.3936170212766,70.55555555555556 777.9255319148937,64.20634920634922 790.4255319148937,64.20634920634922 C 802.9255319148937,64.20634920634922 803.4574468085107,70.55555555555556 815.9574468085107,70.55555555555556 C 828.4574468085107,70.55555555555556 828.9893617021276,76.9047619047619 841.4893617021276,76.9047619047619 C 853.9893617021276,76.9047619047619 854.5212765957447,76.9047619047619 867.0212765957447,76.9047619047619 C 879.5212765957447,76.9047619047619 880.0531914893617,76.9047619047619 892.5531914893617,76.9047619047619 C 905.0531914893617,76.9047619047619 905.5851063829788,72.14285714285714 918.0851063829788,72.14285714285714 C 930.5851063829788,72.14285714285714 931.1170212765957,72.14285714285714 943.6170212765957,72.14285714285714 C 956.1170212765957,72.14285714285714 956.6489361702128,72.14285714285714 969.1489361702128,72.14285714285714 C 981.6489361702128,72.14285714285714 982.1808510638298,64.20634920634922 994.6808510638298,64.20634920634922 C 1007.1808510638298,64.20634920634922 1007.7127659574468,57.85714285714286 1020.2127659574468,57.85714285714286 C 1032.7127659574467,57.85714285714286 1033.2446808510638,57.85714285714286 1045.7446808510638,57.85714285714286 C 1058.2446808510638,57.85714285714286 1058.776595744681,65.79365079365078 1071.276595744681,65.79365079365078 C 1083.776595744681,65.79365079365078 1084.308510638298,57.85714285714286 1096.808510638298,57.85714285714286 C 1109.308510638298,57.85714285714286 1109.840425531915,57.85714285714286 1122.340425531915,57.85714285714286 C 1134.840425531915,57.85714285714286 1135.372340425532,57.85714285714286 1147.872340425532,57.85714285714286 C 1160.372340425532,57.85714285714286 1160.904255319149,57.85714285714286 1173.404255319149,57.85714285714286 C 1185.904255319149,57.85714285714286 1186.436170212766,57.85714285714286 1198.936170212766,57.85714285714286 C 1211.436170212766,57.85714285714286 1211.968085106383,57.85714285714286 1224.468085106383,57.85714285714286 C 1236.968085106383,57.85714285714286 1237.5,57.85714285714286 1250.0,57.85714285714286" stroke="gray" stroke-width="4" fill="none"></path><circle cx="50.0" cy="94.36507936507937" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="75.53191489361703" cy="94.36507936507937" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="101.06382978723404" cy="94.36507936507937" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="126.59574468085106" cy="94.36507936507937" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="152.12765957446808" cy="94.36507936507937" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="177.6595744680851" cy="94.36507936507937" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="203.1914893617021" cy="89.60317460317461" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="228.72340425531914" cy="89.60317460317461" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="254.25531914893617" cy="89.60317460317461" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="279.7872340425532" cy="94.36507936507937" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="305.3191489361702" cy="99.12698412698413" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="330.8510638297872" cy="94.36507936507937" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="356.3829787234042" cy="89.60317460317461" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="381.9148936170213" cy="94.36507936507937" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="407.4468085106383" cy="89.60317460317461" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="432.97872340425533" cy="65.79365079365078" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="458.51063829787233" cy="78.4920634920635" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="484.0425531914894" cy="99.12698412698413" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="509.5744680851064" cy="94.36507936507937" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="535.1063829787233" cy="57.85714285714286" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="560.6382978723404" cy="64.20634920634922" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="586.1702127659574" cy="64.20634920634922" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="611.7021276595744" cy="64.20634920634922" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="637.2340425531914" cy="64.20634920634922" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="662.7659574468084" cy="64.20634920634922" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="688.2978723404256" cy="70.55555555555556" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="713.8297872340426" cy="70.55555555555556" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="739.3617021276597" cy="70.55555555555556" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="764.8936170212766" cy="70.55555555555556" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="790.4255319148937" cy="64.20634920634922" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="815.9574468085107" cy="70.55555555555556" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="841.4893617021276" cy="76.9047619047619" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="867.0212765957447" cy="76.9047619047619" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="892.5531914893617" cy="76.9047619047619" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="918.0851063829788" cy="72.14285714285714" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="943.6170212765957" cy="72.14285714285714" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="969.1489361702128" cy="72.14285714285714" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="994.6808510638298" cy="64.20634920634922" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1020.2127659574468" cy="57.85714285714286" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1045.7446808510638" cy="57.85714285714286" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1071.276595744681" cy="65.79365079365078" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1096.808510638298" cy="57.85714285714286" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1122.340425531915" cy="57.85714285714286" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1147.872340425532" cy="57.85714285714286" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1173.404255319149" cy="57.85714285714286" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1198.936170212766" cy="57.85714285714286" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1224.468085106383" cy="57.85714285714286" r="4" stroke="black" stroke-width="4" fill="white"></circle><circle cx="1250.0" cy="57.85714285714286" r="4" stroke="black" stroke-width="4" fill="white"></circle><g class="y-axis-line"><rect x="0" y="0" width="65" height="130" stroke="transparent" stroke-width="0" fill="transparent"></rect><text x="0" y="19.0" fill="transparent" stroke="transparent" font-size="25">100</text><text x="0" y="126.0" fill="transparent" stroke="transparent" font-size="25">37</text></g><g class="vert-line"><rect x="40.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="60.0" y="20" fill="transparent" stroke="transparent" font-size="30px">50</text></g><g class="vert-line"><rect x="65.53191489361703" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="85.53191489361703" y="20" fill="transparent" stroke="transparent" font-size="30px">50</text></g><g class="vert-line"><rect x="91.06382978723404" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="111.06382978723404" y="20" fill="transparent" stroke="transparent" font-size="30px">50</text></g><g class="vert-line"><rect x="116.59574468085106" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="136.59574468085106" y="20" fill="transparent" stroke="transparent" font-size="30px">50</text></g><g class="vert-line"><rect x="142.12765957446808" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="162.12765957446808" y="20" fill="transparent" stroke="transparent" font-size="30px">50</text></g><g class="vert-line"><rect x="167.6595744680851" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="187.6595744680851" y="20" fill="transparent" stroke="transparent" font-size="30px">50</text></g><g class="vert-line"><rect x="193.1914893617021" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="213.1914893617021" y="20" fill="transparent" stroke="transparent" font-size="30px">53</text></g><g class="vert-line"><rect x="218.72340425531914" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="238.72340425531914" y="20" fill="transparent" stroke="transparent" font-size="30px">53</text></g><g class="vert-line"><rect x="244.25531914893617" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="264.25531914893617" y="20" fill="transparent" stroke="transparent" font-size="30px">53</text></g><g class="vert-line"><rect x="269.7872340425532" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="289.7872340425532" y="20" fill="transparent" stroke="transparent" font-size="30px">50</text></g><g class="vert-line"><rect x="295.3191489361702" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="315.3191489361702" y="20" fill="transparent" stroke="transparent" font-size="30px">47</text></g><g class="vert-line"><rect x="320.8510638297872" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="340.8510638297872" y="20" fill="transparent" stroke="transparent" font-size="30px">50</text></g><g class="vert-line"><rect x="346.3829787234042" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="366.3829787234042" y="20" fill="transparent" stroke="transparent" font-size="30px">53</text></g><g class="vert-line"><rect x="371.9148936170213" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="391.9148936170213" y="20" fill="transparent" stroke="transparent" font-size="30px">50</text></g><g class="vert-line"><rect x="397.4468085106383" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="417.4468085106383" y="20" fill="transparent" stroke="transparent" font-size="30px">53</text></g><g class="vert-line"><rect x="422.97872340425533" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="442.97872340425533" y="20" fill="transparent" stroke="transparent" font-size="30px">68</text></g><g class="vert-line"><rect x="448.51063829787233" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="468.51063829787233" y="20" fill="transparent" stroke="transparent" font-size="30px">60</text></g><g class="vert-line"><rect x="474.0425531914894" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="494.0425531914894" y="20" fill="transparent" stroke="transparent" font-size="30px">47</text></g><g class="vert-line"><rect x="499.5744680851064" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="519.5744680851064" y="20" fill="transparent" stroke="transparent" font-size="30px">50</text></g><g class="vert-line"><rect x="525.1063829787233" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="545.1063829787233" y="20" fill="transparent" stroke="transparent" font-size="30px">73</text></g><g class="vert-line"><rect x="550.6382978723404" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="570.6382978723404" y="20" fill="transparent" stroke="transparent" font-size="30px">69</text></g><g class="vert-line"><rect x="576.1702127659574" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="596.1702127659574" y="20" fill="transparent" stroke="transparent" font-size="30px">69</text></g><g class="vert-line"><rect x="601.7021276595744" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="621.7021276595744" y="20" fill="transparent" stroke="transparent" font-size="30px">69</text></g><g class="vert-line"><rect x="627.2340425531914" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="647.2340425531914" y="20" fill="transparent" stroke="transparent" font-size="30px">69</text></g><g class="vert-line"><rect x="652.7659574468084" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="672.7659574468084" y="20" fill="transparent" stroke="transparent" font-size="30px">69</text></g><g class="vert-line"><rect x="678.2978723404256" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="698.2978723404256" y="20" fill="transparent" stroke="transparent" font-size="30px">65</text></g><g class="vert-line"><rect x="703.8297872340426" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="723.8297872340426" y="20" fill="transparent" stroke="transparent" font-size="30px">65</text></g><g class="vert-line"><rect x="729.3617021276597" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="749.3617021276597" y="20" fill="transparent" stroke="transparent" font-size="30px">65</text></g><g class="vert-line"><rect x="754.8936170212766" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="774.8936170212766" y="20" fill="transparent" stroke="transparent" font-size="30px">65</text></g><g class="vert-line"><rect x="780.4255319148937" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="800.4255319148937" y="20" fill="transparent" stroke="transparent" font-size="30px">69</text></g><g class="vert-line"><rect x="805.9574468085107" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="825.9574468085107" y="20" fill="transparent" stroke="transparent" font-size="30px">65</text></g><g class="vert-line"><rect x="831.4893617021276" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="851.4893617021276" y="20" fill="transparent" stroke="transparent" font-size="30px">61</text></g><g class="vert-line"><rect x="857.0212765957447" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="877.0212765957447" y="20" fill="transparent" stroke="transparent" font-size="30px">61</text></g><g class="vert-line"><rect x="882.5531914893617" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="902.5531914893617" y="20" fill="transparent" stroke="transparent" font-size="30px">61</text></g><g class="vert-line"><rect x="908.0851063829788" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="928.0851063829788" y="20" fill="transparent" stroke="transparent" font-size="30px">64</text></g><g class="vert-line"><rect x="933.6170212765957" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="953.6170212765957" y="20" fill="transparent" stroke="transparent" font-size="30px">64</text></g><g class="vert-line"><rect x="959.1489361702128" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="979.1489361702128" y="20" fill="transparent" stroke="transparent" font-size="30px">64</text></g><g class="vert-line"><rect x="984.6808510638298" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1004.6808510638298" y="20" fill="transparent" stroke="transparent" font-size="30px">69</text></g><g class="vert-line"><rect x="1010.2127659574468" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1030.2127659574467" y="20" fill="transparent" stroke="transparent" font-size="30px">73</text></g><g class="vert-line"><rect x="1035.7446808510638" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1055.7446808510638" y="20" fill="transparent" stroke="transparent" font-size="30px">73</text></g><g class="vert-line"><rect x="1061.276595744681" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1081.276595744681" y="20" fill="transparent" stroke="transparent" font-size="30px">68</text></g><g class="vert-line"><rect x="1086.808510638298" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1106.808510638298" y="20" fill="transparent" stroke="transparent" font-size="30px">73</text></g><g class="vert-line"><rect x="1112.340425531915" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1132.340425531915" y="20" fill="transparent" stroke="transparent" font-size="30px">73</text></g><g class="vert-line"><rect x="1137.872340425532" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1157.872340425532" y="20" fill="transparent" stroke="transparent" font-size="30px">73</text></g><g class="vert-line"><rect x="1163.404255319149" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1183.404255319149" y="20" fill="transparent" stroke="transparent" font-size="30px">73</text></g><g class="vert-line"><rect x="1188.936170212766" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1208.936170212766" y="20" fill="transparent" stroke="transparent" font-size="30px">73</text></g><g class="vert-line"><rect x="1214.468085106383" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1234.468085106383" y="20" fill="transparent" stroke="transparent" font-size="30px">73</text></g><g class="vert-line"><rect x="1240.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="1260.0" y="20" fill="transparent" stroke="transparent" font-size="30px">73</text></g></svg></div></td>
  </tr>
</tbody>


</table>

</div>
</div>
</div>
<p>Once we have the data aggregated in the form of list columns, the <code>.fmt_nanoplot()</code> method shows us the trends of temperature and relative humidity values throughout the day (from <code>00:00</code> to <code>24:00</code>). One interesting observation that can be made from the table is that on May 9, 2023 there was a late-day temperature increase that coincided with a corresponding decrease in relative humidity. Making such an observation without nanoplots would be quite a bit more difficult and would require some serious determination, necessitating a careful scanning of numbers across a row cells.</p>
<p>Units notation is ever useful and it is applied in one of the column labels of this table. It could potentially be difficult to format even simple things like the units of temperature. In this case we wanted to add in the temperature units of °C for the <code>temperature</code> column. Units notation has a collection of symbols available, including <code>":degree:"</code> (colons encapsulate the collection of symbol keywords), for insertion within units notation text. The example takes advantage of the available symbols and so having °C as part of a label is not too hard to express.</p>
</section>
<section id="hope-all-your-science-y-tables-are-great" class="level2">
<h2 class="anchored" data-anchor-id="hope-all-your-science-y-tables-are-great">Hope all your (science-y) tables are great!</h2>
<p>We did scientific work pretty heavily in the past and so we understand that great tables in the realm of science publication is something that could and should be possible. We’ll keep doing more to make this even better in upcoming releases.</p>


</section>

 ]]></description>
  <guid>https://posit-dev.github.io/great-tables/blog/tables-for-scientific-publishing/</guid>
  <pubDate>Mon, 08 Jul 2024 00:00:00 GMT</pubDate>
</item>
<item>
  <title>PyCon 2024: Making Beautiful, Publication Quality Tables is Possible in 2024</title>
  <dc:creator>Michael Chow</dc:creator>
  <link>https://posit-dev.github.io/great-tables/blog/pycon-2024-great-tables-are-possible/</link>
  <description><![CDATA[ 




<p>The Great Tables crew is excited to share that we’ll be presenting on tables at PyCon 2024! If you’re around and want to meet, be sure to stop by the Posit Booth, or reach out on linkedin to <a href="https://www.linkedin.com/in/richard-iannone-a5640017/">Rich</a> or <a href="https://www.linkedin.com/in/michael-a-chow/">Michael</a>!</p>
<p>The talk, Making Beautiful, Publication Quality Tables is Possible in 2024 happened on <a href="https://us.pycon.org/2024/schedule/presentation/65/">May 17, 2024</a>. You can watch the <a href="https://youtu.be/08yLWPpFdo4?si=vBK9h-ObXNKp9tHH">recording on YouTube</a>.</p>
<p>In addition to the talk, there are two other events worth mentioning:</p>
<ul>
<li>The <a href="https://posit.co/blog/announcing-the-2024-table-contest/">2024 Table Contest</a></li>
<li>Our <a href="https://reg.conf.posit.co/flow/posit/positconf24/publiccatalog/page/publiccatalog/session/1707334049004001S0l2">upcoming table workshop</a> at posit::conf 2024</li>
</ul>
<section id="whats-the-presentation-about" class="level2">
<h2 class="anchored" data-anchor-id="whats-the-presentation-about">What’s the presentation about?</h2>
<p>Publication quality tables are a critical form of data visualization, that is easy to miss in favor of charts and graphs. We’re excited to focus on how…</p>
<ul>
<li>tables are used in areas like sports and medicine.</li>
<li>Great Tables provides a systematic approach to structuring, styling, and formatting tables.</li>
<li>nanoplots combine the trend-emphasizing of graphs with the compactness of a table.</li>
</ul>
<p>Throughout the presentation, we’ll focus on making this example from a fictitious coffee device shop (<a href="https://github.com/machow/coffee-sales-data/blob/main/example_notebook.ipynb">notebook</a>):</p>
<div style="zoom: .80">
<div id="vtbglfufmz" style="padding-left:0px;padding-right:0px;padding-top:10px;padding-bottom:10px;overflow-x:auto;overflow-y:auto;width:auto;height:auto;">
<style>
#vtbglfufmz table {
          font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Helvetica Neue', 'Fira Sans', 'Droid Sans', Arial, sans-serif;
          -webkit-font-smoothing: antialiased;
          -moz-osx-font-smoothing: grayscale;
        }

#vtbglfufmz thead, tbody, tfoot, tr, td, th { border-style: none; }
 tr { background-color: transparent; }
#vtbglfufmz p { margin: 0; padding: 0; }
 #vtbglfufmz .gt_table { display: table; border-collapse: collapse; line-height: normal; margin-left: auto; margin-right: auto; color: #333333; font-size: 16px; font-weight: normal; font-style: normal; background-color: #FFFFFF; width: auto; border-top-style: solid; border-top-width: 2px; border-top-color: #A8A8A8; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #A8A8A8; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; }
 #vtbglfufmz .gt_caption { padding-top: 4px; padding-bottom: 4px; }
 #vtbglfufmz .gt_title { color: #333333; font-size: 125%; font-weight: initial; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; border-bottom-color: #FFFFFF; border-bottom-width: 0; }
 #vtbglfufmz .gt_subtitle { color: #333333; font-size: 85%; font-weight: initial; padding-top: 3px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; border-top-color: #FFFFFF; border-top-width: 0; }
 #vtbglfufmz .gt_heading { background-color: #FFFFFF; text-align: center; border-bottom-color: #FFFFFF; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #vtbglfufmz .gt_bottom_border { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #vtbglfufmz .gt_col_headings { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #vtbglfufmz .gt_col_heading { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; overflow-x: hidden; }
 #vtbglfufmz .gt_column_spanner_outer { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; padding-top: 0; padding-bottom: 0; padding-left: 4px; padding-right: 4px; }
 #vtbglfufmz .gt_column_spanner_outer:first-child { padding-left: 0; }
 #vtbglfufmz .gt_column_spanner_outer:last-child { padding-right: 0; }
 #vtbglfufmz .gt_column_spanner { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; overflow-x: hidden; display: inline-block; width: 100%; }
 #vtbglfufmz .gt_spanner_row { border-bottom-style: hidden; }
 #vtbglfufmz .gt_group_heading { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; text-align: left; }
 #vtbglfufmz .gt_empty_group_heading { padding: 0.5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: middle; }
 #vtbglfufmz .gt_from_md> :first-child { margin-top: 0; }
 #vtbglfufmz .gt_from_md> :last-child { margin-bottom: 0; }
 #vtbglfufmz .gt_row { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; margin: 10px; border-top-style: solid; border-top-width: 1px; border-top-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; overflow-x: hidden; }
 #vtbglfufmz .gt_stub { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; }
 #vtbglfufmz .gt_stub_row_group { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; vertical-align: top; }
 #vtbglfufmz .gt_row_group_first td { border-top-width: 2px; }
 #vtbglfufmz .gt_row_group_first th { border-top-width: 2px; }
 #vtbglfufmz .gt_table_body { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #vtbglfufmz .gt_sourcenotes { color: #333333; background-color: #FFFFFF; border-bottom-style: none; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; }
 #vtbglfufmz .gt_sourcenote { font-size: 90%; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; text-align: left; }
 #vtbglfufmz .gt_left { text-align: left; }
 #vtbglfufmz .gt_center { text-align: center; }
 #vtbglfufmz .gt_right { text-align: right; font-variant-numeric: tabular-nums; }
 #vtbglfufmz .gt_font_normal { font-weight: normal; }
 #vtbglfufmz .gt_font_bold { font-weight: bold; }
 #vtbglfufmz .gt_font_italic { font-style: italic; }
 #vtbglfufmz .gt_super { font-size: 65%; }
 #vtbglfufmz .gt_footnote_marks { font-size: 75%; vertical-align: 0.4em; position: initial; }
 #vtbglfufmz .gt_asterisk { font-size: 100%; vertical-align: 0; }

</style>
<table class="gt_table" data-quarto-disable-processing="false" data-quarto-bootstrap="false">
<thead class="gt_header">
<tr>
<th colspan="7" class="gt_heading gt_title gt_font_normal">
Sales of Coffee Equipment
</th>
</tr>
</thead>
<tbody><tr class="gt_col_headings gt_spanner_row">
<th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="2" colspan="1" scope="col" id="">
</th>
<th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="2" colspan="1" scope="col" id="Product">
Product
</th>
<th class="gt_center gt_columns_top_border gt_column_spanner_outer" rowspan="1" colspan="2" scope="colgroup" id="Revenue">
<span class="gt_column_spanner">Revenue</span>
</th>
<th class="gt_center gt_columns_top_border gt_column_spanner_outer" rowspan="1" colspan="2" scope="colgroup" id="Profit">
<span class="gt_column_spanner">Profit</span>
</th>
<th class="gt_col_heading gt_columns_bottom_border gt_center" rowspan="2" colspan="1" scope="col" id="Monthly Sales">
Monthly Sales
</th>
</tr>
<tr class="gt_col_headings">
<th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="Amount">
Amount
</th>
<th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="Percent">
Percent
</th>
<th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="Amount">
Amount
</th>
<th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="Percent">
Percent
</th>
</tr>
</tbody><tbody class="gt_table_body">
<tr>
<td class="gt_row gt_left">
<span style="white-space:nowrap;"><img src="https://posit-dev.github.io/great-tables/blog/pycon-2024-great-tables-are-possible/data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAIAAAACACAYAAADDPmHLAAAABmJLR0QA/wD/AP+gvaeTAAAHXUlEQVR4nO2dW4hXRRzHP7tmXtay2pXysoEZpF2EonQl0R56SSop1IIgIhTBLkZBEFFkRGVloFAvSVCkpUJFQhoVWC8pmXkptezBMm+EruuuhbqXHub8Wfe/v/O/nP+cM3P+8/vAPPzn/M/Md+Z8z5w558yZgfqiFXgC2AzsB7qisD+Kezz6j6/MAn4GuoG+EuE0sA5odiPTPyYAqylfcX3Rf1YD450ojacZaKe8/gvDJ06UesZcoJPqKq5wFt3rQG8cc6i+DB1OlHrEk0AP1VdcIfREafjAApLpD5a7qKzJr6QSfWgJnBjgoloTcMR4YD0wJGb7PuAL4DdMRU3GHOQpwn8bgY+i/xyxrrR2HsCUoQ142rEWb1hN/DXxIaBB2Kch2tYRs+97qasuTVwLUCjLfGFbkJeAVuSmvwOYWsH+U5FN0I25m3CFEwM01pqAA+YiN/1LgN0V7L8beEyIHxKlHRR5NMAcIW4/sLaKNNZE+1SSdl2TRwNMEuI+xzSJldIX7VNJ2nVNHg0wTog7kCAdaR/fng6mTh5vA0cJcWcSpNMZk3Y1LUkW9KaZeB5bAMUiaoB8E+RtoNLPnloTUAPkl3Zgaa2J5LETmCZ9mGfvvnMG2AqcrDUhNcBA+oANrkVkiV4ClNxwGeaVbq3v/0uFXuAeYHRGZVLKcCmwGNiCncEflYZu4FtgIXBJ2oVUBjMWWIkZt5fVQY8Lp4AVwJWpllgBYDiwDDOU2/WBLw6dwIvAsNRKHzht9A/h8jnsBW5NqQ4yRxo65YKngDeAoRX8tx34ATPu7yCmtUjyMgigCfMCaCJmvGAbcHkF+53DjM97J2G+SsQQTCWWO+uOA29izrw0TdsI3BbldbwCXSvRW+nENAIfUrqCD2F64i6uu8OBRcDfZTS+j5ogEe8SX6nngVeBEc7U9TMSWE7p29BVztTllKXEV+YRYIY7abHMBI4Sr3uJO2n5YjqmEyVV4h78HpY1AfgVWftZ4BZ30vLBCOB35ArcRT4+dx4D/IJchn3oc4KSLCO+s+fzmV/M1cBh5LI871CX14wD/kPu8N3uUFdSZiF3DLvQx8YiK5HPmFdciqqR15HL9JZLUT4yGnkSh4OY26y80gT8xeBydSAPXw+WJchnykKXoiyxGLlsi1yK8o3vkO/3L3YpyhLDkB8bf+NSlE+0IHeWlrsUZZkVDC7fOSp7sVT33IfcRNbNK1VgGnIZ73YpqhKyeIkhPdb9B9iRQd5ZsR04IcT7+Eh7AFkYQJqX50dS/ugxY3oxZSpGKrtX2PouoBnzjL9J2HZTzD7zLeXtC5Khb0YuZyewDTO4JffMpvoZLjWYS0Yen4AOYifuKzOvYXuC+raKjeFV3cTP16eU5jyOn4XY6ATqwU+O86FkzgUo+Ue6ti1wqshP5jG4nrqdKkJbgOBRAwSOGiBw1ACBowYIHDVA4KgBAkcNEDhqgMBJa57ANsyTLqWfNtcCJGy8DdQDnZweHE/WqZeAwLFhgKTz8yge1J0NA2y2kEaobHItwAZjMBMsJ1nAOdTQhVn5NA/zISRiA4MLva7MPnELJ7omyXiH9cI+Xi71rp3AwFEDBI4aIHDUAIGjBggcNUDgqAECRw0QOGqAwFEDBI4aIHDUAIHjkwHOxcS7/H4+Lu84rbnDJwMci4m/KlMVAxkbE380UxUp4pMB4ip1WqYqBhI3kPNIpipSxCcDHMJMuVrMg1kLKZP3McxaAXWBTwboBTYK8fdjlnLLmunAXCF+I3U0x6FPBgAzkqaYBuBjsh0+1RLlKQ2bLzeyKVf4ZoCvge+F+EmYFcSvyUBDIa+JwrYtmFXF6wbfDADwLHITeyNmYallmNW7bNMKvBzlcYOwvTfSVlc4/Solhm2YhZdeE7aNwqzg/QL9awfXOra+CXO2T6b0l1LPIc8HnGt8NACYtXimAA/HbG8Aro9CFnyAWdy67vDxElDgEfqXmXPJKuDRKvfxZVX2svhsgD7gJcz8en86yP8g5hZ0KdXf9rk2bcX4bIACnwLXAc9glm1Nm71RXpOBzzLIzym+9gGKOQu8HYVrgTsxK41OQF6joBrOYJaIP4y5xTtQY3q5Ii8GuJA/ouAz2gdQ8oEaIHDUAIGjBggcNUDgqAECRw0QOGqAwFEDBI4aIHDUAIGjBggcNUDgqAECx9br4BbMhxQjo9/SqN1WYL6l/HynXPm7MINfT2amKEXuAE7hfv7dvIWTwMzqq9s/duG+MvMadiSob6vYGLnSjS4hn5RuYKhLATY6gXrwk+O8E+5cgJJ/pGvbPKeK/ERaD6HHqSK0BQgeNUDgqAECRw0QOGqAwFEDBI4aIHDUAIGjBgictD4Pn0F1L5r+BbYCJ2K2F483yCNx087mnrTfj88G2i3m41Nw/ijYBjYr5Cch/Z2W8/ApODeAjT5ArfP0XYg0O6cUVy90uRZgwwCbLKRRYLMQ95XF9H3jS9cCbNCCmUD5NMmbwg5gDXCFkH4zZun1jhrS9y10AGtjypsp/wMroja2N896KAAAAABJRU5ErkJggg==" style="height: 2em;vertical-align: middle;"></span>
</td>
<td class="gt_row gt_left">
Grinder
</td>
<td style="background-color: aliceblue;" class="gt_row gt_right">
$904K
</td>
<td style="background-color: aliceblue;" class="gt_row gt_right">
3%
</td>
<td style="background-color: papayawhip;" class="gt_row gt_right">
$568K
</td>
<td style="background-color: papayawhip;" class="gt_row gt_right">
4%
</td>
<td class="gt_row gt_center">
<div>
<svg viewbox="0 0 700 130" style="height: 2em; margin-left: auto; margin-right: auto; font-size: inherit; overflow: visible; vertical-align: middle; position:relative;">
<defs><pattern id="area_pattern" width="8" height="8" patternunits="userSpaceOnUse"><path class="pattern-line" d="M 0,8 l 8,-8 M -1,1 l 4,-4 M 6,10 l 4,-4" stroke="#FF0000" stroke-width="1.5" stroke-linecap="round" shape-rendering="geometricPrecision"></path></pattern></defs><style> text { font-family: ui-monospace, ‘Cascadia Code’, ‘Source Code Pro’, Menlo, Consolas, ‘DejaVu Sans Mono’, monospace; stroke-width: 0.15em; paint-order: stroke; stroke-linejoin: round; cursor: default; } .vert-line:hover rect { fill: #911EB4; fill-opacity: 40%; stroke: #FFFFFF60; color: red; } .vert-line:hover text { stroke: white; fill: #212427; } .horizontal-line:hover text {stroke: white; fill: #212427; } .ref-line:hover rect { stroke: #FFFFFF60; } .ref-line:hover line { stroke: #FF0000; } .ref-line:hover text { stroke: white; fill: #212427; } .y-axis-line:hover rect { fill: #EDEDED; fill-opacity: 60%; stroke: #FFFFFF60; color: red; } .y-axis-line:hover text { stroke: white; stroke-width: 0.20em; fill: #1A1C1F; } </style><line x1="22.5" y1="115.0" x2="677.5" y2="115.0" stroke="#BFBFBF" stroke-width="4"></line><rect x="30.0" y="46.89542483660131" width="40" height="68.10457516339869" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="84.54545454545455" y="50.424836601307184" width="40" height="64.57516339869281" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="139.0909090909091" y="37.091503267973856" width="40" height="77.90849673202615" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="193.63636363636363" y="34.869281045751634" width="40" height="80.13071895424837" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="248.1818181818182" y="27.810457516339866" width="40" height="87.18954248366013" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="302.72727272727275" y="17.222222222222225" width="40" height="97.77777777777777" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="357.27272727272725" y="15.0" width="40" height="100.0" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="411.8181818181818" y="25.326797385620914" width="40" height="89.67320261437908" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="466.3636363636364" y="35.653594771241835" width="40" height="79.34640522875816" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="520.909090909091" y="37.35294117647059" width="40" height="77.64705882352942" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="575.4545454545455" y="40.7516339869281" width="40" height="74.2483660130719" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="630.0" y="16.83006535947713" width="40" height="98.16993464052287" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><g class="y-axis-line"><rect x="0" y="0" width="65" height="130" stroke="transparent" stroke-width="0" fill="transparent"></rect><text x="0" y="19.0" fill="transparent" stroke="transparent" font-size="25">765</text><text x="0" y="126.0" fill="transparent" stroke="transparent" font-size="25">0</text></g><g class="vert-line"><rect x="40.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="60.0" y="20" fill="transparent" stroke="transparent" font-size="30px">521</text></g><g class="vert-line"><rect x="94.54545454545455" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="114.54545454545455" y="20" fill="transparent" stroke="transparent" font-size="30px">494</text></g><g class="vert-line"><rect x="149.0909090909091" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="169.0909090909091" y="20" fill="transparent" stroke="transparent" font-size="30px">596</text></g><g class="vert-line"><rect x="203.63636363636363" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="223.63636363636363" y="20" fill="transparent" stroke="transparent" font-size="30px">613</text></g><g class="vert-line"><rect x="258.1818181818182" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="278.1818181818182" y="20" fill="transparent" stroke="transparent" font-size="30px">667</text></g><g class="vert-line"><rect x="312.72727272727275" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="332.72727272727275" y="20" fill="transparent" stroke="transparent" font-size="30px">748</text></g><g class="vert-line"><rect x="367.27272727272725" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="387.27272727272725" y="20" fill="transparent" stroke="transparent" font-size="30px">765</text></g><g class="vert-line"><rect x="421.8181818181818" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="441.8181818181818" y="20" fill="transparent" stroke="transparent" font-size="30px">686</text></g><g class="vert-line"><rect x="476.3636363636364" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="496.3636363636364" y="20" fill="transparent" stroke="transparent" font-size="30px">607</text></g><g class="vert-line"><rect x="530.909090909091" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="550.909090909091" y="20" fill="transparent" stroke="transparent" font-size="30px">594</text></g><g class="vert-line"><rect x="585.4545454545455" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="605.4545454545455" y="20" fill="transparent" stroke="transparent" font-size="30px">568</text></g><g class="vert-line"><rect x="640.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="660.0" y="20" fill="transparent" stroke="transparent" font-size="30px">751</text></g>
</svg>
</div>
</td>
</tr>
<tr>
<td class="gt_row gt_left">
<span style="white-space:nowrap;"><img src="https://posit-dev.github.io/great-tables/blog/pycon-2024-great-tables-are-possible/data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAIAAAACACAYAAADDPmHLAAAABmJLR0QA/wD/AP+gvaeTAAAO8UlEQVR4nO2daZBdRRWAv5nJMiRACCQmJhBeWCQJEELYJAISCassSgRKCIJsFgXIVigKhewUoBZUREEtkFAgoILIpgQBAWULhs0AIuRlIQkYAgmELCR5/jh97DtvZm5335m33emvaupOMufc2+/dc7tPnz59LkQikUgkEolEIpFIJBKJRCKRSCQSiUQikXzSVOsG1JiRwDhgINArRW4ZMBeYAayuQrsiFWZX4AWgFPjzEXABOXpwcvNBAtgKmAmsb/69GFgAfJai0w/YAuhr/n0ZcFGlGhipLNciT/OrwJYBeq3IjS8hQ0JL9zet+jTXugE1YENz/BvwdoDeSuAO8/v6RANoWGaY474ZdPczx5eIzmDDMgxYh3TlWwXq/tnoXd7djYpUl5eRG3lGgM56wKdG70uVaFSkelyF3MiHAnQONjpLSI8ZRBqAvZCbuQKZ4vlwg9G5wyUYqX96AR8iN/QgT53/GPljK9WoSHW5G7mhUz1kRxvZtcDnKtmoatOTx7KHgSOQHuC7wFjgACTiB+LwPQ48Bhxo/m8G8H51mxmpFPpUl4BFdB7/X4U4fiXg+pq0tIL0tLWAscjTfBAwgbY94FrgOeAZYA2wORL42bjsHEVk9vAQ0jusqGiLI11iPWAS8uTOof3TvRjxBU4Bhnag3wLsBHwfeBobQNKfFcB08/dRFfwckQA2BU5HonYraHvD1gLPA5cAuxEeCh8GnAj8HlhKe4OaBfwY2DPDuSNdoACcScdP6cfA/chTPqwbr6m9w8WIc1h+3cXANOAQoE83Xjdi6A2cC7xC+ydxNnAdsDfVW7UrIEb4GOJDJNvzIXAbYcvPkRSagPto+yW/hDyNO9auWf9nE+B44F5gObaNS4ExtWtWe6o9C+gLfM38bA9sYH5WIk7aXGC+Oerv85BpWpLJyDi8FlmZuxV56uuRfshs4mrgC0hs4Ss1bVGCahrA7siN2jqD7irEGNQ4xgPbAk8Bl3ZXAyvMDoiDCHAkMiz48DLw34q0qIpshzhjOh5OBY5BvOWdgQfN315AHKcnkGydVYQnbubt5xMkUlmRWUU1QsHNwO1IGtWzwKG0t2h9Gh5Bsm6VJmR+PgKZ3m2GBHO+bf6+DBkGfOmFDDma4ZuF3shnWYeM6SEMQL6PlfgFkPoA/ZE4xlHAScDrgdesOUdhgyYjOpG518hc0Mnfk4wzsqsJH8J2TrQl6/B3pDlHlhsxzehe5infivg4q7HtPj3DdWtGC/JFueLo043MTdh07c4YgJ1mbRfYnqHYrnVwoK5yjtGfnkFXM5FOCdQ7E9vuDzJct2YcizR6OR2HWpX7sR/wU+BOYGKK/LNG9qzA9jRj/Yqs08WfGv1bAvWGYINFvvGA9YGfJfTeRwJLDUETNkjzE4fslsCvkQ+YdID+BZyMjLtJLjd/fyBDu2Yb3axfpOYR+HbjyjFGzycVfSwSri5iv4u7yd5r1YQDsGP1pp46Lchq3V20nQG8BRyN9YT3xoZ5y43DxVNG99RAPeUfRv87gXq3YIe5jugLTEmcX3/eA76RqaU15lHkA0zLqD8MuBK7Fl8CXkS67j7I9KiETCVD+K3RuyJju+Ya/a8G6s0zekeU/X8rMsYncxLWIoZ6FhJVbDjUUy8hAZCuMBCJomlK9mfA+dgc/UsCz6dbw27N0JYWc/3Qz5VMKUve0IOxQ1IJMfarycGawc34e8qDkKnNFNIXbkYiAaJkgKSEdJkhqEf910A9gOGJ64c8mWcYnRfMvzdEsov1XB8h6xgbZWhT3TEIuw5/qEN2KLZLLSHLqrumyDcD5yFPkup8hkwNfZls9N4M0FF2w85UQuIIfzJ6VyIOnmYYq3OXNkNqOH6AfLB3cC/F/hzr6KzEdpM3kf6ETcF2xSXgsID26U1cHqCjHG50/x2g0xuJWJaAH2HT0T8grN0NQS/sE32uQ3Y4NsK1L7JIpON6CQkXn0TnMfBjE7I+qd3J66peeb6fCx0+Hg/Q2YO2vZXOarYJvHZDcAj26RrokL3QyL5S9v+TaTssPEPnQRudk4eEZZOO3NgAPbAO5G0BOhfTdlr3HDJM5pJfIh/ydodcMzJElJCVrnL6I96w9hBrkKe83ElKpnZvFtBONTDfXUGKOm5XBej8HdvGWTTotM6XfyIf9ESH3CTs4kZaNzwG6W71C1yEdP1JB+wN87fjA9qpwZbQmPyTRu80T/kNsb3NciSHoa7o7jVmfQpdTtLJ5ngPMvftjFlI9swUYCEST9d8AV0I0ulcSMGH+eboG6FUVH5+qpRlInbJ/VIktJ1rNHybFiRJrubtFXDuAciKoj5Rq5EMm+OwvYPv1EwXdG4OuH5yIWknT52pRn4utsBUrtEpzu4pMv2Qrn8d4lWHMo624+pHid99nTpd0n0k4LpDEtcZ4qnzppG/MOA6Dc1byAee7JC7AOvc7eeQ7Ygm4ATarx6e46mvSR2zAq65k9FZiV9Ps3miXSMDrtPQ6LTsWodcEzY6toDsnvHGwI3YyKBvxY8JRn5ZwLUOwwa4fDgRO+fvMZxNx3P7jhgEvGvk7+ridY/Arg/47MIZgX06fcPIpxn5Jz3lddXxF57yuWAE1sHbw0N+Evbp7UqmSyt2/eHLHvK9E9f1nZppXSGfEjHN2OHpcM/z5wbdsXO/p/yNRn4O7nzANDSv0DdTR3uf/T3lbzPy13jI7oj1cVwR0ZpSiVzza5APfzB+mSznI1O4EXSt/t6j5ugbDwiNBYTEACaZ4wz8N4DkCn2qFyKbJl1o6vgaYJeM11QvfQ1+6+p/wK7Q+aAzHJ8u/REj22MLSg5AnpQSkthY8NB52MjPJNuGlWZkS3YJ+LqH/PVG9lcesk1YHyMtXwHEH9HsJR9/JLdsi6zzqxG45sIjsTtpswSIwE5Db/CQPc/IPuwhOwg7a3DVGNiHsBlJrkkawRxsBa7O+KGRXUK2JdNT8M/2+aaRfdVDNrkbyZXkorOFBz3O2yMYhQR7NCaelvDYBzvW+jzF5RSwT2rBIavVQn2cNM1zKHrIzjCyoZtWcs02tDWCtCrdmrO3BqkhEMrbRv8Eh9xIrLFs4JA91cg97ZDbhPD4Qo8haQTzSDcCndNnydy9Cb+ATR/slitXha8rjNydDjldY1hIzyvB58W22A0QaUYwDhtRDI0Qag/yCZ3vRla0LZMccr8xcmlb3JqxaetZ9hz0GMbQ1gg6qxii6WWvE1boqQWbmfQ86RlHOl4f7zin7nI6u5O/NyEpbLpa2DA1A2vVTY1BqmkNQUKyE2m/ajYUGc/7IRlBrjzDJDsgizYbIrOPW5BuuZwzkMyie4C/pJzvIiSb+GYkqTNJb2SlUCOQZyMVyiIOkj3BfKSAUjmahfsG4WHrPbH78arxswr4XmAba06tHZVkT7AA6QmS+YSDkVlDK7JoE5LBAxKRfAcZBt4ibP3fl/HI93ggsq8hEkiyJ3iX9hsmdBXudxnPr6t+WTKPfMi6xyCSIGkEC2hrBPtju9hvIUUh5pGed5gkGkCDUG4E6km30HE5WN+c/mgAKdTaBygn6RMsQnyCN5Co3VRkvt4X2Vi5Ne4wbm/EAAYj+YK++fwh6P7FCcg2tkgXSfYEC5HtXyDOlm4V8ymVNgapH1ytWcASZIGpoai3HkBJ9gTvIXv4pmHLw04kvUBkAdn+9XmkmOMfaV9vGCR0OxLZfvZ8yvlOQHqRB2i/u6cfUi5mCyS0PAVJCI10kdHYnkDH2aW4V/makDWEEjL1S8tDmGnkpjjOqRk+nW15b8XmIiwjfMtZpBNGY1f3SsgswIXOGlbjdsx0V5Erg1nD0ml1CFqxzmqPSgWvNJsgIVjfql7XITfhPofcQKxhuZ5YTVRxZTofZ+Rmu5sZqRSvITfB9WLo8dj4givMfDR+2UPDsEbVEJW+8vZio6HYN3K4KpQVzHEO4ryloU+0K69xAbZaSch29ZqRNwPYD3EC30XiB2nozfTprovm2B93uVY1PFeOQV2QNwPYxxx96hMWzLHoIbsIW9+/kCIHdoPKPlTvhVWZyZsB6Lt4Hk2VEgrmWPSQ1VxGcA8DTyDT1o3wLyRRM/JkAGMQb76EBJFchAwBSbmCQ+5jbNJI3Q8DeTIA/bJfo+Psn3I2N8ei5/lVruAhq0NQ3TuCeTIAHf99uv/B2J3IRc/zq1zBQ1bbMAFxHCMVphc2qudT+28XIxtS8zfkXUHJ9hzgef6akJceYDck/Ws1fhU8dPwvIjfJh6I5FnAbzRrEGYQ69wPyYgD6JT+L7AdwUTDHYsA1VLYVvyphofUKakJeDCBk/AdrACEx+/exxuVT9Usdwe2RZem6JA8G0B8ZAsDfAJJDQAhzzLHgIfumOX8TdfSu4HLyYAB7I/v8liE7fXwomGMx8Foq71v3T+MRdesH5MEAtPt/DInAuWjC7hkMXbb1DQYpde8H5MEA9Mv13Uk8FEnjguw9QMFTfjqy0jicOt0v2OgGMAS7D9/3Va4Fc/wEqSkUQtEcfYeAxdiimXXZCzS6AeyLXf71fQlU6BpAkqI5jsD/u6vr5eFGNwAd/0P2DBbMsZjhemo0fXAXi1LUD5hI+FtOK05eDMB3+gddM4AlSGZy8jwunkRyCTbAXWKu6jSyAYxC3lDiu/yrFMyxmPG6Ggvw9QNWYl9uWXfDQCMbgH6Zr9Lxpo/O6IoPkNQrBOhoDxUNoBvRLzOk+2/GvteomPG6qlcI0FFH8ItI1ZK6oVENoAVbhjXEAIZh392TtQcommPIW0BmIi/C7EWdlY9tVAPYFcm5W43sFfRFb9pSZL0+C0VzLATorMO+bbSuhoFGNQD9Ep/Bb/lXKZhjV3buqO5mhBW1rsuwcKMaQJbpH3TdAUzq9iJsE6jGKkYH6lWURjSA9bDlYUINQBNB56RKpbMM+7LLED9gDrYU3sQuXL9baUQDGIVE4tYALwbqFsyxq5s3i2Xn80VrEGyXKlVF6rVARBrDkU0azcDLiCH4MgbpQWaT/spaF1sj07n5SAELX7ZCchfPQl5YEcmIvvq1EX9eo45eJNWIPYAyHikJW3cLLCksQPyWlbVuSCQSiUQikUgkEolEIpFIJBKJRCKRSCQSyTv/A0dsw30FM7DsAAAAAElFTkSuQmCC" style="height: 2em;vertical-align: middle;"></span>
</td>
<td class="gt_row gt_left">
Moka pot
</td>
<td style="background-color: aliceblue;" class="gt_row gt_right">
$2.05M
</td>
<td style="background-color: aliceblue;" class="gt_row gt_right">
7%
</td>
<td style="background-color: papayawhip;" class="gt_row gt_right">
$181K
</td>
<td style="background-color: papayawhip;" class="gt_row gt_right">
1%
</td>
<td class="gt_row gt_center">
<div>
<svg viewbox="0 0 700 130" style="height: 2em; margin-left: auto; margin-right: auto; font-size: inherit; overflow: visible; vertical-align: middle; position:relative;">
<defs><pattern id="area_pattern" width="8" height="8" patternunits="userSpaceOnUse"><path class="pattern-line" d="M 0,8 l 8,-8 M -1,1 l 4,-4 M 6,10 l 4,-4" stroke="#FF0000" stroke-width="1.5" stroke-linecap="round" shape-rendering="geometricPrecision"></path></pattern></defs><style> text { font-family: ui-monospace, ‘Cascadia Code’, ‘Source Code Pro’, Menlo, Consolas, ‘DejaVu Sans Mono’, monospace; stroke-width: 0.15em; paint-order: stroke; stroke-linejoin: round; cursor: default; } .vert-line:hover rect { fill: #911EB4; fill-opacity: 40%; stroke: #FFFFFF60; color: red; } .vert-line:hover text { stroke: white; fill: #212427; } .horizontal-line:hover text {stroke: white; fill: #212427; } .ref-line:hover rect { stroke: #FFFFFF60; } .ref-line:hover line { stroke: #FF0000; } .ref-line:hover text { stroke: white; fill: #212427; } .y-axis-line:hover rect { fill: #EDEDED; fill-opacity: 60%; stroke: #FFFFFF60; color: red; } .y-axis-line:hover text { stroke: white; stroke-width: 0.20em; fill: #1A1C1F; } </style><line x1="22.5" y1="115.0" x2="677.5" y2="115.0" stroke="#BFBFBF" stroke-width="4"></line><rect x="30.0" y="46.188118811881196" width="40" height="68.8118811881188" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="84.54545454545455" y="45.96971461852067" width="40" height="69.03028538147933" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="139.0909090909091" y="45.241700640652304" width="40" height="69.75829935934769" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="193.63636363636363" y="34.831100757134536" width="40" height="80.16889924286546" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="248.1818181818182" y="25.36691904484566" width="40" height="89.63308095515434" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="302.72727272727275" y="18.625509609784505" width="40" height="96.3744903902155" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="357.27272727272725" y="15.0" width="40" height="100.0" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="411.8181818181818" y="27.25975538730344" width="40" height="87.74024461269656" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="466.3636363636364" y="37.77227722772277" width="40" height="77.22772277227723" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="520.909090909091" y="43.88759464181713" width="40" height="71.11240535818287" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="575.4545454545455" y="47.32382061735586" width="40" height="67.67617938264414" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="630.0" y="23.517763541059985" width="40" height="91.48223645894001" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><g class="y-axis-line"><rect x="0" y="0" width="65" height="130" stroke="transparent" stroke-width="0" fill="transparent"></rect><text x="0" y="19.0" fill="transparent" stroke="transparent" font-size="25">6.87K</text><text x="0" y="126.0" fill="transparent" stroke="transparent" font-size="25">0</text></g><g class="vert-line"><rect x="40.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="60.0" y="20" fill="transparent" stroke="transparent" font-size="30px">4.73K</text></g><g class="vert-line"><rect x="94.54545454545455" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="114.54545454545455" y="20" fill="transparent" stroke="transparent" font-size="30px">4.74K</text></g><g class="vert-line"><rect x="149.0909090909091" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="169.0909090909091" y="20" fill="transparent" stroke="transparent" font-size="30px">4.79K</text></g><g class="vert-line"><rect x="203.63636363636363" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="223.63636363636363" y="20" fill="transparent" stroke="transparent" font-size="30px">5.51K</text></g><g class="vert-line"><rect x="258.1818181818182" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="278.1818181818182" y="20" fill="transparent" stroke="transparent" font-size="30px">6.16K</text></g><g class="vert-line"><rect x="312.72727272727275" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="332.72727272727275" y="20" fill="transparent" stroke="transparent" font-size="30px">6.62K</text></g><g class="vert-line"><rect x="367.27272727272725" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="387.27272727272725" y="20" fill="transparent" stroke="transparent" font-size="30px">6.87K</text></g><g class="vert-line"><rect x="421.8181818181818" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="441.8181818181818" y="20" fill="transparent" stroke="transparent" font-size="30px">6.03K</text></g><g class="vert-line"><rect x="476.3636363636364" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="496.3636363636364" y="20" fill="transparent" stroke="transparent" font-size="30px">5.30K</text></g><g class="vert-line"><rect x="530.909090909091" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="550.909090909091" y="20" fill="transparent" stroke="transparent" font-size="30px">4.88K</text></g><g class="vert-line"><rect x="585.4545454545455" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="605.4545454545455" y="20" fill="transparent" stroke="transparent" font-size="30px">4.65K</text></g><g class="vert-line"><rect x="640.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="660.0" y="20" fill="transparent" stroke="transparent" font-size="30px">6.28K</text></g>
</svg>
</div>
</td>
</tr>
<tr>
<td class="gt_row gt_left">
<span style="white-space:nowrap;"><img src="https://posit-dev.github.io/great-tables/blog/pycon-2024-great-tables-are-possible/data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAIAAAACACAYAAADDPmHLAAAABmJLR0QA/wD/AP+gvaeTAAAJTklEQVR4nO2de6wdRRnAf6elvfTW2vpAgQotvdxUW26VErChQY8gKBrR+Kj1D7lVEqNRjFTRxCetoETFR1RMDJSi/iMqCghqUvUWUaJWHoqYtthXogi1toViob29xz++HWfOnt1z9jx2Z/ac75dsds/O7O53dmfn+2bmm29BURRFURRFURRFURRFURRFURRFURRFURRFURRFURRFURRFUZSyUvEtQJcsBD4DzC7wmpPABmBTgddUEjgeuB+oeVgOAUvy/4v5U+Ya4Abgsmj7UeBwAdesAKdF238FzgH+W8B1lRhvx76NDwKzCrz2N5xrbyjwukrEKHAQeQBPAosLvv4QsAVbCMYLvn5PKZsKmAX8HhiLfr8P+L4HOUaAzcAw8BSiCh72IMfA8WX8GH2tlgco38sEwDTfArTJMt8CpLAEmO5biE44zrcAbXIvcEG0/TXE+vfJpxE1sAXpH1By5tXkb3yNAquBM1vkO8WR5ZqcZFFiDANP034TbDHwOmBBi3xXIG+yebBbgfeQrCrHnXwXtSGL0iW/QW76jgx5ZwM/wj6oo8D1SC9inBHgCMlG3lUJ+Tc455zTzh9QuuOz2AfT7I2uAD8g+YHeB5way3+Nk34psA74V/R7H41W/o4o7bed/xWlE7LaAR938v0OuARprpl924DnOvlNmtue/1607ynq1YDqf49ksQOehwzY1IDdwAui/bOBW7APb51zzDasalkNnOic4+ex86v+90wrO+Bc7ANaE0ubhjQfa8Bdzv71JKuLGrAqdg6j/49Q7FC0EtHKDljopN+D1AiGC4FjUdq3nf0zgM8j1b378H9JYytA9b9nstgBtzp5/g68FOmx24e13pcmHPdsxAi8DhluHoqlq/4PgCx2wBzgF9S/zUed7cs7vLbq/0DI0h8wHfgSMEV9QfhCF9dV/R8IWfsDAFYgBeGbiProBtX/gVDEuECcvtP/ZRoNXEq9I+aws/0OivHNe7mzPRN4m/N7LzBRgAwDyXys0Rfy8ta8bkBelMUh5Ewam2MhssK3AO1SFhVwurN9CfBPX4KkcAdwEuJLUCrKUgDMjZ1E+uWPepQliW1IATi9VcbQKIsKMAVgJ+E9fIDt0XqEkvkGlqUAmDfrEa9SpGPkGgJe5FOQdilDAZiJdd7Y3iyjR1y5SqUGylAAFmGr1dBrACiZIViGAuC+UaHWAI8g/QBQshogtFbAfGQodq6z72XO9iqgWqRAbfAM4mxaqhogNFyfvbIu9/f8ruRISCpgBvBi30J0ySTiiax0yI3YN+lTnmVph9sRmf9DWC9VS0Kb0ToXCfiwAOnwWQn80atE2ViLuJCBFNzHMx43CTwE/CEPobIQWgEAeAXwa+RN2gqchThqZuElyJDtMuCFyJDxIWSCx33IcG0eE0qXA3/q4vibgHf3SJa+4FqsKvhWi7wV4Ergb7Q20I4hYwmv7UCm1cDVJE8Dmw7sz3D9ZssFDWcdYGYib2wN8ed7fZO8VRpv5hTwGOINvDchvYbUBudmkOVE4DbnuE+m5DN2wGEkYshZGZbzsZNRb84gy0CxBPHyqSFV+PNT8l2NfTjXInbDs2J55gIXA99BHpBbEO6Mjomrw8XAF7Gzg9yCk8RaJ8/y1n/v/2yKjtlLyQaSiuAj2Jt6aUoe4x28M+M5T0FCzLku4jWkxrgbmUiyi8YawxSEp0mOSrbcyXtFRlkAPuQcd04bxw0El9P85gwjPXA1xJBqh1Hgu9THA0ha/gy8CTHSzL5XJZzPtQMeR6KGxJfNyBQ0153cLTidzlXoW36I3JgnSO627oVn8AjwMeDHiN2xBTEU11Nf6BY511pHMrfTvDCZ5VbnmOOwhfiGDv9DX1LBGnB3peRx9f+CAmTaRXM74MOOPNtprAH2YI3Uk5zjHo72/yoHmUvLGPZmfjQlzz1RepZoIb3gZrLbAWsT0lc56Sud/WYK29ZeCpuFkLstq872REL6MHB2k/Q82Byth0j2AH4QOBBtVxPSH3O23VbNIee8hVKGAvAEopvjrET6C8A+mLyZcLarCenHkFYJwHk0NusqsbyGqWg9owvZOiLUAlBBuoRBqvmkGHyvdLaLKgA7kIgjkO6XMBGt51HvywDSPW044Gyb+AX7upCtI0ItAGdgq8iJlDzVaL0HMc6KYiJar6B+elo8HRoLiSm0U4i6MBhH0n90J1r/kGf7v1vehZXt/IR0tz/gDmf/Umz0kXud/Sc757sOBbCx/Q7Suv2/pjixAPlgRNb+gANIEImvIqHtzXFvdPKucfZrwAnq2/93puRxYwMsLEasOnZF106zPdxxgfjyOSdfBfF3MJ1dSQEsB45l2Jt1ZUoe0/+/OyU9bzZG13+GZDvA7Q8wy0PAW2L5LnPSv5KTrKXjg9ibcnZCuhsfqGj9b2jHDvgLyR+YOg87MrkPOCEXSUtIyPrfcKojw/qUPMYO2E9jf8A4dnRxEpnxrCDN0n8Ttv437IxkuDslPe4fMAS8AbEbzP4p4AO5S1oiyqD/DTeR3Q7YRmMAyv3UtwYUyqH/DWuwsib586X5CR4Gvk7JZhEXhYnueZBk96gQ9L+hHTughgSpHkeNvVRc/f/TlDyu/g9pyWIHtPoEjRdCGgsYww6KTKTkCfXtSXNYdTuKqgXI0TYhzQ6uOtsTKXmuQsbUQ4oYNkW9i5fLA0h38DxkIEg7e5pg9P8B+ss9ull/gHdCUQEVpGcMpJl3rEnesmHUwDwC/PBlKCpgGVaPbgGe41GWXuPGC6hSsvgBReFOAOnn5We9umH9xMnYr3gMwvLm3ty23uB7engFeSteE/3eSL3nbL8wDenzn4XMcxxD+jwGnvdj34zbPMuSN2439088yxIEi7BuUnuRadj9jKntTCF4p19x/DIN6T41N6N0cfY7ZD4SR8j0d8Q/XzswfAL78Df6FaVwxrH/fRP+7bDCOQPr0r2H+qCQg4L7TcP3epalcMy3e6cY3Lg4J2C/TP4oAXYR54mZIp3m8jUouF83H/ElhI+xgCej9SiDWf2D3PexaLuGvSeF42Ms4BZkWHcUqf7yiNsXOnOwvg2byR5Ysi84HgkE6btLNoRlN57Dy/tqgsxAAi9WSQ682O8cQUYFNyB+AoqiKIqiKIqiKIqiKIqiKIqiKIqiKIqiKIqiKIqiKIqiKIqiKG3zPzSwSFCK2KqcAAAAAElFTkSuQmCC" style="height: 2em;vertical-align: middle;"></span>
</td>
<td class="gt_row gt_left">
Cold brew
</td>
<td style="background-color: aliceblue;" class="gt_row gt_right">
$289K
</td>
<td style="background-color: aliceblue;" class="gt_row gt_right">
1%
</td>
<td style="background-color: papayawhip;" class="gt_row gt_right">
$242K
</td>
<td style="background-color: papayawhip;" class="gt_row gt_right">
2%
</td>
<td class="gt_row gt_center">
<div>
<svg viewbox="0 0 700 130" style="height: 2em; margin-left: auto; margin-right: auto; font-size: inherit; overflow: visible; vertical-align: middle; position:relative;">
<defs><pattern id="area_pattern" width="8" height="8" patternunits="userSpaceOnUse"><path class="pattern-line" d="M 0,8 l 8,-8 M -1,1 l 4,-4 M 6,10 l 4,-4" stroke="#FF0000" stroke-width="1.5" stroke-linecap="round" shape-rendering="geometricPrecision"></path></pattern></defs><style> text { font-family: ui-monospace, ‘Cascadia Code’, ‘Source Code Pro’, Menlo, Consolas, ‘DejaVu Sans Mono’, monospace; stroke-width: 0.15em; paint-order: stroke; stroke-linejoin: round; cursor: default; } .vert-line:hover rect { fill: #911EB4; fill-opacity: 40%; stroke: #FFFFFF60; color: red; } .vert-line:hover text { stroke: white; fill: #212427; } .horizontal-line:hover text {stroke: white; fill: #212427; } .ref-line:hover rect { stroke: #FFFFFF60; } .ref-line:hover line { stroke: #FF0000; } .ref-line:hover text { stroke: white; fill: #212427; } .y-axis-line:hover rect { fill: #EDEDED; fill-opacity: 60%; stroke: #FFFFFF60; color: red; } .y-axis-line:hover text { stroke: white; stroke-width: 0.20em; fill: #1A1C1F; } </style><line x1="22.5" y1="115.0" x2="677.5" y2="115.0" stroke="#BFBFBF" stroke-width="4"></line><rect x="30.0" y="105.95961467210077" width="40" height="9.04038532789923" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="84.54545454545455" y="105.77436087439791" width="40" height="9.225639125602086" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="139.0909090909091" y="98.77176732123009" width="40" height="16.228232678769913" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="193.63636363636363" y="78.65320489070025" width="40" height="36.34679510929975" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="248.1818181818182" y="49.27195257502779" width="40" height="65.7280474249722" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="302.72727272727275" y="15.0" width="40" height="100.0" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="357.27272727272725" y="18.445720637273062" width="40" height="96.55427936272693" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="411.8181818181818" y="28.004816598740277" width="40" height="86.99518340125972" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="466.3636363636364" y="50.494627639866614" width="40" height="64.50537236013338" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="520.909090909091" y="81.80251945164876" width="40" height="33.19748054835124" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="575.4545454545455" y="96.51167098925528" width="40" height="18.48832901074472" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="630.0" y="105.95961467210077" width="40" height="9.04038532789923" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><g class="y-axis-line"><rect x="0" y="0" width="65" height="130" stroke="transparent" stroke-width="0" fill="transparent"></rect><text x="0" y="19.0" fill="transparent" stroke="transparent" font-size="25">2.70K</text><text x="0" y="126.0" fill="transparent" stroke="transparent" font-size="25">0</text></g><g class="vert-line"><rect x="40.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="60.0" y="20" fill="transparent" stroke="transparent" font-size="30px">244</text></g><g class="vert-line"><rect x="94.54545454545455" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="114.54545454545455" y="20" fill="transparent" stroke="transparent" font-size="30px">249</text></g><g class="vert-line"><rect x="149.0909090909091" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="169.0909090909091" y="20" fill="transparent" stroke="transparent" font-size="30px">438</text></g><g class="vert-line"><rect x="203.63636363636363" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="223.63636363636363" y="20" fill="transparent" stroke="transparent" font-size="30px">981</text></g><g class="vert-line"><rect x="258.1818181818182" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="278.1818181818182" y="20" fill="transparent" stroke="transparent" font-size="30px">1.77K</text></g><g class="vert-line"><rect x="312.72727272727275" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="332.72727272727275" y="20" fill="transparent" stroke="transparent" font-size="30px">2.70K</text></g><g class="vert-line"><rect x="367.27272727272725" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="387.27272727272725" y="20" fill="transparent" stroke="transparent" font-size="30px">2.61K</text></g><g class="vert-line"><rect x="421.8181818181818" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="441.8181818181818" y="20" fill="transparent" stroke="transparent" font-size="30px">2.35K</text></g><g class="vert-line"><rect x="476.3636363636364" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="496.3636363636364" y="20" fill="transparent" stroke="transparent" font-size="30px">1.74K</text></g><g class="vert-line"><rect x="530.909090909091" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="550.909090909091" y="20" fill="transparent" stroke="transparent" font-size="30px">896</text></g><g class="vert-line"><rect x="585.4545454545455" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="605.4545454545455" y="20" fill="transparent" stroke="transparent" font-size="30px">499</text></g><g class="vert-line"><rect x="640.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="660.0" y="20" fill="transparent" stroke="transparent" font-size="30px">244</text></g>
</svg>
</div>
</td>
</tr>
<tr>
<td class="gt_row gt_left">
<span style="white-space:nowrap;"><img src="https://posit-dev.github.io/great-tables/blog/pycon-2024-great-tables-are-possible/data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAIAAAACACAYAAADDPmHLAAAABmJLR0QA/wD/AP+gvaeTAAAJn0lEQVR4nO2de6wdRRnAf6UP6RUjclu1pZcYofVRA7XUB2CLigqYSmOiJjaiqIjERHygia/oHxCNBsUQI77wQXiEaIJJoxEfxEhR1LaxlEfRant7C0pLUdtSubdyj398Z727386e/XbPnrN7zv1+ySZnZmdmZ2e/nfn2+2bmgOM4juM4juM4juM4juM4juM4juM4juM4juM4juM4juM4juM4juM4juM4Tm+5EJgAWn4UOvYBF+jGnGNq8mYxDpxSdyUGlHHgefGI4+qpR1ecVHcFBphRHTGIArCv7goMMBM6YhAFYK8Kb0CGMj/Sx4acthtIAdBS7PpANmMqPBQ9gL4JfZPODEMpALobcwHIRveOQzkEuABkMyt6gGW11GIwyBWAQWQBcIgZC9fWeqvTWOYCU8y00zQwUmuNKuTtwCPA34BX1VyXprKMpCl4f73VcfrN2SQFYEso0SDqAI4NPf6nvgDABaAOjgMuAm4E/gIcbR+7gO8CbwHmV3Ad/Qk4FArgoPMa4H7yXbe7gLd1ea3rVJkfs2a8EHG41O2/HrRjot12IeYAn0M08SJlXk/53uB2VZZZoPYWrKQfM8fujDa9posyf0y5oXqrKucsa8YjXVR2th/DrTnpYF0TwH3BeJuAJ4IpL8mUG4eB1QZJ1sz7gxUwA/bcZ9qyxNJv1D7gXWIEhiP/1E7z2nAvercNLBWP6gOLCQ53EwhhiETP1cXv6jAhWcbG0i21U/V+Rer84eB0xGd4FF17tWxfItIv4jbsT/EFSrvnqyEobHFnS128mztDwJ3tH8fA96JvN1jwLNj6Q4Dm2Phx4CN7TwRpwNvNNYr1wsY4QLQHXkC0EIe2lnA8xHNHNLj8QPAf1XcNuD7Ku6yiur1f0ICoKXFZ9xkY3nTpoF7SM5lnKfSPJlR/ldU+ALg6RXVC7AJgPcA2ZjMrQEeV+EXEp6ivxPYEQvPA15Rol6FegCfc2enrLl1F8m3/jnASzLS3q3CawzlmwXTIgBLSXdZWYwAVwHfQZSWYWYusCQWbmGfsj4J3KniPpyR9kEVfq6h/K79ANqIYJ118/VYnv3A8UUvPECMkWyjvxfMv17lnyRsrHmHSvcDQ9mHVZ5nZSXMMjGWHQbOiP1eDKwy5htEun3LfoJo/xELgA8F0mndYDqn3FHghFj4CPDPrMRZAlBWEdSzToZZgSyrAEa0gC+quPeQNvbo5Vx5M3sKzQOsugdoggI5BzGbfhtxiBxA7Ot/pv/+9hOBl5KtQ90KHIyFR4EzVRqtHD5asF4dBdMqANY3uW4j0pmIAeU3iBNmNWJWHQGWA+8GfogoVt362/PetDWICXYboskvCJRxDPitilupwutU+I9d1iuBdQiwvsl12hA+jhhcLHrHqcBtdOdvzxsCLgOe2f79cuC9GeXsUuG4wrYaEdyIJ4DfF6xXJUOA9UHWZUX8NPAl7J+rEZcjPYLZUxYjbwjQn4QfzbiOnqo9Gft9pTr3C8SzV6ReRXUTIP2Jc8CYT09FzhuvqmCjumaLsL99GtEBQv72L5e47mOqjCXq/Bhi34+n+WSgnHtUmsj7em77PuLnzjXU6y6V5zzrDcWZi4xP8YIsiwpCixEWlqmAkZMRs6oWurWIIyUeHzliliPmVS0ceqztxIjKP0m4N71BpZsi+UCWkG7npYjwPKzi87r+iHGVb3nn5PaCVhjz7VH5TitbAQM3qWv9i2x/e7zhFwMPqfP3Yh8KXqDy/jUj3RLSAvokcHH7/FXq3DZEkd2j4qeQr4k8Kn0BN6tKvM6YT3dBry1bgRzGSN5sC7gkdi4ef4S0src6kP9Nxmu/XuX7dYe0byY8GXQzySVuLeSt18NGC/iMsV6Fh+BOkw3LavT9+hK4nORD3cqMmVSbrneSnFwBYX/7+43XLmIEuh24IhB/DvAMFbeUdC/0LeDzxnoVtk52EoCmG4P0FOxrEamH8v728ynnb89r6K8B7+pQjxDTwBcQQc8z/0YUtk4WEYAmGYNGSfodJoFNsfDBZHJWkO1vj0/knAe80nD9Msuub0RsFD8zpN2BKLKfYkaoLRTuATp9Nzd5CFhFUnh3IONpRORvj7yRixHlcHugrLtJmlvXAL/KuX5ZP8BDSM+1Engr8uWxDLmXccQ5dAvwO2N5efXqSgDKduX9MAYtVmHtM59C/O3xSZQfYUZJ7JS3H/72+9tH1RQ2AhVRApukA2gB0FOsAL6pwhsJ90Z6uEhtphhAK5mlrG09oHAP0EkADiJWs4gRbI3zOPLZFXECHSYklESPi6H72ETy7Z5PeNaNLitP4VpEUlE8THhFUB1U2gNA2p7dFEVQv/Gh7WNbpJdUXUJ62FukwkX97U15+xeSfEGPAf/Iy5QnAE0dBvSNaRdqxE0kZ8OcBLwsJ2+l/vY+MkbyS+cRxJfQkTwBqMorWHUPsIXkza0k3AtMkVxxE6WN01N/ex8pJZi9EoBeDwGHENt9xHzE5BpC2+nj+sgqxK4fcZSK/e19pFS9BnUIAPHjx7mS8P1oL2bcn6797b8k6Y8P0dQhoCc9QJONQd8jad9/EfDBQDo9Qyiq21rk0zDOVw3XbaoS2JOeSbs9x4359PLk3VVUJsA31HWOklxHv5S0d21Z+9Db4OSN/RF6B5VTu72JiriDZL3WV1GonvhwDNu0q+PpYoOCAoySXsRyCDGzAlytzv0JcQPvVvFTpGfjhtATZaaBp6k0FyOfktql2++jsjUZZVcJ6UYwb1FSkPWEfeh3Yve3f9Z4rbzVQAuQXqjuh9/CZrQzsU0VfLYx3xaVz+JlK8sVFN+BKzqux/7nWeeovH9Q55siAA8b78e0+1STvwQirkPW0P2nQJ5pZGXOB5BGs5CnAE4B76PefXkn2nUwYRGAphqDNLcgrtxNeQkRT9w64BPYHz7YvIA3I8u96/qfoFNI71WUiUWha6oxKMQDyLTqM5D5fechOstcZKJl5G/Xq3GsNNUIVBqLAFS1Skg7XXrJ9vZxdcXlNtUIVJpeDgF3kXQL650uBpGh6wEslF0lBPLNfS2yPdog/k2tJm810FBSdpXQsGFdDTRQWG7gKcS3HGc2/lGT7v73YZ+u3VisEtyEjR/qZij/gMEqAL53YHO9gF3hPYCdWd0D1L31SxMYyk9AHwLsDOUQYN1SRUv7GyhmQx9GZnUP4AxJm1gF4CDFt0IdZiZozmqgrihiybqUIen2umQv9j9ucBzHcRzHcRzHcRzHcRzHcRzHcRzHcRzHcRzHcRzHcRzHcRzHcRzHcRzHqZT/AR2tECeE5DjpAAAAAElFTkSuQmCC" style="height: 2em;vertical-align: middle;"></span>
</td>
<td class="gt_row gt_left">
Filter
</td>
<td style="background-color: aliceblue;" class="gt_row gt_right">
$404K
</td>
<td style="background-color: aliceblue;" class="gt_row gt_right">
1%
</td>
<td style="background-color: papayawhip;" class="gt_row gt_right">
$70.0K
</td>
<td style="background-color: papayawhip;" class="gt_row gt_right">
0%
</td>
<td class="gt_row gt_center">
<div>
<svg viewbox="0 0 700 130" style="height: 2em; margin-left: auto; margin-right: auto; font-size: inherit; overflow: visible; vertical-align: middle; position:relative;">
<defs><pattern id="area_pattern" width="8" height="8" patternunits="userSpaceOnUse"><path class="pattern-line" d="M 0,8 l 8,-8 M -1,1 l 4,-4 M 6,10 l 4,-4" stroke="#FF0000" stroke-width="1.5" stroke-linecap="round" shape-rendering="geometricPrecision"></path></pattern></defs><style> text { font-family: ui-monospace, ‘Cascadia Code’, ‘Source Code Pro’, Menlo, Consolas, ‘DejaVu Sans Mono’, monospace; stroke-width: 0.15em; paint-order: stroke; stroke-linejoin: round; cursor: default; } .vert-line:hover rect { fill: #911EB4; fill-opacity: 40%; stroke: #FFFFFF60; color: red; } .vert-line:hover text { stroke: white; fill: #212427; } .horizontal-line:hover text {stroke: white; fill: #212427; } .ref-line:hover rect { stroke: #FFFFFF60; } .ref-line:hover line { stroke: #FF0000; } .ref-line:hover text { stroke: white; fill: #212427; } .y-axis-line:hover rect { fill: #EDEDED; fill-opacity: 60%; stroke: #FFFFFF60; color: red; } .y-axis-line:hover text { stroke: white; stroke-width: 0.20em; fill: #1A1C1F; } </style><line x1="22.5" y1="115.0" x2="677.5" y2="115.0" stroke="#BFBFBF" stroke-width="4"></line><rect x="30.0" y="39.67201166180758" width="40" height="75.32798833819243" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="84.54545454545455" y="49.07434402332361" width="40" height="65.92565597667638" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="139.0909090909091" y="48.09037900874635" width="40" height="66.90962099125365" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="193.63636363636363" y="37.63119533527697" width="40" height="77.36880466472303" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="248.1818181818182" y="32.93002915451895" width="40" height="82.06997084548105" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="302.72727272727275" y="19.118075801749264" width="40" height="95.88192419825074" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="357.27272727272725" y="21.63265306122449" width="40" height="93.36734693877551" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="411.8181818181818" y="28.739067055393583" width="40" height="86.26093294460642" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="466.3636363636364" y="36.137026239067055" width="40" height="78.86297376093295" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="520.909090909091" y="35.00728862973761" width="40" height="79.99271137026238" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="575.4545454545455" y="39.562682215743436" width="40" height="75.43731778425656" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="630.0" y="15.0" width="40" height="100.0" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><g class="y-axis-line"><rect x="0" y="0" width="65" height="130" stroke="transparent" stroke-width="0" fill="transparent"></rect><text x="0" y="19.0" fill="transparent" stroke="transparent" font-size="25">2.74K</text><text x="0" y="126.0" fill="transparent" stroke="transparent" font-size="25">0</text></g><g class="vert-line"><rect x="40.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="60.0" y="20" fill="transparent" stroke="transparent" font-size="30px">2.07K</text></g><g class="vert-line"><rect x="94.54545454545455" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="114.54545454545455" y="20" fill="transparent" stroke="transparent" font-size="30px">1.81K</text></g><g class="vert-line"><rect x="149.0909090909091" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="169.0909090909091" y="20" fill="transparent" stroke="transparent" font-size="30px">1.84K</text></g><g class="vert-line"><rect x="203.63636363636363" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="223.63636363636363" y="20" fill="transparent" stroke="transparent" font-size="30px">2.12K</text></g><g class="vert-line"><rect x="258.1818181818182" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="278.1818181818182" y="20" fill="transparent" stroke="transparent" font-size="30px">2.25K</text></g><g class="vert-line"><rect x="312.72727272727275" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="332.72727272727275" y="20" fill="transparent" stroke="transparent" font-size="30px">2.63K</text></g><g class="vert-line"><rect x="367.27272727272725" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="387.27272727272725" y="20" fill="transparent" stroke="transparent" font-size="30px">2.56K</text></g><g class="vert-line"><rect x="421.8181818181818" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="441.8181818181818" y="20" fill="transparent" stroke="transparent" font-size="30px">2.37K</text></g><g class="vert-line"><rect x="476.3636363636364" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="496.3636363636364" y="20" fill="transparent" stroke="transparent" font-size="30px">2.16K</text></g><g class="vert-line"><rect x="530.909090909091" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="550.909090909091" y="20" fill="transparent" stroke="transparent" font-size="30px">2.19K</text></g><g class="vert-line"><rect x="585.4545454545455" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="605.4545454545455" y="20" fill="transparent" stroke="transparent" font-size="30px">2.07K</text></g><g class="vert-line"><rect x="640.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="660.0" y="20" fill="transparent" stroke="transparent" font-size="30px">2.74K</text></g>
</svg>
</div>
</td>
</tr>
<tr>
<td class="gt_row gt_left">
<span style="white-space:nowrap;"><img src="https://posit-dev.github.io/great-tables/blog/pycon-2024-great-tables-are-possible/data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAIAAAACACAYAAADDPmHLAAAABmJLR0QA/wD/AP+gvaeTAAAMuUlEQVR4nO2dfZBWVRnAf+8uyy4hYIaxRMGChOAHmIkfETUVklioWfSx9EHjTFFONpiT00wZjZk1IX0wfVCEGUoJaFMkTUQlaGFIMmlGECjI15ogK6zCAvtufzz7Du/e+9x7z73v/Xj3vec3c2Z2z3vPuc/73ufe+5znPOc5YLFY8kvB8LhJwHhgONCYnDgWA4rA88AeYCNwPKkTNQG3ALuBbluqshwFfgq83uMaRmYcsLUKvqAtZuVl4EPqlYzAOOBgFXwpW8KVInCDcj19cdoATcAW5H1v6XucAN4KPG7aoJ/j/xvxvvj/BrYDJyOJZomTEcBkoMFR3x9YCEyN0mkB3eA7DMyKKqklMcYDm9FfBxdH6fAij87sxa9emtHttfmmHdSV/X2u8vlWYGV0+SwJ0wYsVuq1a6lSrgCvVT7/b1iJLKmzXalrNm1crgBOgxDgVGhxLGnTpdTVKXUqxgdaahOrADnHKkDOsQqQczTDLwnqgcE+n7cj49e+zqsDPn8J8dknjek0f+JPgAnAb4FXgBd9SgewDHFx9kU+iThk/L5jqczLSMZA5uH2KD1QQX+TEI0PM6O1l76nBKOQSZgws3aTYjz/R5VzbDBtnOQTYDH+j32NEcBdCciSJOfjnpTxowBMTEiW0CSlAKOAyyK2vQ6Z1eorPAl0hji+CPwjIVlCk5QCVBKi1Ijulq5W9gKfAJ4zOPYA8Blkar0qSGoUoCnWHvR334tKXX284iTO/T1lMN6yFxGbqKpIaxgI8gMcTvF8WXAkawF6MB5SW0dQzrEKkHOsAuQcqwA5xypAzrEKkHOsAuQcqwA5xypAzknTE1gtjEUWwDYDZ2csSxy8qZLGeVGAs5B4h1mEWDSRB2pdAQrA54HbCA7XyiW1rAADgLuJMXFCH+Kg6YG1qgD1wCrg6qwFyYBu4GemB9eqAtyJ/8V/DllTF3Z6ejxwoaNuL5KsKQwXA+c46rYh0UWVcARYDvw5SuM4g0KnKn3t8jhWC5wcFfG8IPF2XR79rgHeXEHfn1L6fIoQYdg9PKz086UK5IpMLfoB7kT/Xl9BngqVxONpoVwXIEamyW9ZAG4C3q589nQFckWm1l4Bw4GrlPrFwNdj6H8jsibfufx6PjAXyaegrdYFUZBx6PGSR4F1McgXmlpTgGtw34ntxPd47QLuABYpnzUTYl2+gwXI4pnUqbVXwKVK3YPEG4v4Q+ChGPvbCHwrxv5CUWsKoN2BxinTDCkCHwFWx9DXX4CZhFtXECu1pgCab9/YKRKCo8gClo8TLcZ/B2IzTAcOxShXaGrNBtAUOqnVuEVkQesyYAziIxgY0OYYkndpW0IyhabWFCArnukpfY5aewVYQmIVIOdYBcg5ebcB+gOtiIeuGm+GU0j29l+TkDGbdwVYhYzDq537kEwgsVONWp8WF9A3Lj7AbKAliY7zrAADshYgJG9IotM8K8ATwN+yFiJr8mwDdCGvgHV4h1bvBP6UmkSnaQXOSONEeVYAkPQ07wTWIluwOBmNPCXuSVMo4N2kpAB5fgWUaEcmZbRZwzpgKZIEqiaxCiC0AzOQMbeTOiTK9mOpSpQSVgFOcwi4El0J6oElwHmpSpQCVgF646cE/ek7fgNjrAK4KSmBFugxKGVZEscqgM4h4NGshUiDvA8Dw9JK9BzIYRim1C1EjNVyTgD/A/6OLOJ5IeyJrAKEY3RPyYJLfD6bA3wHCS+/HVEMI+wrwJuwy72ypgn4MhKy3mTayCqAN41ZCxCRacjaBSOsAngTFOFbzcwBrjA50NoA3mh7FtwNPJbCuW/GncpmObDeUdeI3PHXOOoLwI0YLFu3CuCNNv9+LxHX3ofkbbgV4FngJ8qxi4DvIqlwypmJOK98DUL7CtB5FboCpBX7v1upG+Nz/Ddwr0oejL4MvRdWAXQuwr3zxwlk15M0CKsAJV+Ak/cGnSipV4C2Y8Uw4I8JnS9utACRnXiv/Y+bHUrdecgN6xUdvBp4i6NuJu5XQy+SUgBtOXYTYrAE0Y2+j1CaaAqg3WFJsQX5Hcp9EYOQjTi9MomsRrKjlDMa2dbOM/tIUq+ArcC+iG0fQ1bfZonm7k3D+i9xGHniONGilko8jRiKTnxnMJNSgCLwxQjtTgK3xixLWIYjd42TNBUAYLNSFzQPoeUs8LUDkjQClyN76po+zvcia+4fSUwiM6bhdgO/BPwrZTk2KXXvCGjzO6XucnxyIiftB/g5sp/eFPxTtbYhd9jJhOUx4Uqlbi3pGYAltGjkc4GReG9SuR7JFVi+ZW89Eu72i6ATxr15dBZsxv0drg/RvgDsV/qYE6uU5rIcUGS5IaDdSqXNSq+DrR+gN5MRG6CcIvD7DGTpRn8KBI2kNDvgKjwmt6wC9MbpUwd5qjyftiA9aH6Tafhft4dwv67OQNzLLqwC9OZapS7OlHBh0RRgKPoezCUOoY9Y1NGAVYDTjEZWDDtZk7YgZexHD07VDNVytNGA6g9IWwEGIskYJiO+7Wpaofs+pa6NynILx4H2FJgR0EazA0pewV6koQBXIPFqzwAdSIq0TYin6xVkfH0H+t2XJpoCrCHETtwJoSnAFGCIT5tIXsG4h4ETOf0DmpQuZL69pYJzRh0GNqOnmNdsgrQZCBzHLdsHAtp9T2nzV+dBST0B5iIXI+hR5ZRlNrJpgmaNJ8m1uH+LY1TH7OXL6GsUgn5bzQ64DIdXMAkFWAD8CGiI2H4QkhTpptgkCkYbW68jowzeCn9Q6oKCPUpewXLqceykErcCfA74gsFxQbN9dYjdkMaToIA+Rs5y+OdEexKdg9tpVc4JxIXtpNdwME4FuBxZvaLxAvA1ZK+cBsRX3YgEMCxEV4g6KrcJTJiAHgCaRuyfKU/hvptBjEE/tNHAdCRW0EWlRuCjSvtuYAX+FivA65DU6Vr7ZSFkiGIEzlXa7A1xzrRYi1vOBQFthiK5Bp3t3lU6IK4nwNXo2ngf8GFkOtWP/YhR87DyWSv6/HxcTFDqNDmyxmXBIz4VPw6iewVbSn/EpQCtSt0eZJct0wyXx5FkiB2O+jpEiZJCC7bUfuys0eIDWgzaLXX830VZeFscCtAAvEep/ybhreh9wI+V+uvCChUCTQEy2cErgO1KXYtBu3uAbyNezW3IzaoGt0S1AcYr7brQDSsTJiv9FTFb8BjFBmhX2mS1AtiPJnQbqaIlbHE8AbShyAEkVj0KT+J+bRQQQzEJtKioahn/l9OJ/jqtKKorDgV4jVK3v4L+OtETHQytoE8/tCFo1O3fkuRs3NeriHgKIxOHArQpdWdW0F/Bo/0Bg7Za3J5zhY+TXUrdbINzpY02kXMAGeZFJg4F0GadWgge+3sxAXf4Uidm6wy0106QLaLlC74FMUYvwcNpkiLDgM8inlEnFYeqxxEVfAB3JGoDYrlHSbE6S6nbjtlwUnv1TAF+4NNmObIcu5wC8OmecgoxFDVPXJL0Q24ivxvpl3GesBJP4L1K2x2Ez7IxFFkV4+zrdsP2c5S2HQS/0x9Q2lV7eYKYw/orUYCZHkIuCXH+emTWS+vnQsM+vFyfK/DP+XMW8E+Pc1djaUOG37FSiQI0AP/xEHYJwU+CIcj8tdY+7KTM/R79fB9/g3AIspBFCwyppvIIwS7gSFQ6GTRDaV8qO5FlYk7rfhiyfLnNo91JwoeKjUWMRq2/Tci8hV+swvmIF3OLTz9pl13Ia3Y6MWcvK+9sHu7p3AeB94fobylyob04hYwa2pFx7Uj8RyK3Yf7+L+dW5CJ6cQRJwhAU798AjEAU90zSTalzDAnxbsOdINKLDuQJ+KsoJ4wjJrAB70d52KLNCZhSQDdM81IiTZ7FFRQ6ALl4UYU/Bcwn2IETRD/kvZ/1xcii/CbKDxZ3VPD1yOxTGMEfB6ZWcE6NVmQ1bdYXJc2yIcoPlcTq4DokfHkFEpygCbsPcRiZpI+JygAkXnE9+jCx1oqxAiRt1BSR3TlXIcowErH8ByGGTRvphF8dQ/LpLULyFIxBZheNc+pWMVMR5Y5EmlZtERnO7ErxnBqHkeVeWS/5iouKchrbxaE5xypAzrEKkHPKFUALLLDJpKsfzV9inNCqXAG0YIo3hhbHkjbOrOKgR2kFMgl9TPnByKJZkqYZ3b/y1SidFZAhmrOzw1glqEYmoIfBd+O9G7oL59TizcBdHsduRUKzjHeksiTGCOBSdBttAwb7BJRwKkAjEmpUc3vk5oQTyIprYyeXcxjYiWTLOBijUJZ06EZWOsfi4RyLpCfLelLDFrPSQXDOoNA0IjOEz1bBF7RFL0eAxYhNEAnT+LKJSBTqcGpjBq0vU0RC2XYjC0M6sxXHYrH0Xf4PawEA5EVGIRAAAAAASUVORK5CYII=" style="height: 2em;vertical-align: middle;"></span>
</td>
<td class="gt_row gt_left">
Drip machine
</td>
<td style="background-color: aliceblue;" class="gt_row gt_right">
$2.63M
</td>
<td style="background-color: aliceblue;" class="gt_row gt_right">
9%
</td>
<td style="background-color: papayawhip;" class="gt_row gt_right">
$1.37M
</td>
<td style="background-color: papayawhip;" class="gt_row gt_right">
9%
</td>
<td class="gt_row gt_center">
<div>
<svg viewbox="0 0 700 130" style="height: 2em; margin-left: auto; margin-right: auto; font-size: inherit; overflow: visible; vertical-align: middle; position:relative;">
<defs><pattern id="area_pattern" width="8" height="8" patternunits="userSpaceOnUse"><path class="pattern-line" d="M 0,8 l 8,-8 M -1,1 l 4,-4 M 6,10 l 4,-4" stroke="#FF0000" stroke-width="1.5" stroke-linecap="round" shape-rendering="geometricPrecision"></path></pattern></defs><style> text { font-family: ui-monospace, ‘Cascadia Code’, ‘Source Code Pro’, Menlo, Consolas, ‘DejaVu Sans Mono’, monospace; stroke-width: 0.15em; paint-order: stroke; stroke-linejoin: round; cursor: default; } .vert-line:hover rect { fill: #911EB4; fill-opacity: 40%; stroke: #FFFFFF60; color: red; } .vert-line:hover text { stroke: white; fill: #212427; } .horizontal-line:hover text {stroke: white; fill: #212427; } .ref-line:hover rect { stroke: #FFFFFF60; } .ref-line:hover line { stroke: #FF0000; } .ref-line:hover text { stroke: white; fill: #212427; } .y-axis-line:hover rect { fill: #EDEDED; fill-opacity: 60%; stroke: #FFFFFF60; color: red; } .y-axis-line:hover text { stroke: white; stroke-width: 0.20em; fill: #1A1C1F; } </style><line x1="22.5" y1="115.0" x2="677.5" y2="115.0" stroke="#BFBFBF" stroke-width="4"></line><rect x="30.0" y="32.17054263565892" width="40" height="82.82945736434108" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="84.54545454545455" y="52.093023255813954" width="40" height="62.906976744186046" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="139.0909090909091" y="38.6046511627907" width="40" height="76.3953488372093" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="193.63636363636363" y="33.720930232558146" width="40" height="81.27906976744185" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="248.1818181818182" y="15.0" width="40" height="100.0" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="302.72727272727275" y="19.806201550387602" width="40" height="95.1937984496124" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="357.27272727272725" y="24.457364341085274" width="40" height="90.54263565891472" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="411.8181818181818" y="25.232558139534888" width="40" height="89.76744186046511" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="466.3636363636364" y="35.465116279069775" width="40" height="79.53488372093022" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="520.909090909091" y="38.75968992248062" width="40" height="76.24031007751938" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="575.4545454545455" y="43.7984496124031" width="40" height="71.20155038759691" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="630.0" y="24.76744186046512" width="40" height="90.23255813953489" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><g class="y-axis-line"><rect x="0" y="0" width="65" height="130" stroke="transparent" stroke-width="0" fill="transparent"></rect><text x="0" y="19.0" fill="transparent" stroke="transparent" font-size="25">2.58K</text><text x="0" y="126.0" fill="transparent" stroke="transparent" font-size="25">0</text></g><g class="vert-line"><rect x="40.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="60.0" y="20" fill="transparent" stroke="transparent" font-size="30px">2.14K</text></g><g class="vert-line"><rect x="94.54545454545455" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="114.54545454545455" y="20" fill="transparent" stroke="transparent" font-size="30px">1.62K</text></g><g class="vert-line"><rect x="149.0909090909091" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="169.0909090909091" y="20" fill="transparent" stroke="transparent" font-size="30px">1.97K</text></g><g class="vert-line"><rect x="203.63636363636363" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="223.63636363636363" y="20" fill="transparent" stroke="transparent" font-size="30px">2.10K</text></g><g class="vert-line"><rect x="258.1818181818182" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="278.1818181818182" y="20" fill="transparent" stroke="transparent" font-size="30px">2.58K</text></g><g class="vert-line"><rect x="312.72727272727275" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="332.72727272727275" y="20" fill="transparent" stroke="transparent" font-size="30px">2.46K</text></g><g class="vert-line"><rect x="367.27272727272725" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="387.27272727272725" y="20" fill="transparent" stroke="transparent" font-size="30px">2.34K</text></g><g class="vert-line"><rect x="421.8181818181818" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="441.8181818181818" y="20" fill="transparent" stroke="transparent" font-size="30px">2.32K</text></g><g class="vert-line"><rect x="476.3636363636364" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="496.3636363636364" y="20" fill="transparent" stroke="transparent" font-size="30px">2.05K</text></g><g class="vert-line"><rect x="530.909090909091" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="550.909090909091" y="20" fill="transparent" stroke="transparent" font-size="30px">1.97K</text></g><g class="vert-line"><rect x="585.4545454545455" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="605.4545454545455" y="20" fill="transparent" stroke="transparent" font-size="30px">1.84K</text></g><g class="vert-line"><rect x="640.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="660.0" y="20" fill="transparent" stroke="transparent" font-size="30px">2.33K</text></g>
</svg>
</div>
</td>
</tr>
<tr>
<td class="gt_row gt_left">
<span style="white-space:nowrap;"><img src="https://posit-dev.github.io/great-tables/blog/pycon-2024-great-tables-are-possible/data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAIAAAACACAYAAADDPmHLAAAABmJLR0QA/wD/AP+gvaeTAAAHbElEQVR4nO2dbYgVVRjHf7vmrpubGippplYaEfma9maE1aplaGWa9SGFIAkKwU+VRJQWVPShgqCSKNOIUivQXkhMTK0PlWlJtIZub761rqi566brSx+eme7M3Hu9u/femTPnnucHA/P+PHfuf84zc55zzoCiKIqiKIqiKIqiKIqiKJVPlWH7dcBAwz6YZh/QbtoJE8xGfvgZx6djwKwSr6WV7MD8xU/L1FjitSyaalOGgd8M2k4bTaYMm3wGGAg8BQwr4Rw3ArXe/ElgQ4k+dZbrgPrA8nrgdJHn2gksAvaX6pSL7CZTjB5J0O42wkV4TYK2y4rJEKCkABWA46gAHEcF4DgqAMdRATiOCsBxVACOowJwHBWA46gAHEcF4DgqAMdRATiOLQJYCOwClgE9DPtyNnoA7yK+PmbYl4phFOHc+yOBbWlrDzA/sn5Egj4VhQ0lwNACy2liSGT5YhNOdAUbBKDEiArAcVQAjqMCcBwVgOOoABxHBeA4KgDHUQE4zjmmHSgj1cClCdmKdgUzPc5C0VSSAOqRJIwJzhiyWzK2hwBrL3xasF0AP5h2ANgOnDDtRLHYHgLmAXuAywzZ3ws8Y8h2WbBdAM3Aw6adsBnbQ4BSIioAx1EBOI4KwHFUAI6jAnAcFYDjqAAcRwXgOCoAx1EBOI4KwHFUAI6jAnAck23ZxgNvAJcU2K874bH5/yW939ipIzx+QSvQUeCYJuAhYEtcTqWVLZj/VEtapu9KvJZFYzIEaHu+FGAyBIxDQkBSTbnTyi4kBKShfaOiKE5hS4+W4cC9wHmmHekkrcD7yBfBlBLpC7Rg/km9q1OL53uqsaEi6GosuJA56IvUdaQaGwRgc9+F7qYdKISNF/dNYK1pJ/IwB5hu2omuYKMAtgIrTTuRh2uwTAA2hAAlRlQAjqMCiJc1yCthK9AIfIDUZ6Qm9KoAkqEncDkwG6kg+gm4wahHHioAM1wBfAncZ9oRFUC87EcafOwmu2FILbAUmJCwTyEqVQDdgcHAGG/qY8iPecAwz5f+wALkecCnFlgCdEveNaGSBFCP5NXXAYeAP5E6g63AQWA9MNmYd/JFk1eAm4G2wPorgVlGPKJyBHA/UtS+DjQgD11BqpELvxZYjdncwvfA4si6e0w4AvYLoAp4DliOFLGdYTpSKoyJy6lOsDSyfK0JJ8B+ATwJPJ5jfRvwNVJlvBoJCUEGA18Bt8TqXX6aCX/k6kIsSByZYhrhPLs/KlgVcCCy7S9gLnBu5Bx9gFfJztm3A7cX4VMDUpRvBaYE1r8YOf+0s5wj6ns0bCke+QRQG1m/B+hX4FxzkEEdg8cdB+7ugj/1ni3/+GYyLausE4DtISDIAaQVztlYDsxEOpf41AArgEcp3ESuBliFFNk+/bG4+K4kAXSWNcBdhHsXdQNeAD4FRuY5bgrwLXBrrN4lTGqSEgnzBRL71xDudjYV+YM3IvX11cjdPgEYkLCPieCqAAA2IO0NP0Lq5n2qgZu8qeJxMQQEaUTu7lVdOOYk4WcIq3FdAACHkZq4BqSm8HSe/Q4h7RFHAjuScS1+bAwBcXVmWe9NfYHryTzptyB/eCNwqky2qgg/exgrVWwUQNwcBD6J2cZowuMI7KN84uoSGgLM8ERkeaMRL1ABJE0VsIjs9O97BnwBNATEzXBkHIQeyKvmg2Rn/jYCnyXs1/YKACbRhZ5qcD2g8ADSTiSDxtDgC1d2gvxB5KObjLphA0CiN7xafa5rfAunEBS0+OQ6maj2BACjkWW/ZTvcW+bn/tPcvCI3oH5NjLfDYyWTpuAX7z5FuBn4HOyG6gYwwYBRFO8wVTsPqTVLcBFiAiOxuxPL2BQYHlvYH5QZN+XkVxDaklzceqzk3D17IjA/DeB+RpgRgL+zCSc/w/6MCqyrw4RUya2kWk5cwoY6K2fQbhVTRNyh8ZFH+D3iM07vW2DEKH661uxo4S1gmhTq/ne+m5IXA1uW0s8zwO9kO5cQVvbyXTqWBDZZqxypxIZS3b7P78N3RSkVAhu34EU1TVlsF2LdOrcGbFxCpjk7VOPPI8Et08tg+3YsemdejPhHrVPI9WqIHXrz+Y45igihsNF2jwf6dVbn2PbQuB5b34x0kTdZy8wFMnyKWViMuE7rINwk+yFZJcEcUwnkQakPrd564L7zC3j71YCrCR8oQ8R7uHTAPxIfH/+FmBiwN5Yz4fgPpuxq2S1in5I54/gBW9F4r1PNdLgcwlS09ZM8X/434igXkNKm+Br80zPdnD/I0hnTyVGxgP/EL7wp4F3gCEJ2B8CLCP8yncGqQ002fvYKSYid1v0jm0H3kbezevKaK8OuAN4C6l+jto9gfRQtg6bY9Vo4EMyVcFROpAROnbTuSRNLnoiVcwDyN/7Zz/ymripSBtKCfRGxgRI4uk/1/Qx4dyEYogxyBtCB8n88esw2Ke/nNgcAnJxAdLTdxJwFfLAVo6EVzOSj9iAhJ1fy3DOVFBpAohSi+QFik0QtSO1ia2FdlQURVEURVEURVEURVEURUkv/wHWVuZNktlnBAAAAABJRU5ErkJggg==" style="height: 2em;vertical-align: middle;"></span>
</td>
<td class="gt_row gt_left">
AeroPress
</td>
<td style="background-color: aliceblue;" class="gt_row gt_right">
$2.60M
</td>
<td style="background-color: aliceblue;" class="gt_row gt_right">
9%
</td>
<td style="background-color: papayawhip;" class="gt_row gt_right">
$1.29M
</td>
<td style="background-color: papayawhip;" class="gt_row gt_right">
9%
</td>
<td class="gt_row gt_center">
<div>
<svg viewbox="0 0 700 130" style="height: 2em; margin-left: auto; margin-right: auto; font-size: inherit; overflow: visible; vertical-align: middle; position:relative;">
<defs><pattern id="area_pattern" width="8" height="8" patternunits="userSpaceOnUse"><path class="pattern-line" d="M 0,8 l 8,-8 M -1,1 l 4,-4 M 6,10 l 4,-4" stroke="#FF0000" stroke-width="1.5" stroke-linecap="round" shape-rendering="geometricPrecision"></path></pattern></defs><style> text { font-family: ui-monospace, ‘Cascadia Code’, ‘Source Code Pro’, Menlo, Consolas, ‘DejaVu Sans Mono’, monospace; stroke-width: 0.15em; paint-order: stroke; stroke-linejoin: round; cursor: default; } .vert-line:hover rect { fill: #911EB4; fill-opacity: 40%; stroke: #FFFFFF60; color: red; } .vert-line:hover text { stroke: white; fill: #212427; } .horizontal-line:hover text {stroke: white; fill: #212427; } .ref-line:hover rect { stroke: #FFFFFF60; } .ref-line:hover line { stroke: #FF0000; } .ref-line:hover text { stroke: white; fill: #212427; } .y-axis-line:hover rect { fill: #EDEDED; fill-opacity: 60%; stroke: #FFFFFF60; color: red; } .y-axis-line:hover text { stroke: white; stroke-width: 0.20em; fill: #1A1C1F; } </style><line x1="22.5" y1="115.0" x2="677.5" y2="115.0" stroke="#BFBFBF" stroke-width="4"></line><rect x="30.0" y="46.693635382955776" width="40" height="68.30636461704422" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="84.54545454545455" y="58.91585760517799" width="40" height="56.08414239482201" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="139.0909090909091" y="46.3160733549083" width="40" height="68.6839266450917" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="193.63636363636363" y="39.228694714131606" width="40" height="75.7713052858684" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="248.1818181818182" y="29.71413160733549" width="40" height="85.28586839266451" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="302.72727272727275" y="21.10571736785329" width="40" height="93.89428263214671" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="357.27272727272725" y="21.224379719525352" width="40" height="93.77562028047464" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="411.8181818181818" y="30.889967637540458" width="40" height="84.11003236245955" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="466.3636363636364" y="41.34304207119741" width="40" height="73.6569579288026" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="520.909090909091" y="39.886731391585755" width="40" height="75.11326860841424" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="575.4545454545455" y="40.81445523193096" width="40" height="74.18554476806904" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="630.0" y="15.0" width="40" height="100.0" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><g class="y-axis-line"><rect x="0" y="0" width="65" height="130" stroke="transparent" stroke-width="0" fill="transparent"></rect><text x="0" y="19.0" fill="transparent" stroke="transparent" font-size="25">9.27K</text><text x="0" y="126.0" fill="transparent" stroke="transparent" font-size="25">0</text></g><g class="vert-line"><rect x="40.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="60.0" y="20" fill="transparent" stroke="transparent" font-size="30px">6.33K</text></g><g class="vert-line"><rect x="94.54545454545455" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="114.54545454545455" y="20" fill="transparent" stroke="transparent" font-size="30px">5.20K</text></g><g class="vert-line"><rect x="149.0909090909091" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="169.0909090909091" y="20" fill="transparent" stroke="transparent" font-size="30px">6.37K</text></g><g class="vert-line"><rect x="203.63636363636363" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="223.63636363636363" y="20" fill="transparent" stroke="transparent" font-size="30px">7.02K</text></g><g class="vert-line"><rect x="258.1818181818182" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="278.1818181818182" y="20" fill="transparent" stroke="transparent" font-size="30px">7.91K</text></g><g class="vert-line"><rect x="312.72727272727275" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="332.72727272727275" y="20" fill="transparent" stroke="transparent" font-size="30px">8.70K</text></g><g class="vert-line"><rect x="367.27272727272725" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="387.27272727272725" y="20" fill="transparent" stroke="transparent" font-size="30px">8.69K</text></g><g class="vert-line"><rect x="421.8181818181818" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="441.8181818181818" y="20" fill="transparent" stroke="transparent" font-size="30px">7.80K</text></g><g class="vert-line"><rect x="476.3636363636364" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="496.3636363636364" y="20" fill="transparent" stroke="transparent" font-size="30px">6.83K</text></g><g class="vert-line"><rect x="530.909090909091" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="550.909090909091" y="20" fill="transparent" stroke="transparent" font-size="30px">6.96K</text></g><g class="vert-line"><rect x="585.4545454545455" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="605.4545454545455" y="20" fill="transparent" stroke="transparent" font-size="30px">6.88K</text></g><g class="vert-line"><rect x="640.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="660.0" y="20" fill="transparent" stroke="transparent" font-size="30px">9.27K</text></g>
</svg>
</div>
</td>
</tr>
<tr>
<td class="gt_row gt_left">
<span style="white-space:nowrap;"><img src="https://posit-dev.github.io/great-tables/blog/pycon-2024-great-tables-are-possible/data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAIAAAACACAYAAADDPmHLAAAABmJLR0QA/wD/AP+gvaeTAAAJT0lEQVR4nO2da4xdVRXHf/Mq085Mp+O0ddoZi0IttI3UiqkgauoDH6j1UV+kihHjAyP6waDBmPiIMRE1PhOfAaIQFeELgg8QX0GtFAUNCAqlL9pSaTstw3TKdNrrh/8+OafXO3fmztw5Z8/t/5fsnHMfc86as9fee+219toXjDHGGGOMMcYYY4wxxhhjjDHGGGOMMcYYY4wxxhhjjDHGGGOMMcYYY0zUNBUtQJ3pAuYBHUA30Bzez56D/u8F4fxJ4FjZdQ4DJzLnI8ARYLD+IhfLbFCApcBqYDnwdGAR0AcsDucLUKV35STPSCiDwOOZsjccdwD3AduA4znJNGViVIAW4FLgHcBaoGec740CBzPlKHAIteYhVElHw+snK/z9CDBGZcU5DSlVa/h8LtAeztuBp2XKvHHkGwH+BdwKfDXIFh0xKsB7gR+E82HgZvQgd6BWtQs4QOVKLYJEIZYCzwxlOfA6oD9850fAJQXINiGtRQtQgX+gFtyFxvKLUfe6I5RHkQIcDMcDqHUdRr3CMBqvn6qTPM3Ihkh6hQ407CQ9QG849gOnhzLAyc92a51kqTsx9gAAF6Kusw14EMl5OmpttZA15hLlqEZSyQnlxuNEjCEF3Y6Gr27gD8CrqJ9C1pVYFQDgPcDVwEPAC4H9yAhcgoy/bAvsATpJx+r5SHm6w7WyVv9EZC39ZIYwSGpLHAGeIO19kp5oH7AbKcEHgO8ADwAX0ICzh7z4HFAC/sr4xlZsvAYpy+PIFjDToAm4FinBDdTWHRfBWmS/HAHOK1iWhqENuB0pwVUFy1KNfjRDOQ68qWBZGo75wD+REny4YFkqMR/NXkrARwqWpWEZQC1sDHhDwbJkaQNuQ5X/lYJlaXieh8bYYeAFBcsCslGuQZV/M/JimhnmImRl70W+gSL5DKr8u5g9s5SG4H3owd/P+LGCmeZi5GR6BAWmTM58CSnB75EHL0/Wo0DTfuCsnO9tAk3AdUgJfkx+Xs1VyLM3Arwop3uacWgH7kRK8Nkc7rcE+flPAJtyuJ+ZBL3Av5ESfHAG7zMPuaRLwBUzeB8zBZYj3/soiiSCeofphrs7w7EVRSdLwLenec2oiDkaWCvnA3cgJXg98EvkpHkIReUeQKHaQyiaN4QMuR7kyetC0cWzQ1kFLAQ+CSxDvcutwBuRM8pEyFuQL343WoVzJwrXlmoso0hhbgJ+Gt77G2mP0DA0Ug+Q8DHgy8C9wEtQS+8HXhk+b0Otvgt17UlvMISmk/chx84x4O1ohrELRff25vVPmOnxLdRqf4Eq+Qukrfu/aInWPcDdaMXRdjQclJAitKMpXrL6d3Wu0udIo/quf41i869Flfoz1PL3IYVoQ0vLe9AzGEW2wp+B68P5H5EibEA9gplldKBVxIPIyKuFLyLFuazeQsVGjKuCq9GELPPeTFmIWnKybr8jnHejcXwBGv9vrOE+l6JFnC0oP+EgUqTssSGIVQFagOcgI24lcAbwLBT9mzOF69WSoZMsA28Dvlnle+UKMYiGmJ3IaHwU2Rr7piBvbsQ2C+hFLt1NnLyK9wSwB3Xpu0lX5GbzApLMoBFS1/BbUWWcFd6fLDcCG1Gw52uoJ8lmA/WUva42PTyAVjP9Hfg5mppGnzJWFHejytuGllVvAlZQe6u/hNTq/wbwamQUDlA5t6AVVeoZwIuBy9EQUELOn4loQ0vWz0EZQR9CM48bkD/hWEaeXcSxmCU6+kgf0u3IA7cezeFr7an6gS3U7gAqL8PA+6f+LwEazlYD3yVVhJ9M85p1IyYbYE047gdeEUrCU2iuvg14LHxnP/L/HwjnI2gISDKALkCKsI40XauTkxNIOtES7hNoDB9Ezp49wMPA5vB5NVpQ6+9D+YHJcQVyJ6/k/3udWoajGSUmBRgIx83IgXMIeAYyBleih3ohtfsuKmUMPxHe24WUK1vJS0I5F3kCQfbIXBQRTNLR5yJjsVr62Cga/+8KZS3wUZTsGgUxGYHnoADO0sx729EDTLKC96IKGyVN90rcul3hdXfmdSdpeliydKzWfL9yssGk5DiIeqYdQc6kdADPBZ6PjMozUSDpPBRbKJyYFAAkz7uATwHPnuC7JTTFSiriEMrdGyp7b4h0B5DsbiBt4bwz81nC8fBZe9l7R1GlJswn7QW60SxmGVLicoPzMFo5/HngPxP8b7kRkwLMQS7bDVW+cz9y8y4KZQlyBHUTV6RuN3InJ2Uz8BciDCPHZANchir/NuSPzxpKfWg6dy+K9lUiceAk8f05pC7gdjRmQxoFzGYMz+Hkll2JQ6jXAfUWw6EMZs5vCtcZqHSBGIlJAc4Px3ci634BisjNJTX8quX3Zy35ohhCw8CsISYFyI7FfchIWlr2nRPETTNpLzEriEkBsrwMVf4PgT+hrv0q4hrnK9FJPHsXTYpY8+0T1+8dwPfQLltjyO8eM71EuhvYeMSqAOWMIcv6zKIFqUIvslui3RCqErEOAckMYBXyyIFa1kq0bi/GDZfODseHC5ViFnMLMqDmovH/MJUDNLGmY30cybexaEFqIaYeYE849iHX7zr0MJO5/DKUkbsexdRjYz1SgBhlmxW8Gz3AW1BM/tyy8lI0DbynKAGr0IOGpS1FCzKbaUFW/2Ti9LEt0072K5h1OYMxxQJAQ9JFKDJYac6/GG0g+X2mv1CjXjShiOUKtG5xT/Wvm+nQhHbjOkI8/vYNqPVfW7AcpwwbieeBt6I1f6N4p5DcaEbG1nFkeRfJlaQLT02OrEbOom2kK37yZi2y/Hcy+Y2oTR25ArW+X5F/juNi0p+EeXnO9zaBZrQAo4R+YSSvuEY3WuFTAj6R0z3NOLQDv0OVcQ0z79lciFb3ltA6fxMB3aQ7hf0WVdJMsAZ1+8k+QbH5UE5pTiPds/cx4M11vHYrsvaPojH/Slz50XI5WpdXAn7D9H60oRkllz4YrreTdJsZEzEDKCkziRtsQcmak9lYugklcnwaJaWU0FTv69S+ycSsoJG7snXoxyXeRrqX8Fbkt38E5RSOIUOyFy02WYPy/EDrEa5HexJvz0toU38WocDRdShda7wIY7Lz99VIaU6J7d8buQcYj17kyFmIkkSOoB0+tjLx7woaY4wxxhhjjDHGGGOMMcYYY4wxxhhjjDHGGGOMMcYYY4wxxhhjjDHGGJMv/wObu0Q9TdhwNgAAAABJRU5ErkJggg==" style="height: 2em;vertical-align: middle;"></span>
</td>
<td class="gt_row gt_left">
Pour over
</td>
<td style="background-color: aliceblue;" class="gt_row gt_right">
$846K
</td>
<td style="background-color: aliceblue;" class="gt_row gt_right">
3%
</td>
<td style="background-color: papayawhip;" class="gt_row gt_right">
$365K
</td>
<td style="background-color: papayawhip;" class="gt_row gt_right">
2%
</td>
<td class="gt_row gt_center">
<div>
<svg viewbox="0 0 700 130" style="height: 2em; margin-left: auto; margin-right: auto; font-size: inherit; overflow: visible; vertical-align: middle; position:relative;">
<defs><pattern id="area_pattern" width="8" height="8" patternunits="userSpaceOnUse"><path class="pattern-line" d="M 0,8 l 8,-8 M -1,1 l 4,-4 M 6,10 l 4,-4" stroke="#FF0000" stroke-width="1.5" stroke-linecap="round" shape-rendering="geometricPrecision"></path></pattern></defs><style> text { font-family: ui-monospace, ‘Cascadia Code’, ‘Source Code Pro’, Menlo, Consolas, ‘DejaVu Sans Mono’, monospace; stroke-width: 0.15em; paint-order: stroke; stroke-linejoin: round; cursor: default; } .vert-line:hover rect { fill: #911EB4; fill-opacity: 40%; stroke: #FFFFFF60; color: red; } .vert-line:hover text { stroke: white; fill: #212427; } .horizontal-line:hover text {stroke: white; fill: #212427; } .ref-line:hover rect { stroke: #FFFFFF60; } .ref-line:hover line { stroke: #FF0000; } .ref-line:hover text { stroke: white; fill: #212427; } .y-axis-line:hover rect { fill: #EDEDED; fill-opacity: 60%; stroke: #FFFFFF60; color: red; } .y-axis-line:hover text { stroke: white; stroke-width: 0.20em; fill: #1A1C1F; } </style><line x1="22.5" y1="115.0" x2="677.5" y2="115.0" stroke="#BFBFBF" stroke-width="4"></line><rect x="30.0" y="43.24988516306844" width="40" height="71.75011483693156" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="84.54545454545455" y="55.69820854386771" width="40" height="59.30179145613229" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="139.0909090909091" y="45.592558566835095" width="40" height="69.4074414331649" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="193.63636363636363" y="37.508038585209" width="40" height="77.491961414791" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="248.1818181818182" y="25.886541111621497" width="40" height="89.1134588883785" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="302.72727272727275" y="15.0" width="40" height="100.0" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="357.27272727272725" y="16.65365181442352" width="40" height="98.34634818557649" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="411.8181818181818" y="29.745062011943045" width="40" height="85.25493798805695" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="466.3636363636364" y="36.22186495176849" width="40" height="78.77813504823152" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="520.909090909091" y="32.041800643086816" width="40" height="82.95819935691318" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="575.4545454545455" y="41.4584290307763" width="40" height="73.5415709692237" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="630.0" y="15.551217271474503" width="40" height="99.4487827285255" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><g class="y-axis-line"><rect x="0" y="0" width="65" height="130" stroke="transparent" stroke-width="0" fill="transparent"></rect><text x="0" y="19.0" fill="transparent" stroke="transparent" font-size="25">2.18K</text><text x="0" y="126.0" fill="transparent" stroke="transparent" font-size="25">0</text></g><g class="vert-line"><rect x="40.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="60.0" y="20" fill="transparent" stroke="transparent" font-size="30px">1.56K</text></g><g class="vert-line"><rect x="94.54545454545455" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="114.54545454545455" y="20" fill="transparent" stroke="transparent" font-size="30px">1.29K</text></g><g class="vert-line"><rect x="149.0909090909091" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="169.0909090909091" y="20" fill="transparent" stroke="transparent" font-size="30px">1.51K</text></g><g class="vert-line"><rect x="203.63636363636363" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="223.63636363636363" y="20" fill="transparent" stroke="transparent" font-size="30px">1.69K</text></g><g class="vert-line"><rect x="258.1818181818182" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="278.1818181818182" y="20" fill="transparent" stroke="transparent" font-size="30px">1.94K</text></g><g class="vert-line"><rect x="312.72727272727275" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="332.72727272727275" y="20" fill="transparent" stroke="transparent" font-size="30px">2.18K</text></g><g class="vert-line"><rect x="367.27272727272725" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="387.27272727272725" y="20" fill="transparent" stroke="transparent" font-size="30px">2.14K</text></g><g class="vert-line"><rect x="421.8181818181818" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="441.8181818181818" y="20" fill="transparent" stroke="transparent" font-size="30px">1.86K</text></g><g class="vert-line"><rect x="476.3636363636364" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="496.3636363636364" y="20" fill="transparent" stroke="transparent" font-size="30px">1.72K</text></g><g class="vert-line"><rect x="530.909090909091" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="550.909090909091" y="20" fill="transparent" stroke="transparent" font-size="30px">1.81K</text></g><g class="vert-line"><rect x="585.4545454545455" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="605.4545454545455" y="20" fill="transparent" stroke="transparent" font-size="30px">1.60K</text></g><g class="vert-line"><rect x="640.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="660.0" y="20" fill="transparent" stroke="transparent" font-size="30px">2.16K</text></g>
</svg>
</div>
</td>
</tr>
<tr>
<td class="gt_row gt_left">
<span style="white-space:nowrap;"><img src="https://posit-dev.github.io/great-tables/blog/pycon-2024-great-tables-are-possible/data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAIAAAACACAYAAADDPmHLAAAABmJLR0QA/wD/AP+gvaeTAAAKB0lEQVR4nO2de4wdVRnAf7tddvtYywq0dUVsSq22gEB5iEqCkNJQSmIlFdvGR6VbUihWMEiKKAaEoAki+C4xLdYSC75iLRrig0eJ2mqplWCxCgilLcXyaIFul273Xv/4vpOZvd69u3t35pyZne+XTM49c86e+Wbm2zPnfN95gGEYhmEYhmEYhmEYhmEYhjHMGRFagIA0A+OBUUBnYFkMj7QDq4D9QFmPbUAH0BhQLsMDpwB7kJfeCWwFdhMpwk8wJRi2jAG2Iy/6buDoWNq5wLOadr1vwQw/LERe8O+BhirppwGHgJeB0R7lMjyxFlGAj9TIs17znOVFogxQpO9dm4Y7auTZreGxKcuSGYqkAM9peFKNPO/VcFfKshgB+DBRl6/aN362pu+i2PaRYUsD8DDykjcD5+i5o4HPAm9o2icDyWd4YBywiajfHz9KwJfDiWb4ogVYDPwVefFdwH3AB0IKZfhnGqIAG0ILEpKm0AIMgRZgEjABOKKOv3+nhm3A+XXK8DqwE+s1eOVs4GdEjbYsHP8GbgaOSvG+U6GaSTSrjAF+ACzQeBfwGPAi0FNHeQ2ITWAPsLdOmUYBU4D3aPxV4AqkTWEkyJHIyy4j1roliEJkhSmIg6kH6U1cE1ac4UUj8Bvk5f8Z+eZnlYsRN3MPMCewLMOGBUTf2Tx8Y+ch8u7EvIqJ8CTyQGeFFmQQrENkXhZakLxzIvIg/xFakEHyIUTuh0ILknc6kAd5e2hBBskI4DXgIBnvaWXdHdyuYS0ffhbpAZ4HRtJ76Fnm8G0JfAeDs7mfqeEJwCXJi8Nk4BWk/540zRq2Ai+lUH4u2UB4q53v49REnlxK+K4BViCm3EbgaeAP/eRvB94HPIjY3ZOkDfgYYgn8VcJlA1yK+CjGplB2YoRooMwH7tFrLwJWB5ABxBu4DXgUGRySNAcQO8BdwH9i57sR59EmZCh6IZkPHEYaSwsDyZC2O/gwtT8NPcgQ9ZNTuv6ACOUOvlfDe5BpWhCuJkgLV7uuBf4eO9+EuKLnADOQgSlXIZ/HwhGyJki7BujR8uf1kX4E8AVkMkoJaTMUklBKEFoBHHOR++8E3pWSLJknhBL4UoDKoxtpeMa7h1/TtF+kJEsu8K0EaSvAm1r+LqTL6459en4fMFXzjkEMUoeBiSnJkwt8KkHaCuDWH5hecb4Z6RqWkXEOjm/ruStTkic3+FKCtBVgi5Z/fJW00cgs5BLwdj13seb/cUryVCWLzqB7gU8gD2MV4ewEQ+VQjbROxAraAJyh57ZreFyaQlWSRQUAUYIO5AH9EJnIMdxwHs5jNHxFQ6+jnrKqACCGofv1d3utjDmlW0M3EbWkodd3kmUFALHVQzRv30iYrCuAkTKmAAXHFKDgmAIUHFOAgmMKUHBMAQqOKUDBMQUoOKYABccUoOCYAhQcU4CCYwpQcPKyTuBE4PSEy5ykYWsKZUO2FrHqk6wrgBtQeYMeaV1jc0plg6xwllmyrgA7NdxM7wmWSTAWuACZu5/GUi4zkOFdSc9qTpSsK4BbwHEFsDLhst3s4CeRaeJJsxHZeqbUX8aQWCOw4JgCFBxTgIJjClBwTAHC4SaEuF7CWyriXjAFCIczPv1LQzdHsN6l6+vCFCAMsxED1A6i5WPc+olbfAqSdTtAnnErhS8hmvcH8DZk3iPATUSbXczXsL+l8wqFWzmjo7+MdeBrfYBqRwm5N4fbtPKfeF66z2qA9HCTPm8n+s6DrH2wiWgF9PHA9/T3VxBF8IYpQPqsBx7pI20S8EvE27kez4tDgCmAD1qBt8biI5AXPhf4DNL9e5RoMyyvmAKkz/010krAHcAXkb0FvGMKkB6vIoNCnidaDAKkDbAT2QBrNbIXUjBMAdJjF7I/wrnAM2FF6Zs8KsA0ZEm1tiGWM1LDpEYE/QnZhj5X5FEBLkRG2yRFUmMCTweuQ1YAyw15VIAXNVwLfGmIZR2JbO40lL53C2LOPUjOXj7kUwE2angGMk7Qq+GkChcgK3/ncou4PDqDnkYcJlOQ1TVD83kNfxpUijrJowIA3Kjhd5CWdiiWAecjSvmjgHLUTV4VYD3ywNuBh4FTPF+/AbgWuBPp4y+i9tKwRp3U8ga2ILt9lZGHvxKYiThX0qAF2WewA/ibXreLyI1byUb6XizaGCD9uYMbka6Xa8n7PB5DtrTri1woQB57AXGcX30lMrljFuJhm0Dkjk2KTsSE+zjiwXuAjE/6GAh5VwDHXuC7ehiDIK+NQCMhTAEKTtY/AW6O/VzE8JMnvO78MVx5kPC7fw/1OC3xp5IgWa8BtgLnIUafPwaWZbBch/RI9oUWpBZZVwBnXdtA8usDpM0iomVoMkteG4GjY78bEZ++o5Xe9xVPa6L3pkxjiQaGwP9bEeODTlorrttakTeX+xrlUQFuBQ4AN2t8GzIJox15YfsR5wzAUmSy5fc1vhnZr286ogwvEe1HdCky1sANzX4AGdc3U+N7icYiHK/l3KjxdVrOJUO/Pb9k/RNQDbf16ssaP4RMrzqIWOZKRAMz3Ln/xv72MDJVq4Rs77pf097Qct00rgOax03WfJ3elr/XgBf09w6VIdPf+zzSly+gsuZqrJEWilz4ArLysAZLpQ2+VCPNqEEeFWAB8BTwbo2vIZp61YR0HW/V+EeRYWNnaXwF0g5o1OMJZFAJwAc172yNfx2Zv+fybtVrgQxCWUPUx1+uMnnd9bMIuMmSV8TObdBzyzXeifzXNyENtjLwnKat0/gdGnfth/GIZbFM1LBbo/HVGn9B41MR72KZqL0wX+PXavwpjcdHK7sxA8cO9qaNiKXIQ7wpdm4i8FVkG3aAeUif23EL8H793Q7cRtR9mw1cHsu7DDhTf7cB3yDq+p2j6Y7Feg5kEOiFsXKnAldXyL4HaRjmsaGdGWYgCvDb0IIMksmI3Nv7y2jUphmptt8kqkonI6tuOM6jd9V7eSzvccA1sbRZwJxY/DIiJ9ME4Hqi/9iZ9J6xuxg4WX+PBC5CagIQu8Jlsbw3IApwW62bMwbGncjDXKXxbRp3L7KHyGS8RNP+onH3HXbVfjfRkiwLNO0Jjf+O3p+bgxpvRhqRZaK1i6/W+Kc07toWE/TYp9eaVtcdG70Yh1jkysBC4FvIxEv3rd4C/Fp/n4p8e5dqfLnmda7Zh5BZuSBtid3Ifz3AlZr3BI3fF8t7FNKwvEXj04GfaxkgyrkVUZZHVNYV9d2uUY2LEAteN3AVntfRGSDjkCHqZWSqWKWvwBgin0baAmXkP3MOMCqkQMpEpBZxtdTj5GgwSBb/k2pxNnAXcKLGu4Bnkb58dx9/kxatyIt2Dc4e4G7gc4hfwUiJEcDHESPPAcKP+HkG+CZwUpo3nRZ5qwGqcQzi1/dND1LzdAW4tmEYhmEYhmEYhmEYhmEYhmEMlP8BHXz5/0bsmecAAAAASUVORK5CYII=" style="height: 2em;vertical-align: middle;"></span>
</td>
<td class="gt_row gt_left">
French press
</td>
<td style="background-color: aliceblue;" class="gt_row gt_right">
$1.11M
</td>
<td style="background-color: aliceblue;" class="gt_row gt_right">
4%
</td>
<td style="background-color: papayawhip;" class="gt_row gt_right">
$748K
</td>
<td style="background-color: papayawhip;" class="gt_row gt_right">
5%
</td>
<td class="gt_row gt_center">
<div>
<svg viewbox="0 0 700 130" style="height: 2em; margin-left: auto; margin-right: auto; font-size: inherit; overflow: visible; vertical-align: middle; position:relative;">
<defs><pattern id="area_pattern" width="8" height="8" patternunits="userSpaceOnUse"><path class="pattern-line" d="M 0,8 l 8,-8 M -1,1 l 4,-4 M 6,10 l 4,-4" stroke="#FF0000" stroke-width="1.5" stroke-linecap="round" shape-rendering="geometricPrecision"></path></pattern></defs><style> text { font-family: ui-monospace, ‘Cascadia Code’, ‘Source Code Pro’, Menlo, Consolas, ‘DejaVu Sans Mono’, monospace; stroke-width: 0.15em; paint-order: stroke; stroke-linejoin: round; cursor: default; } .vert-line:hover rect { fill: #911EB4; fill-opacity: 40%; stroke: #FFFFFF60; color: red; } .vert-line:hover text { stroke: white; fill: #212427; } .horizontal-line:hover text {stroke: white; fill: #212427; } .ref-line:hover rect { stroke: #FFFFFF60; } .ref-line:hover line { stroke: #FF0000; } .ref-line:hover text { stroke: white; fill: #212427; } .y-axis-line:hover rect { fill: #EDEDED; fill-opacity: 60%; stroke: #FFFFFF60; color: red; } .y-axis-line:hover text { stroke: white; stroke-width: 0.20em; fill: #1A1C1F; } </style><line x1="22.5" y1="115.0" x2="677.5" y2="115.0" stroke="#BFBFBF" stroke-width="4"></line><rect x="30.0" y="42.22556547001452" width="40" height="72.77443452998548" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="84.54545454545455" y="55.23656360240714" width="40" height="59.76343639759286" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="139.0909090909091" y="45.56650757418552" width="40" height="69.43349242581448" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="193.63636363636363" y="36.31147540983606" width="40" height="78.68852459016394" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="248.1818181818182" y="33.96659057895829" width="40" height="81.03340942104171" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="302.72727272727275" y="30.023863872172647" width="40" height="84.97613612782735" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="357.27272727272725" y="28.177007677941475" width="40" height="86.82299232205852" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="411.8181818181818" y="23.113716538700977" width="40" height="91.88628346129903" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="466.3636363636364" y="46.9568375181573" width="40" height="68.0431624818427" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="520.909090909091" y="44.03091927785848" width="40" height="70.96908072214151" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="575.4545454545455" y="46.58331604067234" width="40" height="68.41668395932766" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="630.0" y="15.0" width="40" height="100.0" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><g class="y-axis-line"><rect x="0" y="0" width="65" height="130" stroke="transparent" stroke-width="0" fill="transparent"></rect><text x="0" y="19.0" fill="transparent" stroke="transparent" font-size="25">4.82K</text><text x="0" y="126.0" fill="transparent" stroke="transparent" font-size="25">0</text></g><g class="vert-line"><rect x="40.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="60.0" y="20" fill="transparent" stroke="transparent" font-size="30px">3.51K</text></g><g class="vert-line"><rect x="94.54545454545455" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="114.54545454545455" y="20" fill="transparent" stroke="transparent" font-size="30px">2.88K</text></g><g class="vert-line"><rect x="149.0909090909091" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="169.0909090909091" y="20" fill="transparent" stroke="transparent" font-size="30px">3.35K</text></g><g class="vert-line"><rect x="203.63636363636363" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="223.63636363636363" y="20" fill="transparent" stroke="transparent" font-size="30px">3.79K</text></g><g class="vert-line"><rect x="258.1818181818182" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="278.1818181818182" y="20" fill="transparent" stroke="transparent" font-size="30px">3.90K</text></g><g class="vert-line"><rect x="312.72727272727275" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="332.72727272727275" y="20" fill="transparent" stroke="transparent" font-size="30px">4.10K</text></g><g class="vert-line"><rect x="367.27272727272725" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="387.27272727272725" y="20" fill="transparent" stroke="transparent" font-size="30px">4.18K</text></g><g class="vert-line"><rect x="421.8181818181818" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="441.8181818181818" y="20" fill="transparent" stroke="transparent" font-size="30px">4.43K</text></g><g class="vert-line"><rect x="476.3636363636364" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="496.3636363636364" y="20" fill="transparent" stroke="transparent" font-size="30px">3.28K</text></g><g class="vert-line"><rect x="530.909090909091" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="550.909090909091" y="20" fill="transparent" stroke="transparent" font-size="30px">3.42K</text></g><g class="vert-line"><rect x="585.4545454545455" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="605.4545454545455" y="20" fill="transparent" stroke="transparent" font-size="30px">3.30K</text></g><g class="vert-line"><rect x="640.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="660.0" y="20" fill="transparent" stroke="transparent" font-size="30px">4.82K</text></g>
</svg>
</div>
</td>
</tr>
<tr>
<td class="gt_row gt_left">
<span style="white-space:nowrap;"><img src="https://posit-dev.github.io/great-tables/blog/pycon-2024-great-tables-are-possible/data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAIAAAACACAYAAADDPmHLAAAABmJLR0QA/wD/AP+gvaeTAAAJkUlEQVR4nO2dfawdRRXAf7evLbTWQv2AaqEiWDG2iLVoqEDVFuQjoEYBEfkQ1NRG0IhBogbRICIqWsUoUAhBi98Qq4iRGvEDGkQEtED5UEBFbYvPlkJ5LfV1/ePMZLbb3dnZ3Xd39957fsnLfW/n7O68OWd2zpw9MxcURVEURVEURVEURVEURVEURVEURVEURVEURamFoaYroNTPTOAaYAMQAf8CLgV2b7JSSj3MA9Yjio+A0djva4AXNFc1pdvMA/6LKHsl8EpgPDAfuNcc/05jtVO6Slz51wMTEuX7AVuB/wHPr7dqSrfJU77lTiNzaE31UmogVPkAfzFyc2uol1IDceVHwGc9su80Mk8gfoHS48SVvwrYZn6/MEV2IbDZlJ9dVwWV7pH22D+RdCOIK/9KoFNrTZUxZy4wTPqYfzzwrCn7ArAAeMr8fTUwrtaaKmNOiMN3Au5JYD+XocrveeLKfwyY6JG9COcYqvL7gKS3HwFXkD6eL8KN+ar8PiCu/BuAI3EKThpBXPlXosrveeIO343ALub4YTjn7ipE0QuApxPHlB4m2fOTDl98evcT4Bl0qtc3zAX+w849P0n8SaA9v08IVT6kDwVKD6PKH2CKKD8e4VPl9wGq/AHm1ajyB5ayytcIXx+gyh9gDsQf5IkTD+9ejgZ5ep7JwKOo8geW9yMKvRP/K91FuPBu65XfhiTDKfh7UxOMApsSxw4xn8uQ7J00Dkfi+5OQN35LEENQMjiDHd+Vt+nnI4m63mCOvyfjfzmcHur5ljY8ASwbAuUmIE+NtF6a5LnI/7iZ7F6bZHdEeXEFLgHeZn5/N3AtO/Zs7fklmYRbEHlIjqxlXyP/JP4p2DhgrZE9IPDas4HtyNRtmjm2xBzbjnPsrgNehSzbOg8YMce/SY/0/DZxIdJ4Pypwzp/MOUd5ZA41Mg8XuO4yc87Xzd9x5Z8FHIFL3kj+LEWVX4oX4RY/7hN4zmdwY20WXzIyXwy85guRMXwUmMXOygeYgVumtRF4HLgJODbwHkoGdky9NFB+rpFfS3Z07a9GZn7gNT9l5FcgU75RRPl2Rc504H4jcze6UndMOQBp7E3AboHnPEK2gg8k30Di7AL8Gze+q/Ib4BakgT8cKL/UyF+SUnYB+UNEnNNxY3naY/8hU/ZHnHOojDFvQRr5UcI2SHoj2U6edRLfHHjvu9nRAAam57fJax0HPIA4YE8iivDRwW2elIwh2F5a9DoR8CFkFjADeSrNAu5C5vqhsQqlJBfTXORvIB/7bYoEgovWXUz49K0q70NW5C5nAHt+2wzAsoX6Gn3EfG5ExvyViPLvQXyIvlU+tNcAmmAG8FsGpOdb1AAcbzefA9HzLZqjtiP3ID1/uOmK1EVbnwCLkbhAHexhPlcjCzcHoue3lVU0Nw18gPZ2iK7Rpn/4OCSuvxZ4KxKPj3OZKf886a+OVyG5eq9n5+SPo5C9+P4MnJly7veB/YGTgW+Vq75ShQ4uHJu2H97zkKnhNmSqlsYWc35akshUJJljFNg7pfxUXBjal/CpdAm7G+bfSFfgWab8Z55r+AwA4Lum/OMpZUPAfaZ8cViVlbFiCPfC5b0ZMr835Sd5rpNnAMeY8gczyt9hyv+JpKopNWEzgx8i3Sd5OS4HcLLnOnkGMB73zv+1KeUdnKElM4KVLjEBl7nzrgwZu3fespxr5RkASMZRhDiUaRxtyp9AMoqVLvNBpMFXkx6U6uCWYx2Wc60QA5hjZIY9cr82Mp/MuZ9SkV2RpMoImfalsRDnneflLoQYAEi0L8Ll+Sex2cQbkdmH0iXORRr6D2Qr9xoj8+mA64UawEeN3PUemZuNjG8ff6UCU4B1SCMfkSEzGUkSjRBHMI9QA9gTiSdsJfubuA5CEkSeNvLKGGOTNn/nkTnFyNwaeM1QAwDJ5Y8QHySLHxuZLwfeXwlkGu6LEd/gkbOP4dDATBEDOMnI3u6RmYNEDkdIjx4qJbkEafyfe2RejKwUGiE8H6+IAeyKM8JXeORs9DA0vVzJYToSk98OvM4jdx7S8D8ocO0iBgBuHaDP0ZuF+AvPIgtBlYpcRr4HDvLWLkLeEIZS1AAWGPl/4F+HcLWR07eEFZmJKGkUWVqdxTykwddRbOeQogbQwS30XOiRC623koPtSd/OkbNLvr5S8PpFDQAkvhAh8QYf9slVZAm7EiN0LB2P29ThNQXvUcYA9sPN96d45EJ9FyUD601fkSN3nJG7r8Q9yhgASJwhQuIOPuzs5abiVRtsisynf4g08sdK3KesASw2592cIxcav1ASrCBsTN8Nt0PHXiXuU9YA4vfNM9CQCKYSo0hM/QNI4/6i5L3KGgBIUmiExB98hLzDUGKsRBrrogDZ2wgbi7OoYgDHEu57hLzFVJAEjtD36i8jzBv3UcUA4uli83Jk43kMdS1e6Ul+Q3hmjd31K28+7qOKAYD4KBHw1QDZvEymgcdm4K4nv0d3cBs++SJyeVQ1ALvz2HryI5ATcalqWbmMA0sH2VUjAs4JkJ9qZLdSrTdVNQBwu5a+JEDWZjM/SLtWWDXOQUjDPIM/jTuO9axnVrhvVQOYivghI4RtUjWE++aQRSXv2TjdGL/W4BZXHB94zmrzOacL9QllNvL0up+d1yWmcQyya9gwsqFET9INA9iMW371OcK8+nvNZ5MGYDeUXu2VEiYiW9GCBId6dkl5tzzY5cAdyLYrecEVcPPvJg3A3jskFnA2kqi6BvnSZyWFg3Fj6j4BshHVHqVVfYBfmfN9O5CDbCq9IVB24LkOaajv5chNQYxlC+U96qoGYGcAee8hLjdyPy15n4FiL9z++gtyZO282pek6aOKAUw3527AH96djctr2L/EfVpHt+evjyPO0gVIfv2JHtnHkKHiTYR/vUscq7iXljj/YPP5iDk/i68hbbaU7GXmSoJJyMYPUZ/8DNNHawbriGCNAJ9AZgYgMYKtNdx3LJmAyxU4H/n2UKUAHdyy69BvBWkT5+Ne/mjYtyRzEAdqG+Hf4tUG9kYc2e1oKlhlvoH0pF82XZEC2DzF5XmCSj7TkO1XImRTprZjN6jYhEQ1lTHAZuH+HXhOw3XxMR63RO3chuvSV4xD3hNESCZQWzkHqePDVMsxUFKYjwv9zmq4LmnsieQyRsjOYX1Lk1mt1wKnIYkjbYsLTESGpxVkbyalVGQ6sjS76che1s86/GHhvqDpvPYhJBWrjTyF7FKiKIqiKIqiKIqiKIqiKIqiKIqiKIqiKIqiKL3D/wHOPqgk7KXeKQAAAABJRU5ErkJggg==" style="height: 2em;vertical-align: middle;"></span>
</td>
<td class="gt_row gt_left">
Cezve
</td>
<td style="background-color: aliceblue;" class="gt_row gt_right">
$2.51M
</td>
<td style="background-color: aliceblue;" class="gt_row gt_right">
9%
</td>
<td style="background-color: papayawhip;" class="gt_row gt_right">
$1.97M
</td>
<td style="background-color: papayawhip;" class="gt_row gt_right">
13%
</td>
<td class="gt_row gt_center">
<div>
<svg viewbox="0 0 700 130" style="height: 2em; margin-left: auto; margin-right: auto; font-size: inherit; overflow: visible; vertical-align: middle; position:relative;">
<defs><pattern id="area_pattern" width="8" height="8" patternunits="userSpaceOnUse"><path class="pattern-line" d="M 0,8 l 8,-8 M -1,1 l 4,-4 M 6,10 l 4,-4" stroke="#FF0000" stroke-width="1.5" stroke-linecap="round" shape-rendering="geometricPrecision"></path></pattern></defs><style> text { font-family: ui-monospace, ‘Cascadia Code’, ‘Source Code Pro’, Menlo, Consolas, ‘DejaVu Sans Mono’, monospace; stroke-width: 0.15em; paint-order: stroke; stroke-linejoin: round; cursor: default; } .vert-line:hover rect { fill: #911EB4; fill-opacity: 40%; stroke: #FFFFFF60; color: red; } .vert-line:hover text { stroke: white; fill: #212427; } .horizontal-line:hover text {stroke: white; fill: #212427; } .ref-line:hover rect { stroke: #FFFFFF60; } .ref-line:hover line { stroke: #FF0000; } .ref-line:hover text { stroke: white; fill: #212427; } .y-axis-line:hover rect { fill: #EDEDED; fill-opacity: 60%; stroke: #FFFFFF60; color: red; } .y-axis-line:hover text { stroke: white; stroke-width: 0.20em; fill: #1A1C1F; } </style><line x1="22.5" y1="115.0" x2="677.5" y2="115.0" stroke="#BFBFBF" stroke-width="4"></line><rect x="30.0" y="43.78291398478643" width="40" height="71.21708601521357" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="84.54545454545455" y="47.89057928613224" width="40" height="67.10942071386776" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="139.0909090909091" y="46.02399063779988" width="40" height="68.97600936220012" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="193.63636363636363" y="35.24575775307197" width="40" height="79.75424224692803" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="248.1818181818182" y="24.941486249268582" width="40" height="90.05851375073142" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="302.72727272727275" y="18.265067290813338" width="40" height="96.73493270918667" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="357.27272727272725" y="15.0" width="40" height="100.0" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="411.8181818181818" y="30.547103569338795" width="40" height="84.45289643066121" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="466.3636363636364" y="39.019894675248686" width="40" height="75.98010532475132" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="520.909090909091" y="39.312463428905794" width="40" height="75.6875365710942" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="575.4545454545455" y="47.1357519016969" width="40" height="67.86424809830311" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="630.0" y="21.992393212404913" width="40" height="93.00760678759508" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><g class="y-axis-line"><rect x="0" y="0" width="65" height="130" stroke="transparent" stroke-width="0" fill="transparent"></rect><text x="0" y="19.0" fill="transparent" stroke="transparent" font-size="25">17.1K</text><text x="0" y="126.0" fill="transparent" stroke="transparent" font-size="25">0</text></g><g class="vert-line"><rect x="40.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="60.0" y="20" fill="transparent" stroke="transparent" font-size="30px">12.2K</text></g><g class="vert-line"><rect x="94.54545454545455" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="114.54545454545455" y="20" fill="transparent" stroke="transparent" font-size="30px">11.5K</text></g><g class="vert-line"><rect x="149.0909090909091" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="169.0909090909091" y="20" fill="transparent" stroke="transparent" font-size="30px">11.8K</text></g><g class="vert-line"><rect x="203.63636363636363" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="223.63636363636363" y="20" fill="transparent" stroke="transparent" font-size="30px">13.6K</text></g><g class="vert-line"><rect x="258.1818181818182" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="278.1818181818182" y="20" fill="transparent" stroke="transparent" font-size="30px">15.4K</text></g><g class="vert-line"><rect x="312.72727272727275" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="332.72727272727275" y="20" fill="transparent" stroke="transparent" font-size="30px">16.5K</text></g><g class="vert-line"><rect x="367.27272727272725" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="387.27272727272725" y="20" fill="transparent" stroke="transparent" font-size="30px">17.1K</text></g><g class="vert-line"><rect x="421.8181818181818" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="441.8181818181818" y="20" fill="transparent" stroke="transparent" font-size="30px">14.4K</text></g><g class="vert-line"><rect x="476.3636363636364" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="496.3636363636364" y="20" fill="transparent" stroke="transparent" font-size="30px">13.0K</text></g><g class="vert-line"><rect x="530.909090909091" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="550.909090909091" y="20" fill="transparent" stroke="transparent" font-size="30px">12.9K</text></g><g class="vert-line"><rect x="585.4545454545455" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="605.4545454545455" y="20" fill="transparent" stroke="transparent" font-size="30px">11.6K</text></g><g class="vert-line"><rect x="640.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="660.0" y="20" fill="transparent" stroke="transparent" font-size="30px">15.9K</text></g>
</svg>
</div>
</td>
</tr>
<tr>
<td class="gt_row gt_left">
<span style="white-space:nowrap;"><img src="https://posit-dev.github.io/great-tables/blog/pycon-2024-great-tables-are-possible/data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAIAAAACACAYAAADDPmHLAAAABmJLR0QA/wD/AP+gvaeTAAAKWElEQVR4nO2de4ydRRXAf7stfSFolWopuxStL6oVNWJBCXsbGp5iFEFRUUMCtFrEhmgE4gtRg0qFEKMRSRQhxEgqTVUsDzW0Cg2mVGsbqtTUPpUi2C7dllJ21z9mb/jmzHe7t3e/mTN35v6S+WPumXbPOXfunPPNNw8Ix2xgCbAO2AMMd0pp2QKc3aKPo2QCcAtwEH3ntkvZ3JKnW2C85/9/MnAfUPP8d1Jjcqg/1O3x/+4Cbqfz5bfCo9oKVMGVuEPbDuBi4JWKesXIL7H9tFhXnWrYjm3UQWCuqkZx0g38F9tXb1fVqCK24Y4A/cBCTHjoYDgJ20fP4Dc0B+N9mC+8LMt9CDhBTbO4uArbN/fqqlMtM4EHKe8E/ZhOkjtJxv8iXcACykeDnSQy3LVIsvG/jJnAA7id4CRNpZRRj/8h/9gW4Czgt+LzWkAdYqNP1FcCQyEVCD38DgP3i8+kE3KiJuoPaygRGvVhLxK6gKfJJP4XKTM8xzwgih+Cxi9vGFglPqsp6KFNTdSDx3/QG3plrMsxD5A2ZxH/60Qx/CmSbfyvk3seEM0PQOtXl3seUBN1lfgPusNuznlA1vG/TjTDYGCyj/91cs0Dour4mr+4XPOAmqirxX/QH3JzzAM68b9AVMNhADrxX5BbHhBdh9f+teWWB9REXTX+g34HgLzygE78LyG6YdETnfjfgFzygCg7uroC5JMH1ERdPf5DHB0A8sgDOvH/EEQ5PFZIJ/6PQup5QLQdPAolSD8PqIl6FPEf4ukAkHYe0In/TRDtMDlGOvG/SVLNA6Lu2NEoQrp5QE3Uo4n/sXAWZuOo3DWcevnXiO3Zsxn9L0OrbK7Af2MihhAwSVsBRYKdB9iIGDpAEmfitYi67TF0APlMvAzzRJBikQdAdeYDiPwxqUI68wENyMUxUXZ0dQUwzkjx+V9SE/Uo5gNi6ACQ9nuAOtKmus3zgduAjcDekbIac9byhGDaKRPl8FghZecBXgb8mUPPE6wFjlPQNzipH5goO/gwMFjyWVl5HI8jQSy/siFMTCxSU9DDF7WSz5r1/TuAy6tTpTUlQpByHjCaLSuAM4CjgF7cwzQv8aFUbKSaB5SFt3rZTfmB2b2iXX8QTZVJNQ8oi/DmNtTTmzwb2QHeM6XcjH9wlLNA2oln/UD5wJPlMh6MY+FRdZXrFNUnIt7vUyn2OWzLXu3DdiKvoNjLmuBiS17dxRiCgEdGuPtjqVxvv7jw2AjcDrwcm1FImU6sAt4TFsR33Th5gLnq2pUDefhDut7aPyE04O5bbXYfrV/NfU5Bdvo50hjudhEyi/L3oG5ULuMHlxfeCGmHOACUb8PeF5DkYo5gLFFMgN4hOZuTovpe/LGJuxe/2FddSrlQg6d6a/AvBauTwXLEJB8/JezZfsxzkiFI4F9tP4oeFV4lcNyPbbBy3XV8cIyWvvy/4LHeYBY+Bu20Z/SVccLn8C2cS9mWfhok0A9GsqG5I3YRr9AmtfLT8XYVrT1rcA84HbMe4G9mIz/UTJaEnYttlPkvYIpsQLb1i/rqhMHj2E7ZaGuOl5ZgDvEZ00P5jVw3SGDwLGqGvnlNcCL2J1glqZC2hMMF2K/6PgT8G8lXULwFMbGIh/UUCQWHibca9VYyyNj9uIY8PaasQmmYFbGxPBGUpMhzFPPHo0/rhkCujDz5LlzEDMSqKDZAQaARZi4mCu7MMu9slj1eyi+QfpTwfdj2/htXXXi4h/YzvmYrjpeuBTbxq3o5mDRcDK2YwaAl6lq5IejMW85i7a+R1Uj9OcBAC4W9V9h5sRTox8zFVxE2p4d3cA27F/FB1Q18stHsG19ChivqpEyfdgO2UMa6wAbMQXztq9o83xNhbRDgBwCl5LGOsBG7MN9wsk2DIzHDIHFX8OZqhqF4Xxsm/9HBit+yjgH2xG7cOPhNZjkSXu+vtXSD1wnbDoCdxf0+w/Lc4lwB7YTvi/kb8Z+VdyuZQh4i7Dtx6LN3YfluQSYhDkcoeiE00SbrxPuS/JdvilsO0PIU537aMiHsB2wFTch/TvhviDf5Z/Ys37dmJ1BxTZZJYP3YBv/XSF/l5Dvx8yktQtH4+4DmCva3Crky0IqqMlRuM55p2hzk5DfE1LBiliKbcPNQn6qkB8gzdXQDpdgG75JyLswt2kU28h9g+3ARdg27MRe/NKFe1nGpYF1VOE32EZfL+SnC3k/EVys0AKTcHcFzxNtbhTyB0IqqMFUzFBXNFpukf6BkN8RUsGKuRPblh8JudwT+SJm5XCyXIFtsFwXXzY7eE5IBStGHg7xLO5unw2izaKQCobmD9jGflHIzxbypzEzZ+1K2azfeaLNV4T8jyEVDMmx2JsihoATRJufYjvjh+HU88Zt2DbdKeSzhLzML0mwGNtQuR6+bHawL6SCnpiHm9ROEW3WiDZfCKlgKFZjGykPP7xAyHeQxp6BbtzDry4SbT4v5GtCKhiC1+HuAZwh2vwC2wlLQiromVuwbVsq5L249wc0Oke4LbkO27iHhPxIzDrAYpuTQyrombnYtu3HPRdxlWjz1ZAK+mYdtnGXCfnHhXwT6S2ZfhLbxk8K+SIh3xhUO4+ciG3YC8CrRJtfizY3hFQwEN/CtlFeCjGNl7aJ1UsKx+VzA7ZRck1c2eygXECRAnOwbTwIvFq0kbuHbgypoC9G2/VzuZCvC6pdWNZj2ypPQ5G7h7bQ5qGwmV0/vxdtrg2pYGC+hG2rvCcpyt1DY2EJtjE/F/LpuEemvD6kgoGZhfs4LI+BuxfbH7eGVLBKmtn18zkhz+FUbHlZ5NVCnszuoXdjG7Ibd9ePPChxcUgFlbga22Z5DnDZ7iG5YLYtuAbbiJ8J+Uzc4TCHa1Jn4M76vUG0uVvIvZ0n6HNrWJ+o/07UP4qd4a7EzP+nzk7cV77yZPQHRV36si14ArsXv0nIVwr5FUG102Uhtu2rhHy2kMt1k23BM9hGyOPfnxXy1wbVThe5BmC3kE8V8rY8Q0jO7smVPc8LeRYHI48wGdt2eVraRCEfwtOEkM8cYEDU5WLH/4i63BuQMtJW6Yvpoj6A6QiV47MDbBf1XlGXidDNtOnz7mFyBO4mEZkDSF9t86WMzw6wQdTlSRjysfAUjCNOJc1wMAF4L+asYLnWQfpC+kr6si34NHYcK1vmJM/Pz7HIg6MA/iraXNnAx1FzHO48v+zZx+AulMipPDnigyJyaXxbrxJejm3MGtywcwx5jgQrcL/8cZhLoortyu4cbBvm4I4CjY5IPRO4C7MxVD5CplAOjNh2F43PQvqe+DeDJPB09BNcZyxQ1ShOPoPrJ5kctiXTcLd7DwPfQf+YuhgYh7tuYhizGiiZjaKzKb9AeT3N3Z2bKvOBx3H9so+0lsUDZpevfM9dL2sx6+BPA44n3XmA4zE2fg032auXAcxZgkkyB/dUjE55qWzHnI+UNNMwu4DlooicyyAm4ZPLxJPmbZij4XPuCIOYI3PUNoDEsOa8B3NUah8mWewBXqGqkT92Y1Y9bcAsiFmOxxc9zfB/+9/P5DKPnaUAAAAASUVORK5CYII=" style="height: 2em;vertical-align: middle;"></span>
</td>
<td class="gt_row gt_left">
Chemex
</td>
<td style="background-color: aliceblue;" class="gt_row gt_right">
$3.14M
</td>
<td style="background-color: aliceblue;" class="gt_row gt_right">
11%
</td>
<td style="background-color: papayawhip;" class="gt_row gt_right">
$818K
</td>
<td style="background-color: papayawhip;" class="gt_row gt_right">
6%
</td>
<td class="gt_row gt_center">
<div>
<svg viewbox="0 0 700 130" style="height: 2em; margin-left: auto; margin-right: auto; font-size: inherit; overflow: visible; vertical-align: middle; position:relative;">
<defs><pattern id="area_pattern" width="8" height="8" patternunits="userSpaceOnUse"><path class="pattern-line" d="M 0,8 l 8,-8 M -1,1 l 4,-4 M 6,10 l 4,-4" stroke="#FF0000" stroke-width="1.5" stroke-linecap="round" shape-rendering="geometricPrecision"></path></pattern></defs><style> text { font-family: ui-monospace, ‘Cascadia Code’, ‘Source Code Pro’, Menlo, Consolas, ‘DejaVu Sans Mono’, monospace; stroke-width: 0.15em; paint-order: stroke; stroke-linejoin: round; cursor: default; } .vert-line:hover rect { fill: #911EB4; fill-opacity: 40%; stroke: #FFFFFF60; color: red; } .vert-line:hover text { stroke: white; fill: #212427; } .horizontal-line:hover text {stroke: white; fill: #212427; } .ref-line:hover rect { stroke: #FFFFFF60; } .ref-line:hover line { stroke: #FF0000; } .ref-line:hover text { stroke: white; fill: #212427; } .y-axis-line:hover rect { fill: #EDEDED; fill-opacity: 60%; stroke: #FFFFFF60; color: red; } .y-axis-line:hover text { stroke: white; stroke-width: 0.20em; fill: #1A1C1F; } </style><line x1="22.5" y1="115.0" x2="677.5" y2="115.0" stroke="#BFBFBF" stroke-width="4"></line><rect x="30.0" y="46.606648199445985" width="40" height="68.39335180055402" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="84.54545454545455" y="57.285318559556785" width="40" height="57.714681440443215" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="139.0909090909091" y="42.49307479224377" width="40" height="72.50692520775624" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="193.63636363636363" y="31.89750692520776" width="40" height="83.10249307479224" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="248.1818181818182" y="26.939058171745152" width="40" height="88.06094182825484" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="302.72727272727275" y="21.26038781163435" width="40" height="93.73961218836565" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="357.27272727272725" y="16.495844875346265" width="40" height="98.50415512465374" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="411.8181818181818" y="28.44875346260388" width="40" height="86.55124653739612" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="466.3636363636364" y="37.36842105263158" width="40" height="77.63157894736841" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="520.909090909091" y="30.844875346260388" width="40" height="84.15512465373962" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="575.4545454545455" y="46.02493074792244" width="40" height="68.97506925207756" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="630.0" y="15.0" width="40" height="100.0" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><g class="y-axis-line"><rect x="0" y="0" width="65" height="130" stroke="transparent" stroke-width="0" fill="transparent"></rect><text x="0" y="19.0" fill="transparent" stroke="transparent" font-size="25">7.22K</text><text x="0" y="126.0" fill="transparent" stroke="transparent" font-size="25">0</text></g><g class="vert-line"><rect x="40.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="60.0" y="20" fill="transparent" stroke="transparent" font-size="30px">4.94K</text></g><g class="vert-line"><rect x="94.54545454545455" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="114.54545454545455" y="20" fill="transparent" stroke="transparent" font-size="30px">4.17K</text></g><g class="vert-line"><rect x="149.0909090909091" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="169.0909090909091" y="20" fill="transparent" stroke="transparent" font-size="30px">5.24K</text></g><g class="vert-line"><rect x="203.63636363636363" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="223.63636363636363" y="20" fill="transparent" stroke="transparent" font-size="30px">6.00K</text></g><g class="vert-line"><rect x="258.1818181818182" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="278.1818181818182" y="20" fill="transparent" stroke="transparent" font-size="30px">6.36K</text></g><g class="vert-line"><rect x="312.72727272727275" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="332.72727272727275" y="20" fill="transparent" stroke="transparent" font-size="30px">6.77K</text></g><g class="vert-line"><rect x="367.27272727272725" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="387.27272727272725" y="20" fill="transparent" stroke="transparent" font-size="30px">7.11K</text></g><g class="vert-line"><rect x="421.8181818181818" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="441.8181818181818" y="20" fill="transparent" stroke="transparent" font-size="30px">6.25K</text></g><g class="vert-line"><rect x="476.3636363636364" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="496.3636363636364" y="20" fill="transparent" stroke="transparent" font-size="30px">5.60K</text></g><g class="vert-line"><rect x="530.909090909091" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="550.909090909091" y="20" fill="transparent" stroke="transparent" font-size="30px">6.08K</text></g><g class="vert-line"><rect x="585.4545454545455" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="605.4545454545455" y="20" fill="transparent" stroke="transparent" font-size="30px">4.98K</text></g><g class="vert-line"><rect x="640.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="660.0" y="20" fill="transparent" stroke="transparent" font-size="30px">7.22K</text></g>
</svg>
</div>
</td>
</tr>
<tr>
<td class="gt_row gt_left">
<span style="white-space:nowrap;"><img src="https://posit-dev.github.io/great-tables/blog/pycon-2024-great-tables-are-possible/data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAIAAAACACAYAAADDPmHLAAAABmJLR0QA/wD/AP+gvaeTAAAOuElEQVR4nO2de7QVVRnAf/deLg95KWACKYKIoaKCaCBgrpQQtaxUUrMQH1mmRmWKPSwsM0pXhWlJaj5qLQuzl5UPygeRpWmmPEQKxNR8QXgTBa/A9Mc3n98+c+45zMx5zNxz92+tuxbMOWef78zes+d7D3g8Ho/H4/F4PB6Px+PxeDwej8fj8Xg8Ho+nAWnJWoAMOBP4CTAcWA1syFQaT12ZA2wDgvBvK7AImEHXvBi6DE3AFdikXwzcCGzCFsO/gPOBAdmI6KkVLcC1yCS/AZzovLYjMBtYgy2EzcBCYFJ9xfTUgu7ArcjEvgYcVeJ9zcBUZOK3YIvhYeAsoFfNJfVUnd7AXchEbgAmx/zcSGAesA5bCC+Gx4ZXXUpPTdgJeACZvBeAsSnG6AnMBB6lWGl8H6JXeHLIEOBxZMKeAkZVYczxwALgdWwxrEKsCq805ogRiDYfAMuBXas8/tuQSV+LLYRNwM3AAVX+Lk9CxgDPIZPyEDCoht+lSuPtFPoVHkZuG601/G5PB0wA1iOTcA/Qt47fPQpREP+LLYTnw2PD6ihHl+UYxMQLgF8hylsW9EFMxsewhbAF2SWm4pXGmnAy0I6c7JuAbtmK8xbjEb1AZQuAlYj+sGOGcjUUZyNmWQDMJ59X2GBk0v+NLYT/IRbFmAzl6vTMQU7mtvDfeacF8R0solBpXIIEovKyc+UeN6izBfhYtuKkYjSyY72KLYT/IEpjtc3WhqIFuB4L6nwoW3Eqph+iNC7DFsIbSDxiaoZy5ZIewG3ISdoIHJmtOFVnCjLxb2KL4e/IAumdoVy5oA9y7wwQW7uRw7RDgblI8EkXwiuI0rhPdmJlxwDgr5hzZf9sxakb3RHlUBd+NHupSyiNQ4GlyI9fA+yZrTiZcSCyA6izKwCeRXaKWrq7M2U08DTyY5cBb89WnFzQH9EJVlCcvRQ316FTMB54CfmBDwIDsxUnd2wve2mH7ESrnMOANuQH/QFRAD2l2QPxH7yMLYQNiJ9hRIZypeJYLEv3FkQR8sSjF3A6sgu4gahfIzpE7pmJ2cDfR7Y5TzomAj/GAlF/y1ac7XMOFtSZl7EsjcI07IL6bcaylMUN6lyQsSyNwmhED9BbweXZitMxzcBViIBvArMylaZxGITUOwbO3xmZStQB3YAbsODHCdmK0zC0IulwAfAI5i/Ileu8B/ALLKgzLVtxGooFyHl9DtgNCzfnxo/SH1iMBXUOyVachkJ1qdeBg5FkVC2KyQW7IOFNTX7YL1txGoqjEZt/G1b4Og051/dmJZTL7sCTiECrkdo7T3UYi231bmrc7PDYD7IQymVvLCFyKRLh81SHwdi5vSny2jXh8U9tb5BaxpUPBu5AlJDFiKu3rYbf16g0A6ciZWkuMxBlbwkSBFJaMc1/Zc2lK8ERSPpzgBRG+Pr69FxOoV3v/q0Gdo68/4eYNVDPCqm3+CASpw6QZky+Ti49Z2P+km8jrnLtZvIKxWlin6bQGqg7B2Ix6sX4xkuVcDTiJd2G3AIATgr/vwWYHnn/UZg1kFnG9CjE9tQtainwEbpIDlsVGYdp93PDYxOw/gRR5W5fLI/iK/URsTQ9kPDuP7GFsBYxTTp1tkqdGIpp97cgxTBDkTzAALgu8v6B2Lm+lRyVyLUiC8EtfHgJWdE7ZSdWrukL/AM5V/cjF1Mf59h9FCbKRP3/ubzAPk+x9tqGKDSDM5Qrb3QD7kTOzwrkImlGSt4D4AmKK4t/FL72DDn1sahHagtwClIB43bVeAMpo94rKwFzxNXIOXkZS4FXE3A9xb2OLiBjjX97nIlM9DaKizjHIhOvFsNWZGEcVE8Bc8RF2GRqkGxWeKwdODzyflfjP5EcchoyqduAT5R530gkg9Vt2boEKaXuKsxAztVW4Ljw2BTMl/LxyPv3QXwAAfDFOsmYiJnY5J8T8zODEeVQf5i7EHKj1daAd2IVP58Jj43A6iKi6VyDsC5oC8nhuTkBS0ZM07hhILIQ3C6djyOLqtF8CXtgRaALwmP9sHK431PoSOuOWAGa6Zs7jf84bPK/UOFYvREF0m2t8lR4rBHiCgOxEPnvkMXdgmTwBkiPw/6Rz2jD6+fIYancdOye9eUqjtsdufrdergX6dy+hO4U2u5a/aRJsi9Q3F5OTelXyWFDymmYEndFjb6jGdEHtFQ8QKKN88mp/VuCJqRoQyt8tSXMueGxTRSnymnGz1bg/fURMz5TqWzyuwHHkyxLaBp2BanpdBWdo5P3N7BInnYJOxIL+pwceX+pjJ9cMBkT7soUn29GwsWuH2B8gs+Po2NfQpIx6skZmF3/nvCYW8RxSeT9g7ES+WjGT+ZMwib/GpKbI02YUrMR8QhqhdBvSJYxvA/y+BethdMx8pQPr1d5gBRxQmERx88oPIc9gb9g5nCPukkag3FYX9wbSVfIqS7O15CS8MFIbGAj6f0AwxCdwO2kkQdfwr7YVf618Fi5IE4TtjOupTgVLFMOwJoyLySdbX4ZFgeIPsJlEKLh63cESCRsJvGTSzoa4zGy8SUMwbZx9yp3iziivQEvxpTcXPVE2g9rRHAb6U6m/rh2yrt7+yA2v8bAA8QDNpv4zaB1jGecMdZQP19CH6wWYjG2jV9I6SDOcZhb+Ng6yBibvZAuXQHwS9Ll+bmRwZNifkb9AOo0CUI55hDfE6ZjrHTGUF9CrRo3tyDNGXThauKma9J9IPKZcdgt8PwayZWKUdiDGO4inUJyOhYZTFOtqn6AR7BJfJlkDiEd4yFnjDZEbxiSQqZyfC8cfx0Wxi1n0g3BvJ43VFmWivkzIthm4N0pPr8n1gDiXipLVW5CnCGuQ6gNsa93STDGdMyvrsrolUgVU6V8juLQbrkJ7oUtyvvJWWucFszFq3+LgHclGKM3hQ0P1yNhzH4VynZ4ZNw0DqFJiMmoCSrtiM2dtivn8dg9XMveeyHdzlQXcCe4CVEOA8QkzF3fv5GYtnoplnkaIFfQEQnGOgzZAdyF8CUqXwgHIyXnusu0Iw6iJJM4BnHRqq2+FdF1JiQYYyKWtavdTpqAn1J6gudinsFctoI9Brv3g2zfcyg0sR4gma09GfHYuT79eVSukI1EzCvXIXQ7MjFx2Z10voQRWDr8tc7xS7DfGH1AxAlYjv97E8hYVz5Lx65eNbHUMlB7fQaVL4RKo3zlJjEuOyNXp/sgqFL+iAGYhXEHZh7PoPQEH+jINzuBXHVHHRalMns0bq9WQoAlcMR13EyiNguho0l8NKFsfSn2R6zG/BGtwB/D40uxGP54bILPjYw5FPNNXJ/4V9WZ+xBBt/cAgx2QujR3ISxF7P24ruIpFCp1G6iOrd4fSVBxW7AvAz5KfGdWTyS30W3A9Cx2fp7BkjSGYTvj1ZFxemOm7D10grpJ/SFxgzM9kd1C3Z8Bks+epDxsMnC38/lXqE4CyA7AeRQ+9XMN8EniT0Q34MMUPhquDXPZukUcd1P4m5uAn4evraKTPHJWbdd25HawW8zPdUdSwbWSNUDKl04j/smehD39WxfCJVS+EFqRlOsnnLGTZjE1IQryzcCh4bFmzPvXURHHpdjONjqF3JkwDLlPqXm0GVEI41b06MlehZ3sp5BU57gOj0Owihm94r5K5VeQuqbbSebXKIVGONdR/GyDUxCF8E0sF6BTMRzZATT5YnP4/7gLoRnRit3cvhcQkzJuYGYihVVFryLKYpqFcCxWWHFqis9HmYUtpmgRx0GYQhg3TT637I1se+p02Ugyjb0jn/6LJAvujEVC0e5CmE98V/AEbEIuivmZcpQr4ihX1dupGUPhJKjpFk1lLkUTxYEZDe7EHeMAki+EvTEn1oIy74uLW8Txrchr5RTChmEChTb8OpJdzSAmphvcWUcy86/UQojenoYg+kcQylzphPTDSt+jRRxuVe9KOm8Ke2wmYQ6RALkq5pDsSd5TImPorhL3Hh9dCBuxhdAXS854kMqfxdeCFHSoTyEaz5iHxTu6VOXzNAqv5qcRczCJw+NwCoNGbcDXiR8pO4hiZVHLrZ5MME45tJT7eYqLOE6ltELYZZhK4eNL1iK97JJsu9FYgV7RcQtB9qdwR3iJ4hr7NJwXjreJ4kDTJEwhPLsK39WpaUJMv+XYJK5AOlglySSeiG23AaLBf4f4C2E8YqPvm+A7S+EWcUTT2oZj7ub5VfiuhkF9AG5e3zKSRQ6h+IrW7iL16j3sFnHMjbzWF3MP30WDavyVogtB69sD5KTNSDjOGAorgjQBpBrbeynKdeLangvYE6EV0QfcEOsDJMsuAsmguRlzU+tCeEfVJBXcIo6HKTZxr8A0/q76eNtUdEcWgptUsgRJHUvCCMSp46ZzLUScPtXA7b0brcufhS2+NAmzHsQmj6aZLSJ5w6jhFPYb0mLRSh6cGH0Sh0s5F7AnBX2QE+4+8mwRUjCRBK0R1ARNzQ1M2kqtXBHHcMwFXKueCF2WAYiWrRnIuqUnvbfvgnjk3NzARcTL9HWLOC6MvNYXcyzdgW+IXTMGIROoV7IuhKSKluYGuintSyjtpXOfxHFj5LUWzDm1gviBK08F7Ips6Xq/VW0/6dOxtWrYvcVEs4V7YXX5f6K4DO67WMDKP/uozoxAyqpU29+EeATj5gEoA5CMInchLEYydcpV6ZyFJcNMSfULPFVBzT51BL1GsoQQpaMiFw0+RYs4DsW6mETb3noyYgxSEqau4TaSJZQofZESNV0A0aYVo7BF8s304npqxX4UxgjWIwshSc3hkeFnl0aOl0v68OQMTRp1U8ziJp1eF37GTQ93kz6WU3kRq6dOTKawj6AmnZbKTmrFehO77uNynTs9nYDpSFNlNynldIpDtdPD1x8P/z8Qm/yOOnd6OhHaUcQt5VqFFGpoUsr14fHLkDRxbVm/BSkD8zQAzciTNdxysOXhMdXw3YdW3EkOmzJ7KkeTUtxSNfdvKVLz52lw9JF2Wu79NOLpS9P11NOJ6YEUhuaqM5fH4/F4PB6Px+PxeDwej8fj8Xg8Ho/H4/F4PBXyf21CFONw9GNVAAAAAElFTkSuQmCC" style="height: 2em;vertical-align: middle;"></span>
</td>
<td class="gt_row gt_left">
Scale
</td>
<td style="background-color: aliceblue;" class="gt_row gt_right">
$3.80M
</td>
<td style="background-color: aliceblue;" class="gt_row gt_right">
13%
</td>
<td style="background-color: papayawhip;" class="gt_row gt_right">
$2.91M
</td>
<td style="background-color: papayawhip;" class="gt_row gt_right">
20%
</td>
<td class="gt_row gt_center">
<div>
<svg viewbox="0 0 700 130" style="height: 2em; margin-left: auto; margin-right: auto; font-size: inherit; overflow: visible; vertical-align: middle; position:relative;">
<defs><pattern id="area_pattern" width="8" height="8" patternunits="userSpaceOnUse"><path class="pattern-line" d="M 0,8 l 8,-8 M -1,1 l 4,-4 M 6,10 l 4,-4" stroke="#FF0000" stroke-width="1.5" stroke-linecap="round" shape-rendering="geometricPrecision"></path></pattern></defs><style> text { font-family: ui-monospace, ‘Cascadia Code’, ‘Source Code Pro’, Menlo, Consolas, ‘DejaVu Sans Mono’, monospace; stroke-width: 0.15em; paint-order: stroke; stroke-linejoin: round; cursor: default; } .vert-line:hover rect { fill: #911EB4; fill-opacity: 40%; stroke: #FFFFFF60; color: red; } .vert-line:hover text { stroke: white; fill: #212427; } .horizontal-line:hover text {stroke: white; fill: #212427; } .ref-line:hover rect { stroke: #FFFFFF60; } .ref-line:hover line { stroke: #FF0000; } .ref-line:hover text { stroke: white; fill: #212427; } .y-axis-line:hover rect { fill: #EDEDED; fill-opacity: 60%; stroke: #FFFFFF60; color: red; } .y-axis-line:hover text { stroke: white; stroke-width: 0.20em; fill: #1A1C1F; } </style><line x1="22.5" y1="115.0" x2="677.5" y2="115.0" stroke="#BFBFBF" stroke-width="4"></line><rect x="30.0" y="66.50943396226415" width="40" height="48.490566037735846" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="84.54545454545455" y="65.75471698113208" width="40" height="49.24528301886792" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="139.0909090909091" y="62.13836477987421" width="40" height="52.86163522012579" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="193.63636363636363" y="51.22641509433963" width="40" height="63.77358490566037" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="248.1818181818182" y="38.742138364779876" width="40" height="76.25786163522012" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="302.72727272727275" y="34.84276729559748" width="40" height="80.15723270440252" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="357.27272727272725" y="34.21383647798742" width="40" height="80.78616352201257" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="411.8181818181818" y="44.81132075471699" width="40" height="70.18867924528301" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="466.3636363636364" y="50.9748427672956" width="40" height="64.0251572327044" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="520.909090909091" y="49.30817610062893" width="40" height="65.69182389937107" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="575.4545454545455" y="61.76100628930817" width="40" height="53.23899371069183" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="630.0" y="15.0" width="40" height="100.0" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><g class="y-axis-line"><rect x="0" y="0" width="65" height="130" stroke="transparent" stroke-width="0" fill="transparent"></rect><text x="0" y="19.0" fill="transparent" stroke="transparent" font-size="25">3.18K</text><text x="0" y="126.0" fill="transparent" stroke="transparent" font-size="25">0</text></g><g class="vert-line"><rect x="40.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="60.0" y="20" fill="transparent" stroke="transparent" font-size="30px">1.54K</text></g><g class="vert-line"><rect x="94.54545454545455" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="114.54545454545455" y="20" fill="transparent" stroke="transparent" font-size="30px">1.57K</text></g><g class="vert-line"><rect x="149.0909090909091" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="169.0909090909091" y="20" fill="transparent" stroke="transparent" font-size="30px">1.68K</text></g><g class="vert-line"><rect x="203.63636363636363" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="223.63636363636363" y="20" fill="transparent" stroke="transparent" font-size="30px">2.03K</text></g><g class="vert-line"><rect x="258.1818181818182" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="278.1818181818182" y="20" fill="transparent" stroke="transparent" font-size="30px">2.42K</text></g><g class="vert-line"><rect x="312.72727272727275" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="332.72727272727275" y="20" fill="transparent" stroke="transparent" font-size="30px">2.55K</text></g><g class="vert-line"><rect x="367.27272727272725" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="387.27272727272725" y="20" fill="transparent" stroke="transparent" font-size="30px">2.57K</text></g><g class="vert-line"><rect x="421.8181818181818" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="441.8181818181818" y="20" fill="transparent" stroke="transparent" font-size="30px">2.23K</text></g><g class="vert-line"><rect x="476.3636363636364" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="496.3636363636364" y="20" fill="transparent" stroke="transparent" font-size="30px">2.04K</text></g><g class="vert-line"><rect x="530.909090909091" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="550.909090909091" y="20" fill="transparent" stroke="transparent" font-size="30px">2.09K</text></g><g class="vert-line"><rect x="585.4545454545455" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="605.4545454545455" y="20" fill="transparent" stroke="transparent" font-size="30px">1.69K</text></g><g class="vert-line"><rect x="640.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="660.0" y="20" fill="transparent" stroke="transparent" font-size="30px">3.18K</text></g>
</svg>
</div>
</td>
</tr>
<tr>
<td class="gt_row gt_left">
<span style="white-space:nowrap;"><img src="https://posit-dev.github.io/great-tables/blog/pycon-2024-great-tables-are-possible/data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAIAAAACACAYAAADDPmHLAAAABmJLR0QA/wD/AP+gvaeTAAAKL0lEQVR4nO2da5AdRRWAv70hmxjWxMASicLmgUKxkUhZiloVMSIYXmJZEksoE0p8IBV5lJal+DaCUD4gYjSFBfggGN4UKIgl+IIUCmIQ0BCCUASswAZDwmaTLCF7/XFYc3fmzL1z585M98ycr6p/bN+emdM9Z3u6T58+DYZhGIZhGIZhGIZhGIZhGIZhGIZhlJMu1wLkSC8w2cFzR4DngB0Onl15DgQuAZ4B6g7Ty8D9wBnA+ExrbPyfRcAgbl+8ltYAszKstwF8Avcvull6GnhdZrWvOAcj31vXL7lV+m1WDdAOZRwErgI+ouTXgQ3A7nzF4TXAPhG/HQncnaMspWMC8AHgR8CfgXXALsL/bdcD+zuSsQs4HtiqyLUJ6Qm+C5wMTHQkY+GYDVwJbKF1V/ssoiiuOYPWsm4GfgjMdCOi/7wauAjYSfxv7V1OJA1zKPFlHgK+gE0Zx9AHPET7g63/4EdDnkr7st+LGLAqz1uAjSQfcf8MN1bAUY4gufxrgRlZCVaEWcDrESva9IjfB4GbgduA9cBngNOVcsNIY+Y9C5iKjFk0Tgf+CxwFLH6lrMajiBINpi6d50wE/oL+nzEMfAcZFzQyC/mG5jWfT5ruA2oNcr8K+BLRNoxV7TZeGfgKemMMAO9oct0iZBHG9UuOSs8jBiuNOYi9Qrvuw01bq2Tsiz7N2wwcEuP6jwLblOtdp38Dh7WQvQ8xFwev/RcwLkbdS8GFhBtgBDihjXv0AcuRHsP1i18PfBGYFFP2eehGrVPbqH9LfB4EPknYIHIT8KEE9+pClob361CmJOxGjFHPJrh2BfDpQN6vgfd3KpTvzEX/L5rrUigHHIj4EjS2wRAVMBl/nvDLf9SpRO64m3BbvDetm9daF3FCv5J3Z+5S+IFmyu5L6+a+KsBrlbyncpfCD7R6RxnF2mavtG6UMtpI+fmcZXgDstQ8C7HQDSDuXLch1ru82KTkpTaY9VUBtNnJSE7PnoOszx8X8ftLwGXANxCbRNZo9U6t5/b1E+CKhYiJNurlA3QDZyHrE2/KQ6gsMQXYwwLE3h7XUDMb+B0yVSsspgDCfsA1tG9m3R9Zai4spgDCeYjzZpD7gSXIusIKxCgT5CjgfdmJVk3+RNj4cVpGzxqHbN0KPm854R7hCPSl5p9nJBuIQ2nweT9I6+bWA4h5eVogbz3wOcLOI/cB31Tu8Z4M5MoFUwA4QMm7HXE40bhRyZtOQZdpTQF0X8EtTcprv+1F/NmDV5gCVBxTgIrjqym4E3oQN+ppxPsuz1HyZgNHR5QPOqGOMp94QSB2Ii7iT6FPKw3anwZ2IQ6Td6K7UfmYNgO/oLV/oE0DW3AAsBq4FnGUKEqvNhXxXn4QWIYjuYuuAIcgc/N3uhakA2rAOYivX7eLhxeVKcCtpOgc4ZgFwKV5P7Qo3aXGeeibK+rAP0nmhZsHExHro2Z/+BRiVr43V4k8pNUgcDKwXSlzD9E7bnxiArINLOjxW0c8jhrJdBBY1B7gOGQvXSOPv5JfhA2Uw8C3kdnL+YHfjkY+b1vzEKSoY4C3KXnfpxgvv5GLke1rjXQDb85LgE56gJnAucQLd7YDuAXZ2ZMG2sDvgZTunSc7gEcIb3TNLYRcUgXoQebe7Qi6GFgKfD3hMxsJdv8gFrYiolkPtfplQtJPwDySaenXEIdKwxOSKkAnU6xlpLzD1UhO0k/Ag8CvSLZLtYY4Um4G7kj4fI1+HFjSUiBqcSkXOhkELkFWwIIV2AacyR6PmnnA2YEy44EbgGNIz+hxTUr38YHjgZXIwlamdDINfBr4spLfAxyEROe8HrFzr1DK7Y3Yv7Xl2GbsTbwIIUXmZOBqCmCnqaEHcdrJ2B2+NWS1TlsWfYZwIIgoS+A45NPjeik3r3QFGVsC0+AwZL9cUMjVjO1hupGdNFpF1zHWMzdKAS6LuL7M6fdKXmoKkFaImAsQ23aQJcCPG/7uQSqkWfIeQDZZvIgowJGB3/+OBIwM8gLwRJvy+ko/8WwAlyKfVm+YgESwCmrqVsJ753ojytaBPyCrZVoPoKUtwOHZVSt3TiSeR5NXn4BR5qPH5rtFKRsVBq2O+N3fE/FbY9oOvCuryjjkTAqqAACXowu8UCnbjwR90MrHCfL48Qzr4ZplFFQBpiDRuYMCb0SPgzsa/7bdgdEvs6yEB4wH/koBFQDEO1cT+vKI8seizyKi0pOILaDsHEz0P4fXCgD6XH2E6E2UpyAbMeMowLFZCu4Z51JQBehDpnNBwR8jeppzllI+mMpk7o3DeMS/MdgO17kUKi5no7/EC5tcszTimjqythAVd7/MHIPeFt57Q0eZiXfRfO6+QrmmjgOXaY/4I+H2+JZLgeISZSZeQ/RCx0lK+d1U+yStEwi3yQAFiRl8Afp/9Gcjyl+tlA26SleNLsR3MNgui10KFZcoM/EQsmzcyCT0qc9JeQnrMecQbpebnUrUBvPRrXvB83MXKmUGKGj4lZSZTngjySB+HIoZiyvQPwWLWpT5ab5ies1dhNtngVOJ2mAq+tl5m9gT/Pgx5fckJ4SUFW1qXajZUZSZeCUSdVOb7zp1mvSMwwm30d+cSpSAKJcurftf40hGX6khDjCNbbSNgm3xizITaynLCJxF5Q7C7TQz6c1caM4G5EDIODyUpSAFZZ2Spx2xEwtXXcdyZL27FQ9nLUgBWa/kJXaTd6UAI8Anab3xoarnBDXjcSVvStKbuRw8PIwczdKMF/IQpGBo5xUlDlPrevS4lObnATaL2VtVggEloAMPKdcKMIwcjVpXfhtCVhKNsWhRUAqrACB7AK5U8u3l6wTPMIAOdkX7oAAgs4IgZgHU6VXyXkx6M18UQDt/r7Ax+DNGOzQy8VjJFwWIqkDi6U2J0RQgcUg5XxRgEP3bpp3kVXW02EyF/wSMOn4EeWPeghQALaDGhqQ380UBQDf7zs1dCv/Rzhd4JOnNfFKAfyh5rQ5TqBpdwKGBvO10YDL3XQHenrsUftNPeHq8lg5OVvdJATTPlhnoUUGqygeVvFI5zawl7OzwPacS+UMN3b3+RJdCpc35hCu4DfEXrDqnEG6bLRTILTwO/ejbxLW1girRg/gBBNvlJy6FyoqV6P6Bp7kUyjFXoXtMz3IpVFYchL6hdIgCbYJIiS7gIvR/iEscypU5X0Wv9DBjdxKVmYlIF6+1wxPoMZdKQw34DdHu4jehH/teFt6NPiOqIwdMVGJqvC/RASXryGfiKiTuUBlGwr3ISH810XV+mZR7wLRCxWZFL9ITvLVFuR2IQeQ59sQeLALdSB1nIIs8zQxzu5CXf20OcnnFZOSE0Dg7icqaBqhWdDSVhURHFi1zug7dCaSSTEOCI23C/YvJMo0AtyPR0w2FScDHgFXIAVauX1ga6SUkSPZS2j9FJTG+DwLj0IXED5yOdJVF6i63I73ZRmRur236MAzDMAzDMAzDMAzDMAzDMAzDMAzDSMD/ABNNgbNpdME5AAAAAElFTkSuQmCC" style="height: 2em;vertical-align: middle;"></span>
</td>
<td class="gt_row gt_left">
Kettle
</td>
<td style="background-color: aliceblue;" class="gt_row gt_right">
$756K
</td>
<td style="background-color: aliceblue;" class="gt_row gt_right">
3%
</td>
<td style="background-color: papayawhip;" class="gt_row gt_right">
$618K
</td>
<td style="background-color: papayawhip;" class="gt_row gt_right">
4%
</td>
<td class="gt_row gt_center">
<div>
<svg viewbox="0 0 700 130" style="height: 2em; margin-left: auto; margin-right: auto; font-size: inherit; overflow: visible; vertical-align: middle; position:relative;">
<defs><pattern id="area_pattern" width="8" height="8" patternunits="userSpaceOnUse"><path class="pattern-line" d="M 0,8 l 8,-8 M -1,1 l 4,-4 M 6,10 l 4,-4" stroke="#FF0000" stroke-width="1.5" stroke-linecap="round" shape-rendering="geometricPrecision"></path></pattern></defs><style> text { font-family: ui-monospace, ‘Cascadia Code’, ‘Source Code Pro’, Menlo, Consolas, ‘DejaVu Sans Mono’, monospace; stroke-width: 0.15em; paint-order: stroke; stroke-linejoin: round; cursor: default; } .vert-line:hover rect { fill: #911EB4; fill-opacity: 40%; stroke: #FFFFFF60; color: red; } .vert-line:hover text { stroke: white; fill: #212427; } .horizontal-line:hover text {stroke: white; fill: #212427; } .ref-line:hover rect { stroke: #FFFFFF60; } .ref-line:hover line { stroke: #FF0000; } .ref-line:hover text { stroke: white; fill: #212427; } .y-axis-line:hover rect { fill: #EDEDED; fill-opacity: 60%; stroke: #FFFFFF60; color: red; } .y-axis-line:hover text { stroke: white; stroke-width: 0.20em; fill: #1A1C1F; } </style><line x1="22.5" y1="115.0" x2="677.5" y2="115.0" stroke="#BFBFBF" stroke-width="4"></line><rect x="30.0" y="40.50686723348594" width="40" height="74.49313276651407" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="84.54545454545455" y="48.09352517985612" width="40" height="66.90647482014387" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="139.0909090909091" y="43.90778286461739" width="40" height="71.09221713538261" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="193.63636363636363" y="41.03008502289078" width="40" height="73.96991497710923" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="248.1818181818182" y="22.521255722694576" width="40" height="92.47874427730542" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="302.72727272727275" y="18.33551340745586" width="40" height="96.66448659254414" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="357.27272727272725" y="19.77436232831916" width="40" height="95.22563767168084" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="411.8181818181818" y="29.71550032701112" width="40" height="85.28449967298889" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="466.3636363636364" y="40.44146500981034" width="40" height="74.55853499018966" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="520.909090909091" y="34.359058207979075" width="40" height="80.64094179202093" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="575.4545454545455" y="36.97514715500327" width="40" height="78.02485284499673" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="630.0" y="15.0" width="40" height="100.0" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><g class="y-axis-line"><rect x="0" y="0" width="65" height="130" stroke="transparent" stroke-width="0" fill="transparent"></rect><text x="0" y="19.0" fill="transparent" stroke="transparent" font-size="25">1.53K</text><text x="0" y="126.0" fill="transparent" stroke="transparent" font-size="25">0</text></g><g class="vert-line"><rect x="40.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="60.0" y="20" fill="transparent" stroke="transparent" font-size="30px">1.14K</text></g><g class="vert-line"><rect x="94.54545454545455" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="114.54545454545455" y="20" fill="transparent" stroke="transparent" font-size="30px">1.02K</text></g><g class="vert-line"><rect x="149.0909090909091" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="169.0909090909091" y="20" fill="transparent" stroke="transparent" font-size="30px">1.09K</text></g><g class="vert-line"><rect x="203.63636363636363" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="223.63636363636363" y="20" fill="transparent" stroke="transparent" font-size="30px">1.13K</text></g><g class="vert-line"><rect x="258.1818181818182" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="278.1818181818182" y="20" fill="transparent" stroke="transparent" font-size="30px">1.41K</text></g><g class="vert-line"><rect x="312.72727272727275" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="332.72727272727275" y="20" fill="transparent" stroke="transparent" font-size="30px">1.48K</text></g><g class="vert-line"><rect x="367.27272727272725" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="387.27272727272725" y="20" fill="transparent" stroke="transparent" font-size="30px">1.46K</text></g><g class="vert-line"><rect x="421.8181818181818" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="441.8181818181818" y="20" fill="transparent" stroke="transparent" font-size="30px">1.30K</text></g><g class="vert-line"><rect x="476.3636363636364" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="496.3636363636364" y="20" fill="transparent" stroke="transparent" font-size="30px">1.14K</text></g><g class="vert-line"><rect x="530.909090909091" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="550.909090909091" y="20" fill="transparent" stroke="transparent" font-size="30px">1.23K</text></g><g class="vert-line"><rect x="585.4545454545455" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="605.4545454545455" y="20" fill="transparent" stroke="transparent" font-size="30px">1.19K</text></g><g class="vert-line"><rect x="640.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="660.0" y="20" fill="transparent" stroke="transparent" font-size="30px">1.53K</text></g>
</svg>
</div>
</td>
</tr>
<tr>
<td class="gt_row gt_left">
<span style="white-space:nowrap;"><img src="https://posit-dev.github.io/great-tables/blog/pycon-2024-great-tables-are-possible/data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAIAAAACACAYAAADDPmHLAAAABmJLR0QA/wD/AP+gvaeTAAAIKklEQVR4nO2dTYwURRSAP3aRPcgiKonK7pIYIwchEk7ewUSJQDiYeFBjNCHo/iEYPShePPhzMpwMhJPxZCQhEfCiN7OAukiyK0SixrAmepCfdVcM7OJ6qBmZqemeru6un/55X/KS6ZmeqtdVr6u73nvdBYIgCIIgCJ30AePAaWAeWBJxKvONth4FVhj0j1MGgHOEb5S6yveNPghCH9L5RZCzOB4JemK+3wNsclmxYMRmYHeIis/QbonHCTgc1YhB4CTtbX8qhCJzmhKDIZSoKUO0t/1fLitbFvP9kuF+ghu8tX/cPYBQE3wbgO5XKNS814Cy62+MPh2xQZJfIei81wCf+rto/6AKmPoV8sx7h1Bn4hfABW6foRdQd9YjZL+Z9aF/K5UzgPGIMuNkJGXZA8AhYMGg7FvAx8DaAukfReUMIM6vkHfeuxM1TUrrYZsFtufQ/4Ql/eOonAF08ytknfeOoc7otJ3fOhqYnq0u9O+GGEACO4nu/ClgL7ABuLMhGxrfTUXsfwuzkUAMICentfJOohpxCHXT1vrbREJZA3QO+zeAYbpPa3tRN4k3tP/OAg941N+EyhnAWESZcTKcUNYROjt/SwpdttJpBIc86m9C5QygDzVPTmq8SbpPo4aARfI3uN6hC3Sfw9vS35TKGQCoBu7WiJMkT89Gtf9MoYb2OHYBMw3Z1vJ9LzBNOkOyob8plTQAUGfHKOo6OdeQCVTjm5w5+pRrb5d9n6HdNzCj/b5PK+u4B/1NqawB5OVH2vV6JGa/XXQ6hi5p+2zUfr/gQN+sBG/4ArEoE/HVsbsN6Ptt4Ayilb6tX3mHOibFW/tX7ZwsN4YJnHyReA54FjCf/NqlQVKeoIYHoJ2IYaBS7ReeY3kUtAAAXyxtP1m8BXc+iyXyvrc4P/+MoHqKQB2Iinj2j/mab7NDCOXuAHraxXPOhvSuUMwFY8fZDOu/vRDPrs1cpYoPscXvIBcmIznn5Y2/8Gyr1ryuPATa2Mjzzqb0LlDMBmPsBaooNBY3S/HCxHnfl6518D7k+pv+QDpMR2OHUH0eHgaZSHbyPKR7Cy8Xk/ndf8JdQUcRvJSDg4Jy4acJR8CSGLJN/4udS/G5UzAFfx9O2oeH7azr+G2ZnvWv84KmcALuPpa4CDmCWFLqBi/0kJID71j6JyBuAjnj6AGtJPAOe5Ha07j7rpfJns4VrJB7CAz3i6CyQfwAK+4umuqFw+gDwdXEy8tX/ZwsGCZeIMYF7blhdE+GNI2w6SqBI37xXc4sqvkJo0814Rt2LDr5Aa03mviFux5VfIRNK8V8R95wf3i+jz3tCNUnUpjV9EV7xs5YeuvzVtXX9eoRSIAeSjNWv5SQflG5PVw6Q3im1Plevyi16/N8QTWHPEAGqOGEDNKaoB6P5v39OxVmZzHMdy4EXgW+C6R/2dv8HU9V3y0Yg6QslnGY/hHuCbAujv5A2srg1gPXA5oh7fchl4OIP+PXQG1EKK9ZVHXBsAqOjjp2TL+s0rs6gzP0vnAzwfQOcksfHE0v/4MACf9blufN8rrjhfeUQMIJ2EyKUwemClqJ5A3/W5NuJQnkT9uHr074o6DRQ8sTy0AgUl7xnr47JoBRkBao6MANGU5gzOi4wANUcMwA+hpoGtNFd/t4L4AdKJ7+cqop4vqJQjyLXknQU8G0DnJKmUK7joBtCDyu4N3elNKWUwqFt9RTcAgNWoYbcInV+6cHBSfWUwAFCvrXsB9Zq5vz3q33y+YISSJoRkre9AxL5NOZCi/MpmAduiiAawiu5JJFdRw7JJ+bUxgCr5AcZRaVhNrgJXWrZXk+29wkIERRsBos7+t+m8JMSNArUdAbLi2wDSrg98BbiL5MtClOTJAjblKeA3OlczKw2+DSBtlvBbLf99M+V/jzo/Gnk4NDVpsoS/Q73goklf4zvTkWO986Px337WCXEASVnCM8CHqNXAdPobv+mribUO+0fJngWclsIYQFlyAqtGYdqvStNAIQNiADVHDKDmiAHUHDGAmlNkA1iFSmsyWQnElvwJ7PZxcGXHxzz2jYh6fMhNon0JNimMH6DII4DPp2lbuYPkdQQrgzwYEs1XqEtPk2vAl8AHtIeYa4uPIeygVse4o3oALmJ2efgJFWXMi1wCSspDwPuhlbCJGEB6ng6tgE3kHiCarcCvLds/t3xe41cVt4gBRDMD/BJaCR/IJaDmiAEks07bDrKKlyvEALqzDjisfTcdQhFXyD1ANBe7/PaJNy08ICNAOs4CR0IrYZMyGYDLvDmTss8CO1DBospQ5EvAVW37Xod1xc3t54Ep1LB/hIp1PhTbAP7Qtjc6qmeQ9sfFrqNyEW45qq8S+AhmPKrVMY+dQIzOPq2erx3UoVOYYFBWfBzAMjof5HjXch39wO9aHa9ZriMKMQBDXtfqWQSesFR2L3CMzlHmPkvld0MMwJB+1FO0rXX9g1qHJ8+sYA1wgs7jeCePsikQA0jBFtQNmV7nKeAl4EHaHwaN427gMeA9VIaPXt6kYTk2KI0B9KEycU5z+02TIu7E+WpfaRgAzhG+UeoqTlb7MqUP6fwiiPUXPOrEuYL3AJtcViwYsZlAD6qcod0Sfa96VVecr/ZlypymRIjXndcVo9W+bBE3l14y3E9wg7f2L1M4WHCAGEDNEQOoOXEGMK9ty02gP/S1foJkIetLn/te86auRK31MxFCkTHSe61E3MhwQl85oQ/liw598HWXSQIGhQYQIwjd+WsTe8kxK1ChyQk6vYMi9qW51s8wBQgHC4IgCIJQXf4DCQUbwcLC7RUAAAAASUVORK5CYII=" style="height: 2em;vertical-align: middle;"></span>
</td>
<td class="gt_row gt_left">
Espresso Machine
</td>
<td style="background-color: aliceblue;" class="gt_row gt_right">
$8.41M
</td>
<td style="background-color: aliceblue;" class="gt_row gt_right">
29%
</td>
<td style="background-color: papayawhip;" class="gt_row gt_right">
$3.64M
</td>
<td style="background-color: papayawhip;" class="gt_row gt_right">
25%
</td>
<td class="gt_row gt_center">
<div>
<svg viewbox="0 0 700 130" style="height: 2em; margin-left: auto; margin-right: auto; font-size: inherit; overflow: visible; vertical-align: middle; position:relative;">
<defs><pattern id="area_pattern" width="8" height="8" patternunits="userSpaceOnUse"><path class="pattern-line" d="M 0,8 l 8,-8 M -1,1 l 4,-4 M 6,10 l 4,-4" stroke="#FF0000" stroke-width="1.5" stroke-linecap="round" shape-rendering="geometricPrecision"></path></pattern></defs><style> text { font-family: ui-monospace, ‘Cascadia Code’, ‘Source Code Pro’, Menlo, Consolas, ‘DejaVu Sans Mono’, monospace; stroke-width: 0.15em; paint-order: stroke; stroke-linejoin: round; cursor: default; } .vert-line:hover rect { fill: #911EB4; fill-opacity: 40%; stroke: #FFFFFF60; color: red; } .vert-line:hover text { stroke: white; fill: #212427; } .horizontal-line:hover text {stroke: white; fill: #212427; } .ref-line:hover rect { stroke: #FFFFFF60; } .ref-line:hover line { stroke: #FF0000; } .ref-line:hover text { stroke: white; fill: #212427; } .y-axis-line:hover rect { fill: #EDEDED; fill-opacity: 60%; stroke: #FFFFFF60; color: red; } .y-axis-line:hover text { stroke: white; stroke-width: 0.20em; fill: #1A1C1F; } </style><line x1="22.5" y1="115.0" x2="677.5" y2="115.0" stroke="#BFBFBF" stroke-width="4"></line><rect x="30.0" y="88.37989910748932" width="40" height="26.620100892510678" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="84.54545454545455" y="82.40395809080326" width="40" height="32.59604190919674" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="139.0909090909091" y="91.0186263096624" width="40" height="23.981373690337605" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="193.63636363636363" y="91.79472254559565" width="40" height="23.205277454404353" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="248.1818181818182" y="31.647264260768335" width="40" height="83.35273573923166" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="302.72727272727275" y="94.31703531237874" width="40" height="20.682964687621265" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="357.27272727272725" y="84.07256499805976" width="40" height="30.92743500194024" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="411.8181818181818" y="76.35040745052387" width="40" height="38.649592549476125" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="466.3636363636364" y="76.11757857974389" width="40" height="38.88242142025611" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="520.909090909091" y="89.07838571982926" width="40" height="25.921614280170743" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="575.4545454545455" y="81.70547147846332" width="40" height="33.29452852153668" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="630.0" y="15.0" width="40" height="100.0" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><g class="y-axis-line"><rect x="0" y="0" width="65" height="130" stroke="transparent" stroke-width="0" fill="transparent"></rect><text x="0" y="19.0" fill="transparent" stroke="transparent" font-size="25">2.58K</text><text x="0" y="126.0" fill="transparent" stroke="transparent" font-size="25">0</text></g><g class="vert-line"><rect x="40.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="60.0" y="20" fill="transparent" stroke="transparent" font-size="30px">686</text></g><g class="vert-line"><rect x="94.54545454545455" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="114.54545454545455" y="20" fill="transparent" stroke="transparent" font-size="30px">840</text></g><g class="vert-line"><rect x="149.0909090909091" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="169.0909090909091" y="20" fill="transparent" stroke="transparent" font-size="30px">618</text></g><g class="vert-line"><rect x="203.63636363636363" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="223.63636363636363" y="20" fill="transparent" stroke="transparent" font-size="30px">598</text></g><g class="vert-line"><rect x="258.1818181818182" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="278.1818181818182" y="20" fill="transparent" stroke="transparent" font-size="30px">2.15K</text></g><g class="vert-line"><rect x="312.72727272727275" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="332.72727272727275" y="20" fill="transparent" stroke="transparent" font-size="30px">533</text></g><g class="vert-line"><rect x="367.27272727272725" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="387.27272727272725" y="20" fill="transparent" stroke="transparent" font-size="30px">797</text></g><g class="vert-line"><rect x="421.8181818181818" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="441.8181818181818" y="20" fill="transparent" stroke="transparent" font-size="30px">996</text></g><g class="vert-line"><rect x="476.3636363636364" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="496.3636363636364" y="20" fill="transparent" stroke="transparent" font-size="30px">1.00K</text></g><g class="vert-line"><rect x="530.909090909091" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="550.909090909091" y="20" fill="transparent" stroke="transparent" font-size="30px">668</text></g><g class="vert-line"><rect x="585.4545454545455" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="605.4545454545455" y="20" fill="transparent" stroke="transparent" font-size="30px">858</text></g><g class="vert-line"><rect x="640.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="660.0" y="20" fill="transparent" stroke="transparent" font-size="30px">2.58K</text></g>
</svg>
</div>
</td>
</tr>
<tr>
<td style="font-weight: bold;" class="gt_row gt_left">
</td>
<td style="font-weight: bold;" class="gt_row gt_left">
Total
</td>
<td style="background-color: aliceblue; font-weight: bold;" class="gt_row gt_right">
$29.4M
</td>
<td style="background-color: aliceblue; font-weight: bold;" class="gt_row gt_right">
100%
</td>
<td style="background-color: papayawhip; font-weight: bold;" class="gt_row gt_right">
$14.8M
</td>
<td style="background-color: papayawhip; font-weight: bold;" class="gt_row gt_right">
100%
</td>
<td style="font-weight: bold;" class="gt_row gt_center">
</td>
</tr>
</tbody>
</table>
</div>
</div>
<p>Each row of this table is a product sold over the past year (with a total at the bottom).</p>
<p>Note three important pieces:</p>
<ol type="1">
<li><strong>Icons</strong> help people quickly identify products of interest.</li>
<li><strong>Background color</strong> distinguishes between revenue and profit measures.</li>
<li><strong>The nanoplot</strong> on the right shows a tiny bargraph for monthly sales over the past year. This makes it easy to spot trends, and can be hovered over to get exact values.</li>
</ol>
<p>Critically, the code for this table used the DataFrame library <a href="https://pola.rs/">Polars</a>, which makes it really <a href="../../blog/polars-styling/index.html">easy to select rows and columns for styling</a>.</p>
</section>
<section id="whats-next" class="level2">
<h2 class="anchored" data-anchor-id="whats-next">What’s next?</h2>
<section id="the-2024-table-contest" class="level3">
<h3 class="anchored" data-anchor-id="the-2024-table-contest">The 2024 Table Contest</h3>
<p>The world’s premier display table contest—the <a href="https://posit.co/blog/announcing-the-2024-table-contest/">4th annual Table Contest</a> draws competitors from near and far, to showcase the latest and greatest examples in table presentation.</p>
<p>The contest was a great success! On July 1, 2024 we announced the <a href="https://posit.co/blog/2024-table-contest-winners/">2024 winners and honorable mentions</a>. Check ’em out!</p>
</section>
<section id="positconf-workshop" class="level3">
<h3 class="anchored" data-anchor-id="positconf-workshop">posit::conf() workshop</h3>
<p>We held a posit::conf() 2024 workshop, and you can find the materials at the <a href="https://github.com/posit-conf-2024/tables">Making Tables with gt and Great Tables repo</a>.</p>
<p>If you’re curious about making beautiful, publication quality tables in Python or R, do have a look at the resources at that GitHub repository.</p>
<p>We covered the following table topics:</p>
<ul>
<li>Create table components and put them together (e.g., header, footer, stub, etc.)</li>
<li>Format cell values (numeric/scientific, date/datetime, etc.)</li>
<li>Rearranging columns and handling column value alignments</li>
<li>Styling the table, either through data values or on a more granular level</li>
<li>Adding icons, plots, images, and incorporating your own HTML</li>
<li>and more!</li>
</ul>
</section>
</section>
<section id="extra-resources" class="level2">
<h2 class="anchored" data-anchor-id="extra-resources">Extra resources</h2>
<p>Check out these resources to learn more about the wild and beautiful life of display tables:</p>
<ul>
<li><a href="../../examples/index.html">Great Tables example gallery</a></li>
<li><a href="../../blog/design-philosophy/index.html">The Design Philosophy of Great Tables (blog post)</a></li>
<li><a href="https://youtu.be/ESyWcOFuMQc?si=1_bBRZEKENFKVNpB">20 Minute Table Tutorial by Albert Rapp</a></li>
<li><a href="https://youtu.be/08yLWPpFdo4?si=vBK9h-ObXNKp9tHH">PyCon talk: Making Beautiful, Publication Quality Tables is Possible in 2024</a></li>
</ul>
</section>
<section id="hope-all-your-tables-are-great" class="level2">
<h2 class="anchored" data-anchor-id="hope-all-your-tables-are-great">Hope all your tables are great!</h2>
<p>A huge thanks to all the people who have contributed to Great Tables over the past year. It’s been a really incredible journey!</p>


</section>

 ]]></description>
  <guid>https://posit-dev.github.io/great-tables/blog/pycon-2024-great-tables-are-possible/</guid>
  <pubDate>Thu, 16 May 2024 00:00:00 GMT</pubDate>
</item>
<item>
  <title>Great Tables is now BYODF (Bring Your Own DataFrame)</title>
  <dc:creator>Michael Chow</dc:creator>
  <link>https://posit-dev.github.io/great-tables/blog/bring-your-own-df/</link>
  <description><![CDATA[ 




<p>A few months ago, we released a <a href="./polars-styling">blog post</a> about how much we loved the combination of Polars and Great Tables. We found that Polars lazy expression system opened up convenient ways to conditionally format tables for presentation. However, excited as we were, we were harboring a shameful secret: Great Tables enabled Polars as an optional dependency, but had a hard dependency on the alternative DataFrame library Pandas.</p>
<p>We’re happy to share that <a href="https://github.com/posit-dev/great-tables">Great Tables</a> v0.5.0 makes Pandas an optional dependency. Using Pandas DataFrames as inputs is still fully supported. The optional dependency simply allows users of one DataFrame library to not have to install the other.</p>
<p>In this post, I’ll cover three important pieces:</p>
<ul>
<li>Where we are today on dependencies</li>
<li>The challenge of removing hard dependencies</li>
<li>How we made Pandas optional</li>
</ul>
<p>This may seem over the top, but many DataFrame implementations exist in the Python world. Enabling folks to BYODF (Bring Your Own DataFrame) is a tricky, rewarding challenge!</p>
<section id="the-state-of-great-tables-dependencies" class="level2">
<h2 class="anchored" data-anchor-id="the-state-of-great-tables-dependencies">The state of Great Tables dependencies</h2>
<p>Currently, Great Tables has two “sizes” of libraries it depends on:</p>
<ul>
<li><strong>Small</strong>: utility libraries for things like datetime localization.</li>
<li><strong>Big</strong>: a lingering dependency on numpy in a few places (like nanoplots).</li>
</ul>
<p>For small utilities, we depend on Babel, which makes it easier to say things like, “format this number as if I’m in Germany”.</p>
<p>For big dependencies, numpy should be fairly straightforward to remove (see <a href="https://github.com/posit-dev/great-tables/issues/296">this issue</a>). We also still rely on Pandas for datasets in <code>great_tables.data</code>, but we will remove it soon (see <a href="https://github.com/posit-dev/great-tables/issues/91">this issue</a>).</p>
<p>Removing dependencies like numpy and Pandas helps people who are in restricted computing environments, want a more lightweight install, or who are stuck depending on a much earlier version of a package. It also helps us keep a clean separation of concerns. Without clear boundaries, it’s too tempting to reach for things like <code>pd.isna()</code> in a pinch, or smear library specific versions of missingness across our code (e.g.&nbsp;<code>pd.NA</code>, <code>np.nan</code>, <code>polars.NullType</code>).</p>
</section>
<section id="the-challenge-of-removing-hard-dependencies" class="level2">
<h2 class="anchored" data-anchor-id="the-challenge-of-removing-hard-dependencies">The challenge of removing hard dependencies</h2>
<p>Removing hard dependencies on DataFrame libraries is worthwhile, but requires special handling for all DataFrame specific actions. To illustrate consider the Great Tables output below, which is produced from a Pandas DataFrame:</p>
<div id="e11032a2" class="cell" data-execution_count="1">
<div class="code-copy-outer-scaffold"><div class="sourceCode cell-code" id="cb1" style="background: #f1f3f5;"><pre class="sourceCode python code-with-copy"><code class="sourceCode python"><span id="cb1-1"><span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">import</span> pandas <span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">as</span> pd</span>
<span id="cb1-2"><span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">import</span> polars <span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">as</span> pl</span>
<span id="cb1-3"><span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">from</span> great_tables <span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">import</span> GT</span>
<span id="cb1-4"></span>
<span id="cb1-5">df_pandas <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> pd.DataFrame({<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"x"</span>: [<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"a"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"b"</span>], <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"y"</span>: [<span class="fl" style="color: #AD0000;
background-color: null;
font-style: inherit;">1.01</span>, <span class="fl" style="color: #AD0000;
background-color: null;
font-style: inherit;">2.0</span>]})</span>
<span id="cb1-6">df_polars <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> pl.from_pandas(df_pandas)</span>
<span id="cb1-7"></span>
<span id="cb1-8">GT(df_pandas)</span></code></pre></div></div>
<div class="cell-output cell-output-display" data-execution_count="1">
<div id="leusnvoxwe" style="padding-left:0px;padding-right:0px;padding-top:10px;padding-bottom:10px;overflow-x:auto;overflow-y:auto;width:auto;height:auto;">
<style>
#leusnvoxwe table {
          font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Helvetica Neue', 'Fira Sans', 'Droid Sans', Arial, sans-serif;
          -webkit-font-smoothing: antialiased;
          -moz-osx-font-smoothing: grayscale;
        }

#leusnvoxwe thead, tbody, tfoot, tr, td, th { border-style: none; }
 tr { background-color: transparent; }
#leusnvoxwe p { margin: 0; padding: 0; }
 #leusnvoxwe .gt_table { display: table; border-collapse: collapse; line-height: normal; margin-left: auto; margin-right: auto; color: #333333; font-size: 16px; font-weight: normal; font-style: normal; background-color: #FFFFFF; width: auto; border-top-style: solid; border-top-width: 2px; border-top-color: #A8A8A8; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #A8A8A8; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; }
 #leusnvoxwe .gt_caption { padding-top: 4px; padding-bottom: 4px; }
 #leusnvoxwe .gt_title { color: #333333; font-size: 125%; font-weight: initial; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; border-bottom-color: #FFFFFF; border-bottom-width: 0; }
 #leusnvoxwe .gt_subtitle { color: #333333; font-size: 85%; font-weight: initial; padding-top: 3px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; border-top-color: #FFFFFF; border-top-width: 0; }
 #leusnvoxwe .gt_heading { background-color: #FFFFFF; text-align: center; border-bottom-color: #FFFFFF; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #leusnvoxwe .gt_bottom_border { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #leusnvoxwe .gt_col_headings { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #leusnvoxwe .gt_col_heading { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; overflow-x: hidden; }
 #leusnvoxwe .gt_column_spanner_outer { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; padding-top: 0; padding-bottom: 0; padding-left: 4px; padding-right: 4px; }
 #leusnvoxwe .gt_column_spanner_outer:first-child { padding-left: 0; }
 #leusnvoxwe .gt_column_spanner_outer:last-child { padding-right: 0; }
 #leusnvoxwe .gt_column_spanner { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; overflow-x: hidden; display: inline-block; width: 100%; }
 #leusnvoxwe .gt_spanner_row { border-bottom-style: hidden; }
 #leusnvoxwe .gt_group_heading { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; text-align: left; }
 #leusnvoxwe .gt_empty_group_heading { padding: 0.5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: middle; }
 #leusnvoxwe .gt_from_md> :first-child { margin-top: 0; }
 #leusnvoxwe .gt_from_md> :last-child { margin-bottom: 0; }
 #leusnvoxwe .gt_row { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; margin: 10px; border-top-style: solid; border-top-width: 1px; border-top-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; overflow-x: hidden; }
 #leusnvoxwe .gt_stub { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; }
 #leusnvoxwe .gt_stub_row_group { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; vertical-align: top; }
 #leusnvoxwe .gt_row_group_first td { border-top-width: 2px; }
 #leusnvoxwe .gt_row_group_first th { border-top-width: 2px; }
 #leusnvoxwe .gt_striped { color: #333333; background-color: #F4F4F4; }
 #leusnvoxwe .gt_table_body { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #leusnvoxwe .gt_grand_summary_row { color: #333333; background-color: #FFFFFF; text-transform: inherit; padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; }
 #leusnvoxwe .gt_first_grand_summary_row_bottom { border-top-style: double; border-top-width: 6px; border-top-color: #D3D3D3; }
 #leusnvoxwe .gt_last_grand_summary_row_top { border-bottom-style: double; border-bottom-width: 6px; border-bottom-color: #D3D3D3; }
 #leusnvoxwe .gt_sourcenotes { color: #333333; background-color: #FFFFFF; border-bottom-style: none; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; }
 #leusnvoxwe .gt_sourcenote { font-size: 90%; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; text-align: left; }
 #leusnvoxwe .gt_left { text-align: left; }
 #leusnvoxwe .gt_center { text-align: center; }
 #leusnvoxwe .gt_right { text-align: right; font-variant-numeric: tabular-nums; }
 #leusnvoxwe .gt_font_normal { font-weight: normal; }
 #leusnvoxwe .gt_font_bold { font-weight: bold; }
 #leusnvoxwe .gt_font_italic { font-style: italic; }
 #leusnvoxwe .gt_super { font-size: 65%; }
 #leusnvoxwe .gt_footnote_marks { font-size: 75%; vertical-align: 0.4em; position: initial; }
 #leusnvoxwe .gt_asterisk { font-size: 100%; vertical-align: 0; }
 
</style>
<table class="gt_table" data-quarto-disable-processing="false" data-quarto-bootstrap="false">
<thead>

<tr class="gt_col_headings">
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="1" colspan="1" scope="col" id="x">x</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="y">y</th>
</tr>
</thead>
<tbody class="gt_table_body">
  <tr>
    <td class="gt_row gt_left">a</td>
    <td class="gt_row gt_right">1.01</td>
  </tr>
  <tr>
    <td class="gt_row gt_left">b</td>
    <td class="gt_row gt_right">2.0</td>
  </tr>
</tbody>


</table>

</div>
</div>
</div>
<p>Producing this table includes two actions on the DataFrame:</p>
<ul>
<li><strong>Get column names</strong>: these are used for column labels (and other things).</li>
<li><strong>Get column types</strong>: these are used for alignment (e.g.&nbsp;numeric column is right aligned).</li>
</ul>
<p>While these actions may seem simple, they require different methods for different DataFrame implementations. In this post, we’ll focus specifically on the challenge of getting column names.</p>
<section id="getting-column-names" class="level3">
<h3 class="anchored" data-anchor-id="getting-column-names">Getting column names</h3>
<p>The code below shows the different methods required to get column names as a list from Pandas and Polars.</p>
<div id="3a1c3db9" class="cell" data-execution_count="2">
<div class="code-copy-outer-scaffold"><div class="sourceCode cell-code" id="cb2" style="background: #f1f3f5;"><pre class="sourceCode python code-with-copy"><code class="sourceCode python"><span id="cb2-1">df_pandas.columns.tolist()  <span class="co" style="color: #5E5E5E;
background-color: null;
font-style: inherit;"># pandas</span></span>
<span id="cb2-2">df_polars.columns           <span class="co" style="color: #5E5E5E;
background-color: null;
font-style: inherit;"># polars</span></span></code></pre></div></div>
<div class="cell-output cell-output-display" data-execution_count="2">
<pre><code>['x', 'y']</code></pre>
</div>
</div>
<p>Notice that the two lines of code aren’t too different—Pandas just requires an extra <code>.tolist()</code> piece. We could create a special function, that returns a list of names, depending on the type of the input DataFrame.</p>
<div id="e45be707" class="cell" data-execution_count="3">
<div class="code-copy-outer-scaffold"><div class="sourceCode cell-code" id="cb4" style="background: #f1f3f5;"><pre class="sourceCode python code-with-copy"><code class="sourceCode python"><span id="cb4-1"><span class="kw" style="color: #003B4F;
background-color: null;
font-weight: bold;
font-style: inherit;">def</span> get_column_names(data) <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">-&gt;</span> <span class="bu" style="color: null;
background-color: null;
font-style: inherit;">list</span>[<span class="bu" style="color: null;
background-color: null;
font-style: inherit;">str</span>]:</span>
<span id="cb4-2"></span>
<span id="cb4-3">    <span class="co" style="color: #5E5E5E;
background-color: null;
font-style: inherit;"># pandas specific ----</span></span>
<span id="cb4-4">    <span class="cf" style="color: #003B4F;
background-color: null;
font-weight: bold;
font-style: inherit;">if</span> <span class="bu" style="color: null;
background-color: null;
font-style: inherit;">isinstance</span>(data, pd.DataFrame):</span>
<span id="cb4-5">        <span class="cf" style="color: #003B4F;
background-color: null;
font-weight: bold;
font-style: inherit;">return</span> data.columns.tolist()</span>
<span id="cb4-6"></span>
<span id="cb4-7">    <span class="co" style="color: #5E5E5E;
background-color: null;
font-style: inherit;"># polars specific ----</span></span>
<span id="cb4-8">    <span class="cf" style="color: #003B4F;
background-color: null;
font-weight: bold;
font-style: inherit;">elif</span> <span class="bu" style="color: null;
background-color: null;
font-style: inherit;">isinstance</span>(data, pl.DataFrame):</span>
<span id="cb4-9">        <span class="cf" style="color: #003B4F;
background-color: null;
font-weight: bold;
font-style: inherit;">return</span> data.columns</span>
<span id="cb4-10"></span>
<span id="cb4-11">    <span class="cf" style="color: #003B4F;
background-color: null;
font-weight: bold;
font-style: inherit;">raise</span> <span class="pp" style="color: #AD0000;
background-color: null;
font-style: inherit;">TypeError</span>(<span class="ss" style="color: #20794D;
background-color: null;
font-style: inherit;">f"Unsupported type </span><span class="sc" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">{</span><span class="bu" style="color: null;
background-color: null;
font-style: inherit;">type</span>(data)<span class="sc" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">}</span><span class="ss" style="color: #20794D;
background-color: null;
font-style: inherit;">"</span>)</span></code></pre></div></div>
</div>
<p>The function works great, in that we can call it on either DataFrame, but it lacks two things. The first is <strong>dependency inversion</strong>, since it requires importing both Pandas and Polars (creating a hard dependency). The second is <strong>separation of concerns</strong>, since Pandas and Polars code is mixed together. In this case adding more DataFrame implementations would create a hot stew of logic.</p>
</section>
</section>
<section id="how-we-made-pandas-optional" class="level2">
<h2 class="anchored" data-anchor-id="how-we-made-pandas-optional">How we made Pandas optional</h2>
<p>We were able to make Pandas optional in a sane manner through two moves:</p>
<ul>
<li><a href="https://github.com/machow/databackend">databackend</a>: perform <code>isinstance</code> checks without importing anything.</li>
<li>singledispatch: split out functions like <code>get_column_names()</code> into DataFrame specific versions.</li>
</ul>
<section id="inverting-dependency-with-databackend" class="level3">
<h3 class="anchored" data-anchor-id="inverting-dependency-with-databackend">Inverting dependency with databackend</h3>
<p>Inverting dependency on DataFrame libraries means that we check whether something is a specific type of DataFrame, without using imports. This is done through the package <code>databackend</code>, which we copied into Great Tables.</p>
<p>It works by creating placeholder classes, which stand in for the DataFrames they’re detecting:</p>
<div id="fb5878a2" class="cell" data-execution_count="4">
<div class="code-copy-outer-scaffold"><div class="sourceCode cell-code" id="cb5" style="background: #f1f3f5;"><pre class="sourceCode python code-with-copy"><code class="sourceCode python"><span id="cb5-1"><span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">from</span> great_tables._databackend <span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">import</span> AbstractBackend</span>
<span id="cb5-2"></span>
<span id="cb5-3"></span>
<span id="cb5-4"><span class="kw" style="color: #003B4F;
background-color: null;
font-weight: bold;
font-style: inherit;">class</span> PdDataFrame(AbstractBackend):</span>
<span id="cb5-5">    _backends <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> [(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"pandas"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"DataFrame"</span>)]</span>
<span id="cb5-6"></span>
<span id="cb5-7"></span>
<span id="cb5-8"><span class="kw" style="color: #003B4F;
background-color: null;
font-weight: bold;
font-style: inherit;">class</span> PlDataFrame(AbstractBackend):</span>
<span id="cb5-9">    _backends <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> [(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"polars"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"DataFrame"</span>)]</span>
<span id="cb5-10"></span>
<span id="cb5-11"></span>
<span id="cb5-12"><span class="cf" style="color: #003B4F;
background-color: null;
font-weight: bold;
font-style: inherit;">if</span> <span class="bu" style="color: null;
background-color: null;
font-style: inherit;">isinstance</span>(df_pandas, PdDataFrame):</span>
<span id="cb5-13">    <span class="bu" style="color: null;
background-color: null;
font-style: inherit;">print</span>(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"I'm a pandas DataFrame!!!"</span>)</span></code></pre></div></div>
<div class="cell-output cell-output-stdout">
<pre><code>I'm a pandas DataFrame!!!</code></pre>
</div>
</div>
<p>Note that the <code>PdDataFrame</code> above is able to detect a Pandas DataFrame without importing Pandas, by taking advantage of a bit of logic called a counterfactual:</p>
<ul>
<li>assumption: if <code>df_pandas</code> is a Pandas DataFrame, then Pandas has been imported.</li>
<li>counterfactual: if Pandas has not been imported, then <code>df_pandas</code> is not a Pandas DataFrame.</li>
</ul>
<p>This lets it quickly rule out a potential Pandas object by checking whether Pandas has been imported. Since this can be done by looking inside <code>sys.modules</code>, no imports are required. For more on this approach, see the <a href="https://github.com/machow/databackend">databackend README</a>.</p>
</section>
<section id="separating-concerns-with-singledispatch" class="level3">
<h3 class="anchored" data-anchor-id="separating-concerns-with-singledispatch">Separating concerns with singledispatch</h3>
<p>While databackend removes dependencies, the use of singledispatch from the built-in <code>functools</code> module separates out the logic for handling Polars DataFrames from the logic for Pandas DataFrames. This makes it easier to think one DataFrame at a time, and also gets us better type hinting.</p>
<p>Here’s a basic example, showing the <code>get_column_names()</code> function re-written using singledispatch:</p>
<div id="4a6df3f3" class="cell" data-execution_count="5">
<div class="code-copy-outer-scaffold"><div class="sourceCode cell-code" id="cb7" style="background: #f1f3f5;"><pre class="sourceCode python code-with-copy"><code class="sourceCode python"><span id="cb7-1"><span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">from</span> functools <span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">import</span> singledispatch</span>
<span id="cb7-2"></span>
<span id="cb7-3"></span>
<span id="cb7-4"><span class="co" style="color: #5E5E5E;
background-color: null;
font-style: inherit;"># define the generic function ----</span></span>
<span id="cb7-5"><span class="co" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">#</span></span>
<span id="cb7-6"><span class="at" style="color: #657422;
background-color: null;
font-style: inherit;">@singledispatch</span></span>
<span id="cb7-7"><span class="kw" style="color: #003B4F;
background-color: null;
font-weight: bold;
font-style: inherit;">def</span> get_column_names(data) <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">-&gt;</span> <span class="bu" style="color: null;
background-color: null;
font-style: inherit;">list</span>[<span class="bu" style="color: null;
background-color: null;
font-style: inherit;">str</span>]:</span>
<span id="cb7-8">    <span class="cf" style="color: #003B4F;
background-color: null;
font-weight: bold;
font-style: inherit;">raise</span> <span class="pp" style="color: #AD0000;
background-color: null;
font-style: inherit;">TypeError</span>(<span class="ss" style="color: #20794D;
background-color: null;
font-style: inherit;">f"Unsupported type </span><span class="sc" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">{</span><span class="bu" style="color: null;
background-color: null;
font-style: inherit;">type</span>(data)<span class="sc" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">}</span><span class="ss" style="color: #20794D;
background-color: null;
font-style: inherit;">"</span>)</span>
<span id="cb7-9"></span>
<span id="cb7-10"></span>
<span id="cb7-11"><span class="co" style="color: #5E5E5E;
background-color: null;
font-style: inherit;"># register a pandas implementation on it ----</span></span>
<span id="cb7-12"><span class="co" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">#</span></span>
<span id="cb7-13"><span class="at" style="color: #657422;
background-color: null;
font-style: inherit;">@get_column_names.register</span></span>
<span id="cb7-14"><span class="kw" style="color: #003B4F;
background-color: null;
font-weight: bold;
font-style: inherit;">def</span> _(data: PdDataFrame):</span>
<span id="cb7-15">    <span class="cf" style="color: #003B4F;
background-color: null;
font-weight: bold;
font-style: inherit;">return</span> data.columns.tolist()</span>
<span id="cb7-16"></span>
<span id="cb7-17"></span>
<span id="cb7-18"><span class="co" style="color: #5E5E5E;
background-color: null;
font-style: inherit;"># register a polars implementation on it ----</span></span>
<span id="cb7-19"><span class="co" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">#</span></span>
<span id="cb7-20"><span class="at" style="color: #657422;
background-color: null;
font-style: inherit;">@get_column_names.register</span></span>
<span id="cb7-21"><span class="kw" style="color: #003B4F;
background-color: null;
font-weight: bold;
font-style: inherit;">def</span> _(data: PlDataFrame):</span>
<span id="cb7-22">    <span class="cf" style="color: #003B4F;
background-color: null;
font-weight: bold;
font-style: inherit;">return</span> data.columns</span></code></pre></div></div>
</div>
<p>Note three important pieces:</p>
<ul>
<li>The initial <code>@singledispatch</code> decorates <code>def get_column_names(...)</code>. This creates a special “generic function”, which can define DataFrame specific implementations.</li>
<li><code>@get_column_names.register</code> implements the Pandas DataFrame.</li>
<li>The use of <code>PdDataFrame</code> is what signifies “run this for Pandas DataFrames”.</li>
</ul>
<p>With the <code>get_column_names</code> implementations defined, we can call it like a normal function:</p>
<div id="b8e58a8d" class="cell" data-execution_count="6">
<div class="code-copy-outer-scaffold"><div class="sourceCode cell-code" id="cb8" style="background: #f1f3f5;"><pre class="sourceCode python code-with-copy"><code class="sourceCode python"><span id="cb8-1">get_column_names(df_pandas)  <span class="co" style="color: #5E5E5E;
background-color: null;
font-style: inherit;"># pandas version</span></span>
<span id="cb8-2">get_column_names(df_polars)  <span class="co" style="color: #5E5E5E;
background-color: null;
font-style: inherit;"># polars version</span></span></code></pre></div></div>
<div class="cell-output cell-output-display" data-execution_count="6">
<pre><code>['x', 'y']</code></pre>
</div>
</div>
<p>For more on the benefits of singledispatch in data tooling, see the blog post <a href="https://mchow.com/posts/2020-02-24-single-dispatch-data-science/">Single Dispatch for Data Science Tools</a>. For the nitty gritty on our DataFrame processing, see the Great Tables <a href="https://github.com/posit-dev/great-tables/blob/main/great_tables/_tbl_data.py"><code>_tbl_data.py</code> submodule</a>.</p>
</section>
</section>
<section id="see-you-in-the-polarsverse" class="level2">
<h2 class="anchored" data-anchor-id="see-you-in-the-polarsverse">See you in the Polarsverse</h2>
<p>This was a long diversion into the strategy behind supporting both Pandas and Polars, but the results are worth it. Users are able to bring their DataFrame of choice without the collective baggage of every DataFrame option.</p>
<p>For more on the special things you can do with Polars expressions, see these resources:</p>
<ul>
<li><a href="../../get-started/basic-styling.html#using-polars-expressions">Guide: basic styling using Polars expressions</a></li>
<li><a href="../../blog/polars-styling/index.html">Post: Great Tables, the Polars DataFrame Styler of Your Dreams</a></li>
<li><a href="https://github.com/MarcoGorelli/narwhals">The narwhals library</a>: a neat library for running Polars expressions on Pandas DataFrames.</li>
</ul>
<p>Hope you make some stylish, publication ready tables!</p>


</section>

 ]]></description>
  <guid>https://posit-dev.github.io/great-tables/blog/bring-your-own-df/</guid>
  <pubDate>Wed, 24 Apr 2024 00:00:00 GMT</pubDate>
</item>
<item>
  <title>The Design Philosophy of Great Tables</title>
  <dc:creator>Rich Iannone and Michael Chow</dc:creator>
  <link>https://posit-dev.github.io/great-tables/blog/design-philosophy/</link>
  <description><![CDATA[ 




<p>We’ve spent a lot of time thinking about tables. Tables—like plots—are crucial as a last step toward presenting information. There is surprising sophistication and nuance in designing effective tables. Over the past 5,000 years, they’ve evolved from simple grids to highly structured displays of data. Although we argue that the mid-1900s served as a high point, the popularization and wider accessibility of computing seemingly brought us back to the simple, ancient times.</p>
<p>Okay, it’s not all <em>that bad</em> but the workers of data are today confronted with an all-too-familiar dilemma: copy your data into a tool like Excel to make the table, or, display an otherwise unpolished table. Through the exploration of the qualities that make tables shine, the backstory of tables as a display of data, and the issues faced today, it’s clear how we can solve the <strong>great table dilemma</strong> with <a href="https://github.com/posit-dev/great-tables"><strong>Great Tables</strong></a>.</p>
<p><img src="https://posit-dev.github.io/great-tables/blog/design-philosophy/computer_tables.png" class="img-fluid"></p>
<p style="font-size: 12px;">
Tables made with computers (left to right): (1) a DataFrame printed at the console, (2) an Excel table, and (3) a <strong>Great Tables</strong> table.
</p>
<section id="what-is-a-table-really" class="level3">
<h3 class="anchored" data-anchor-id="what-is-a-table-really">What is a table, really?</h3>
<p>Before getting to what makes tables <em>shine</em> we should first define what a table is. This is surprisingly hard! But I believe it can be boiled down to two basic rules:</p>
<ul>
<li>the data is represented as columns and rows</li>
<li>the data is primarily text</li>
</ul>
<p>Let’s look at an example of a simple table with actual data to tie this theory to practice.</p>
<div id="29ad29a6" class="cell" data-execution_count="1">
<div class="cell-output cell-output-display" data-execution_count="1">
<div id="wglorqvmzy" style="padding-left:0px;padding-right:0px;padding-top:10px;padding-bottom:10px;overflow-x:auto;overflow-y:auto;width:auto;height:auto;">
<style>
#wglorqvmzy table {
          font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Helvetica Neue', 'Fira Sans', 'Droid Sans', Arial, sans-serif;
          -webkit-font-smoothing: antialiased;
          -moz-osx-font-smoothing: grayscale;
        }

#wglorqvmzy thead, tbody, tfoot, tr, td, th { border-style: none; }
 tr { background-color: transparent; }
#wglorqvmzy p { margin: 0; padding: 0; }
 #wglorqvmzy .gt_table { display: table; border-collapse: collapse; line-height: normal; margin-left: auto; margin-right: auto; color: #333333; font-size: 16px; font-weight: normal; font-style: normal; background-color: #FFFFFF; width: auto; border-top-style: solid; border-top-width: 2px; border-top-color: #A8A8A8; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #A8A8A8; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; }
 #wglorqvmzy .gt_caption { padding-top: 4px; padding-bottom: 4px; }
 #wglorqvmzy .gt_title { color: #333333; font-size: 125%; font-weight: initial; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; border-bottom-color: #FFFFFF; border-bottom-width: 0; }
 #wglorqvmzy .gt_subtitle { color: #333333; font-size: 85%; font-weight: initial; padding-top: 3px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; border-top-color: #FFFFFF; border-top-width: 0; }
 #wglorqvmzy .gt_heading { background-color: #FFFFFF; text-align: center; border-bottom-color: #FFFFFF; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #wglorqvmzy .gt_bottom_border { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #wglorqvmzy .gt_col_headings { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #wglorqvmzy .gt_col_heading { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; overflow-x: hidden; }
 #wglorqvmzy .gt_column_spanner_outer { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; padding-top: 0; padding-bottom: 0; padding-left: 4px; padding-right: 4px; }
 #wglorqvmzy .gt_column_spanner_outer:first-child { padding-left: 0; }
 #wglorqvmzy .gt_column_spanner_outer:last-child { padding-right: 0; }
 #wglorqvmzy .gt_column_spanner { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; overflow-x: hidden; display: inline-block; width: 100%; }
 #wglorqvmzy .gt_spanner_row { border-bottom-style: hidden; }
 #wglorqvmzy .gt_group_heading { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; text-align: left; }
 #wglorqvmzy .gt_empty_group_heading { padding: 0.5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: middle; }
 #wglorqvmzy .gt_from_md> :first-child { margin-top: 0; }
 #wglorqvmzy .gt_from_md> :last-child { margin-bottom: 0; }
 #wglorqvmzy .gt_row { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; margin: 10px; border-top-style: solid; border-top-width: 1px; border-top-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; overflow-x: hidden; }
 #wglorqvmzy .gt_stub { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; }
 #wglorqvmzy .gt_stub_row_group { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; vertical-align: top; }
 #wglorqvmzy .gt_row_group_first td { border-top-width: 2px; }
 #wglorqvmzy .gt_row_group_first th { border-top-width: 2px; }
 #wglorqvmzy .gt_striped { color: #333333; background-color: #F4F4F4; }
 #wglorqvmzy .gt_table_body { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #wglorqvmzy .gt_grand_summary_row { color: #333333; background-color: #FFFFFF; text-transform: inherit; padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; }
 #wglorqvmzy .gt_first_grand_summary_row_bottom { border-top-style: double; border-top-width: 6px; border-top-color: #D3D3D3; }
 #wglorqvmzy .gt_last_grand_summary_row_top { border-bottom-style: double; border-bottom-width: 6px; border-bottom-color: #D3D3D3; }
 #wglorqvmzy .gt_sourcenotes { color: #333333; background-color: #FFFFFF; border-bottom-style: none; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; }
 #wglorqvmzy .gt_sourcenote { font-size: 90%; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; text-align: left; }
 #wglorqvmzy .gt_left { text-align: left; }
 #wglorqvmzy .gt_center { text-align: center; }
 #wglorqvmzy .gt_right { text-align: right; font-variant-numeric: tabular-nums; }
 #wglorqvmzy .gt_font_normal { font-weight: normal; }
 #wglorqvmzy .gt_font_bold { font-weight: bold; }
 #wglorqvmzy .gt_font_italic { font-style: italic; }
 #wglorqvmzy .gt_super { font-size: 65%; }
 #wglorqvmzy .gt_footnote_marks { font-size: 75%; vertical-align: 0.4em; position: initial; }
 #wglorqvmzy .gt_asterisk { font-size: 100%; vertical-align: 0; }
 
</style>
<table class="gt_table" data-quarto-disable-processing="false" data-quarto-bootstrap="false">
<thead>

<tr class="gt_col_headings">
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="1" colspan="1" scope="col" id="Name">Name</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="1" colspan="1" scope="col" id="Address">Address</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="1" colspan="1" scope="col" id="City">City</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="1" colspan="1" scope="col" id="Postcode">Postcode</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="1" colspan="1" scope="col" id="DOB">DOB</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="1" colspan="1" scope="col" id="Height">Height</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="Weight">Weight</th>
</tr>
</thead>
<tbody class="gt_table_body">
  <tr>
    <td class="gt_row gt_left">Dustin B. Roach</td>
    <td class="gt_row gt_left">1183 Columbia Road</td>
    <td class="gt_row gt_left">Holly Oak, DE</td>
    <td class="gt_row gt_left">19809</td>
    <td class="gt_row gt_left">1970-09-16</td>
    <td class="gt_row gt_left">5' 9"</td>
    <td class="gt_row gt_right">202.5</td>
  </tr>
  <tr>
    <td class="gt_row gt_left">Iwona Adamczyk</td>
    <td class="gt_row gt_left">ul. Zabłudowska 133</td>
    <td class="gt_row gt_left">Warszawa</td>
    <td class="gt_row gt_left">04-788</td>
    <td class="gt_row gt_left">1976-01-03</td>
    <td class="gt_row gt_left">5' 5"</td>
    <td class="gt_row gt_right">123.7</td>
  </tr>
  <tr>
    <td class="gt_row gt_left">Geneviève Massé</td>
    <td class="gt_row gt_left">1415 rue Principale</td>
    <td class="gt_row gt_left">Amos, QC</td>
    <td class="gt_row gt_left">J9T 1E4</td>
    <td class="gt_row gt_left">1967-12-08</td>
    <td class="gt_row gt_left">5' 3"</td>
    <td class="gt_row gt_right">136.3</td>
  </tr>
  <tr>
    <td class="gt_row gt_left">João Souza Lima</td>
    <td class="gt_row gt_left">Rua Cosmorama, 538</td>
    <td class="gt_row gt_left">São Paulo-SP</td>
    <td class="gt_row gt_left">04648-080</td>
    <td class="gt_row gt_left">2001-04-21</td>
    <td class="gt_row gt_left">6' 2"</td>
    <td class="gt_row gt_right">231.0</td>
  </tr>
  <tr>
    <td class="gt_row gt_left">Maddison McCabe</td>
    <td class="gt_row gt_left">149 Raymond Street</td>
    <td class="gt_row gt_left">Strathern</td>
    <td class="gt_row gt_left">Invercargill 9812</td>
    <td class="gt_row gt_left">1982-03-05</td>
    <td class="gt_row gt_left">5' 8"</td>
    <td class="gt_row gt_right">146.1</td>
  </tr>
</tbody>


</table>

</div>
</div>
</div>
<p style="font-size: 12px;">
A table of named individuals along with a select set of characteristics.
</p>
<p>This table arranges records containing personal characteristics as columns and rows. Each person is a row, and each characteristic makes up a different column. The characteristics use different types of data, like dates, numbers, and text. This arrangement makes it easy to look up individual values or make comparisons across the different rows or columns.</p>
<p>Note that there are horizontal lines separating the rows. This aesthetic touch, while not strictly required for a table, serves as a visual reinforcement for separating the individual rows.</p>
<p>The order of the columns matters, and that we start with the <code>Name</code> column here is no accident. If that column were the last (i.e., furthest to the right), it would be slightly more confusing for the reader since the subject for the record isn’t immediate. In addition to order, column labels play an important role for indicating what data is in each column. They’re not always necessary but in most cases they remove the guesswork for what type of data is contained within each column.</p>
<p>We’ll go into some detail later about how <a href="https://github.com/posit-dev/great-tables"><strong>Great Tables</strong></a> provides affordances for structuring information for better legibility and how the package can be used to adorn the table with other structural elements. For now, our conception of a table can be summarized in this schematic.</p>
<p><img src="https://posit-dev.github.io/great-tables/blog/design-philosophy/a_simple_table.png" class="img-fluid"></p>
<p style="font-size: 12px;">
A simple table has: (1) cells containing data, (2) an arrangement of columns and rows, and (3) column labels to describe the type data in each column.
</p>
<p>Now, let’s go back: way back. In examining where tables came from, we might better understand the great story of tables.</p>
</section>
<section id="the-early-history-of-tables" class="level3">
<h3 class="anchored" data-anchor-id="the-early-history-of-tables">The early history of tables</h3>
<p>Tables emerged from square grids. When grids are made like this, you invariably generate containers that may hold some sort of information. The earliest known examples of grids go very far back in human history. Twenty-five thousand year old representations of the grid are found on the walls of the Lascaux and Niaux caves in France<sup>1</sup>.</p>
<p><img src="https://posit-dev.github.io/great-tables/blog/design-philosophy/cave_grids.png" class="img-fluid"></p>
<p style="font-size: 12px;">
Reproductions of early grids found on cave walls.
</p>
<p>In the second century BC, the Greek astronomer Hipparchus used latitude and longitude to locate celestial and terrestrial positions<sup>2</sup>. At around AD 150, Ptolmey published <em>Geographia</em>, which contains 25 geographical maps accompanied by methodologies for their construction using grids<sup>3</sup>. The Romans employed a grid system called <em>centuriation</em>, which can be described as land measurement (using surveyors’ instruments) to realize the formation of square grids using roads, canals, or agricultural plots<sup>4</sup>.</p>
<p>When agriculture became more widespread (ca. 10,000 years ago), there was the need to document and manage economic transactions to do with farming, livestock, and the division of labor. In the fourth millennium BC, Mesopotamian cities that traded with far way kingdoms needed to keep such records. Clay tablets recovered from the ancient Sumerian city of Uruk show early yet sophisticated tables. Here is a drawing of one of the recovered tablets, which contains an accounting of deliveries of barley and malt from two individuals for the production of beer<sup>5</sup>.</p>
<p><img src="https://posit-dev.github.io/great-tables/blog/design-philosophy/uruk_tablet_with_annotations.png" class="img-fluid"></p>
<p style="font-size: 12px;">
Drawing of clay tablet from Sumerian city of Uruk, circa 3200-3000 BC. Uruk III Tablet (MSVO 3, 51, Louvre Museum, Paris, France). Annotated with the meanings of the columns, rows, and cells.
</p>
<p>Note that the recovered tablet is meant to be read from right to left. Inside each box is an ideogram (a symbol that represented a word or idea) and a numerical value representing a quantity.</p>
<p>Its structure is where things get super interesting:</p>
<ul>
<li>Rows: there are roughly two rows, each corresponding to an individual.</li>
<li>Columns: the first two columns from the right contain counts of malt (rightmost column) and barley (second rightmost column).</li>
<li>Subtotals: the third column from the right sums barley and malt within each individual, and the left-most column displays the grand total.</li>
</ul>
<p>As a bonus, the table has a footer, since the bottom row contains the name of the official in charge.</p>
<p>Zooming ahead about a thousand years, you start to see more systematically structured tables. Here’s a photo of a cuneiform tablet that was originally from Mesopotamia (from the Temple of Enlil at Nippur, ca. 1850 BC)<sup>6</sup>, containing sources of revenue and monthly disbursements for 50 temple personnel.</p>
<p><img src="https://posit-dev.github.io/great-tables/blog/design-philosophy/nippur_cuneiform_tablet.png" class="img-fluid"></p>
<p style="font-size: 12px;">
Cuneiform tablet, temple of Enlil at Nippur, (CBS 3323, University of Pennsylvania).
</p>
<p>You can see right away that there is a more regular grid and, if you probe deeper, there are more similarities than differerences with the tables of today. While difficult to pick them out, the following table elements are present<sup>7</sup>:</p>
<ul>
<li>column headings (month names) and row titles (names/professions of individuals).</li>
<li>cells with no information (look at the blank or smooth cells along rows)</li>
<li>numerical values in the cells</li>
<li>subtotals for each individual every six months</li>
<li>grand totals</li>
<li>annotations with explanatory notes</li>
</ul>
<p>Later on, tables were less inscribed on clay and more on wax tablets, papyrus, and paper. The media have changed, writing technologies have changed, and the design and presentation of tables also went through changes.</p>
</section>
<section id="midcentury-modern-tables" class="level3">
<h3 class="anchored" data-anchor-id="midcentury-modern-tables">Midcentury modern tables</h3>
<p>Perhaps the best period for tables was around the middle of the 20th century. Technologies for table (and surrounding document) preparation included the offset printer, the typewriter, and varitype<sup>8</sup> (my favorite). The technologies were sufficiently advanced as to allow the precise typesetting of table elements. While of course constrained by the limited space available on pages, tabular design at this point had many workable solutions for fitting tables into single pages or dispersing the tabular content across multiple pages. The combination of advanced printing technology with advanced knowledge of tabular design resulted in <em>beautiful tables</em>.</p>
<p>There’s no greater embodiment of that pairing of technology and design than the <a href="https://www2.census.gov/library/publications/1949/general/tabular-presentation.pdf"><em>Manual of Tabular Presentation</em></a><sup>9</sup>, written and published by the United States Bureau of the Census. It is truly a remarkable work which goes into great detail on how the department imagines the ideal designs of information-rich tables. The work articulates the different parts of a table (and each part is given a descriptive name), sparing no detail when describing those different table parts in rigorous detail. Throughout its hundreds of pages, the authors make strong recommendations on what to do (and what <em>not</em> to do) for many tabulation scenarios. When poring over the tables visually depicted in the book, you can’t help but see that tables can both look really good <em>and</em> contain a density of information. The promise and the result is a balance of form and function.</p>
<p>We at <a href="https://github.com/posit-dev/great-tables"><strong>Great Tables</strong></a> borrow liberally from this work because many of its tabular design principles are just as good now as they were back then (and we’ll talk about what we took from that work in the next section). We’ll end this brief section with a visual montage of snippets from the <em>Census Manual</em>, which provides a glimpse of the sound advice on offer.</p>
<p><img src="https://posit-dev.github.io/great-tables/blog/design-philosophy/snippets_from_manual_tablular_presentation.png" class="img-fluid"></p>
<p style="font-size: 12px;">
Little nuggets of wisdom from the <em>Census Manual</em>. This may very well be the ultimate book on tabular design.
</p>
</section>
<section id="the-late-history-of-tables" class="level3">
<h3 class="anchored" data-anchor-id="the-late-history-of-tables">The late history of tables</h3>
<p>With computing technologies becoming more accessible by the 1970s and 1980s, people were able to generate tables in both electronic and print form. The democratization of computational tables arguably began with VisiCalc in 1979, a massive success that initiated the computing category of spreadsheeting software. There’s an undeniable advantage to having data analyzed and transformed in computing environments, but, this comes at a cost. This is what it looked like:</p>
<p><img src="https://posit-dev.github.io/great-tables/blog/design-philosophy/visicalc.png" class="img-fluid"></p>
<p style="font-size: 12px;">
This is a table in VisiCalc (earliest example of a table in a spreadsheet application). It’s pretty crude compared to the tables in print but the advantage here is that you can calculate values quickly.
</p>
<p>The grid cells couldn’t be styled with borders for presentation purposes, the values couldn’t be formatted, and the tables couldn’t even be printed. I mean, <a href="https://www.pcjs.org/software/pcx86/app/other/visicalc/1981/">try it out</a> and you’ll see that this is quite limited in more than a few ways.</p>
<p>Over time, and this took about 10-15 years, tables-within-spreadsheets got a little easier on the eyes. By the early 1990s, Excel could paint borders on your tables, better typographical support was available, and the formatting of values was fully-featured (though, <a href="https://www.cnet.com/tech/computing/prevent-excel-from-reformatting-two-numbers-to-a-date-and-month/">wonky</a>). Great! Problem solved, right? Not really.</p>
<p>While Excel tables from the last three decades looked much better than 1980s-spreadsheet-borne tables, they could never hold a candle to what was shown in the <em>Census Manual</em> (no matter how much of an Excel expert you became). Further to this, data analysis started to became a thing accomplished outside of Excel. One example of that is Python and its use inside Jupyter notebooks. We now have a bag of problematic scenarios</p>
<ul>
<li>all Python: analyze data and generate tables all in Python (bad tables)</li>
<li>all Excel: analyze data and make tables in Excel (less flexible analysis)</li>
<li>split-brained: analyze data in Python, copy over to Excel to make tables (not reproducible)</li>
</ul>
<p>All of these are suboptimal solutions. We propose that it is far better to do everything in Python: the data ingestion, the data analysis, and the data visualization. The visualization step is what’s done for plots and other types of graphics composed from data, it shouldn’t be any different when it comes to generating summary tables.</p>
</section>
<section id="approach-to-tables-taken-by-great-tables" class="level3">
<h3 class="anchored" data-anchor-id="approach-to-tables-taken-by-great-tables">Approach to tables taken by <strong>Great Tables</strong></h3>
<p><a href="https://github.com/posit-dev/great-tables"><strong>Great Tables</strong></a> restores the elegance of midcentury tables with the power of a coding interface. With <a href="https://github.com/posit-dev/great-tables"><strong>Great Tables</strong></a> anyone can make beautiful tables in Python. Our framework expresses a table as a combination of six independent components. With this framework, you can structure the table, format the values, and style the table. We firmly believe that the methods offered in the package enable people to construct a wide variety of useful tables that work across many disciplines.</p>
<p>You build with <a href="https://github.com/posit-dev/great-tables"><strong>Great Tables</strong></a> iteratively, starting off with your table body from code, adding styling, formatting and other components.&nbsp;Here is a schematic that outlines our terminology and depicts how the different table components are related to each other:</p>
<p><img src="https://posit-dev.github.io/great-tables/blog/design-philosophy/composition_of_a_table_in_GT.png" class="img-fluid"></p>
<p style="font-size: 12px;">
A schematic with the complete set of table components that can be utilized in <strong>Great Tables</strong>.
</p>
<p>Note the following six component pieces:</p>
<ul>
<li><strong>Table Header</strong>: a place for a title and subtitle, where you can succinctly describe the table content</li>
<li><strong>Column Labels</strong>: the column labels define the content of each column, and spanners are headings over groups of columns</li>
<li><strong>Stub Head</strong>: the ‘top-left’ location, where a label could be used in a variety of ways</li>
<li><strong>Row Stub</strong>: for row information, including row grouping labels</li>
<li><strong>Table Body</strong>: contains cells and so it’s where the data lives</li>
<li><strong>Table Footer</strong>: a place for additional information pertaining to the table content</li>
</ul>
<p>Here’s a table that takes advantage of the different components available in <a href="https://github.com/posit-dev/great-tables"><strong>Great Tables</strong></a>. It contains the names and addresses of people.</p>
<div id="e3d41268" class="cell" data-execution_count="2">
<details class="code-fold">
<summary>Show the code</summary>
<div class="code-copy-outer-scaffold"><div class="sourceCode cell-code" id="cb1" style="background: #f1f3f5;"><pre class="sourceCode python code-with-copy"><code class="sourceCode python"><span id="cb1-1"><span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">from</span> great_tables <span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">import</span> GT, md, system_fonts</span>
<span id="cb1-2"></span>
<span id="cb1-3">(</span>
<span id="cb1-4">    GT(simple_table, rowname_col<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Name"</span>)</span>
<span id="cb1-5">    .tab_header(title<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Names, Addresses, and Characteristics of Remote Correspondents"</span>)</span>
<span id="cb1-6">    .tab_stubhead(label<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>md(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"*Name*"</span>))</span>
<span id="cb1-7">    .tab_spanner(label<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Location"</span>, columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>[<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Address"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"City"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Postcode"</span>])</span>
<span id="cb1-8">    .tab_spanner(label<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Personal Characteristics"</span>, columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>[<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"DOB"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Height"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Weight"</span>])</span>
<span id="cb1-9">    .tab_source_note(source_note<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>md(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"**Data last updated**: December 18, 2022."</span>))</span>
<span id="cb1-10">    .fmt_date(columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"DOB"</span>, date_style<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"m_day_year"</span>)</span>
<span id="cb1-11">    .fmt_integer(columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Weight"</span>, pattern<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"</span><span class="sc" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">{x}</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;"> lbs"</span>)</span>
<span id="cb1-12">    .opt_stylize()</span>
<span id="cb1-13">    .opt_align_table_header(align<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"left"</span>)</span>
<span id="cb1-14">    .opt_vertical_padding(scale<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="fl" style="color: #AD0000;
background-color: null;
font-style: inherit;">0.75</span>)</span>
<span id="cb1-15">    .tab_options(</span>
<span id="cb1-16">        table_font_names<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>system_fonts(name<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"rounded-sans"</span>),</span>
<span id="cb1-17">        table_font_size<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"14px"</span>,</span>
<span id="cb1-18">    )</span>
<span id="cb1-19">)</span></code></pre></div></div>
</details>
<div class="cell-output cell-output-display" data-execution_count="2">
<div id="fsguktzdgg" style="padding-left:0px;padding-right:0px;padding-top:10px;padding-bottom:10px;overflow-x:auto;overflow-y:auto;width:auto;height:auto;">
<style>
#fsguktzdgg table {
          font-family: ui-rounded, 'Hiragino Maru Gothic ProN', Quicksand, Comfortaa, Manjari, 'Arial Rounded MT', 'Arial Rounded MT Bold', Calibri, source-sans-pro, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';
          -webkit-font-smoothing: antialiased;
          -moz-osx-font-smoothing: grayscale;
        }

#fsguktzdgg thead, tbody, tfoot, tr, td, th { border-style: none; }
 tr { background-color: transparent; }
#fsguktzdgg p { margin: 0; padding: 0; }
 #fsguktzdgg .gt_table { display: table; border-collapse: collapse; line-height: normal; margin-left: auto; margin-right: auto; color: #333333; font-size: 14px; font-weight: normal; font-style: normal; background-color: #FFFFFF; width: auto; border-top-style: solid; border-top-width: 2px; border-top-color: #004D80; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #004D80; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; }
 #fsguktzdgg .gt_caption { padding-top: 4px; padding-bottom: 4px; }
 #fsguktzdgg .gt_title { color: #333333; font-size: 125%; font-weight: initial; padding-top: 3px; padding-bottom: 3px; padding-left: 5px; padding-right: 5px; border-bottom-color: #FFFFFF; border-bottom-width: 0; }
 #fsguktzdgg .gt_subtitle { color: #333333; font-size: 85%; font-weight: initial; padding-top: 2px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; border-top-color: #FFFFFF; border-top-width: 0; }
 #fsguktzdgg .gt_heading { background-color: #FFFFFF; text-align: left; border-bottom-color: #FFFFFF; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #fsguktzdgg .gt_bottom_border { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #0076BA; }
 #fsguktzdgg .gt_col_headings { border-top-style: solid; border-top-width: 2px; border-top-color: #0076BA; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #0076BA; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #fsguktzdgg .gt_col_heading { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: bottom; padding-top: 3px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; overflow-x: hidden; }
 #fsguktzdgg .gt_column_spanner_outer { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; padding-top: 0; padding-bottom: 0; padding-left: 4px; padding-right: 4px; }
 #fsguktzdgg .gt_column_spanner_outer:first-child { padding-left: 0; }
 #fsguktzdgg .gt_column_spanner_outer:last-child { padding-right: 0; }
 #fsguktzdgg .gt_column_spanner { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #0076BA; vertical-align: bottom; padding-top: 3px; padding-bottom: 3px; overflow-x: hidden; display: inline-block; width: 100%; }
 #fsguktzdgg .gt_spanner_row { border-bottom-style: hidden; }
 #fsguktzdgg .gt_group_heading { padding-top: 6px; padding-bottom: 6px; padding-left: 5px; padding-right: 5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-top-style: solid; border-top-width: 2px; border-top-color: #0076BA; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #0076BA; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; text-align: left; }
 #fsguktzdgg .gt_empty_group_heading { padding: 0.5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; border-top-style: solid; border-top-width: 2px; border-top-color: #0076BA; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #0076BA; vertical-align: middle; }
 #fsguktzdgg .gt_from_md> :first-child { margin-top: 0; }
 #fsguktzdgg .gt_from_md> :last-child { margin-bottom: 0; }
 #fsguktzdgg .gt_row { padding-top: 6px; padding-bottom: 6px; padding-left: 5px; padding-right: 5px; margin: 10px; border-top-style: none; border-top-width: 1px; border-top-color: #89D3FE; border-left-style: none; border-left-width: 1px; border-left-color: #89D3FE; border-right-style: none; border-right-width: 1px; border-right-color: #89D3FE; vertical-align: middle; overflow-x: hidden; }
 #fsguktzdgg .gt_stub { color: #FFFFFF; background-color: #0076BA; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #0076BA; padding-left: 5px; padding-right: 5px; }
 #fsguktzdgg .gt_stub_row_group { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; vertical-align: top; }
 #fsguktzdgg .gt_row_group_first td { border-top-width: 2px; }
 #fsguktzdgg .gt_row_group_first th { border-top-width: 2px; }
 #fsguktzdgg .gt_striped { color: #333333; background-color: #F4F4F4; }
 #fsguktzdgg .gt_table_body { border-top-style: solid; border-top-width: 2px; border-top-color: #0076BA; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #0076BA; }
 #fsguktzdgg .gt_grand_summary_row { color: #333333; background-color: #89D3FE; text-transform: inherit; padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; }
 #fsguktzdgg .gt_first_grand_summary_row_bottom { border-top-style: double; border-top-width: 6px; border-top-color: #D3D3D3; }
 #fsguktzdgg .gt_last_grand_summary_row_top { border-bottom-style: double; border-bottom-width: 6px; border-bottom-color: #D3D3D3; }
 #fsguktzdgg .gt_sourcenotes { color: #333333; background-color: #FFFFFF; border-bottom-style: none; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; }
 #fsguktzdgg .gt_sourcenote { font-size: 90%; padding-top: 3px; padding-bottom: 3px; padding-left: 5px; padding-right: 5px; text-align: left; }
 #fsguktzdgg .gt_left { text-align: left; }
 #fsguktzdgg .gt_center { text-align: center; }
 #fsguktzdgg .gt_right { text-align: right; font-variant-numeric: tabular-nums; }
 #fsguktzdgg .gt_font_normal { font-weight: normal; }
 #fsguktzdgg .gt_font_bold { font-weight: bold; }
 #fsguktzdgg .gt_font_italic { font-style: italic; }
 #fsguktzdgg .gt_super { font-size: 65%; }
 #fsguktzdgg .gt_footnote_marks { font-size: 75%; vertical-align: 0.4em; position: initial; }
 #fsguktzdgg .gt_asterisk { font-size: 100%; vertical-align: 0; }
 
</style>
<table class="gt_table" data-quarto-disable-processing="false" data-quarto-bootstrap="false">
<thead>

  <tr class="gt_heading">
    <td colspan="7" class="gt_heading gt_title gt_font_normal">Names, Addresses, and Characteristics of Remote Correspondents</td>
  </tr>
<tr class="gt_col_headings gt_spanner_row">
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="2" colspan="1" scope="col" id="<em>Name</em>"><em>Name</em></th>
  <th class="gt_center gt_columns_top_border gt_column_spanner_outer" rowspan="1" colspan="3" scope="colgroup" id="Location">
    <span class="gt_column_spanner">Location</span>
  </th>
  <th class="gt_center gt_columns_top_border gt_column_spanner_outer" rowspan="1" colspan="3" scope="colgroup" id="Personal-Characteristics">
    <span class="gt_column_spanner">Personal Characteristics</span>
  </th>
</tr>
<tr class="gt_col_headings">
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="1" colspan="1" scope="col" id="Address">Address</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="1" colspan="1" scope="col" id="City">City</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="1" colspan="1" scope="col" id="Postcode">Postcode</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="1" colspan="1" scope="col" id="DOB">DOB</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="1" colspan="1" scope="col" id="Height">Height</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="Weight">Weight</th>
</tr>
</thead>
<tbody class="gt_table_body">
  <tr>
    <th class="gt_row gt_left gt_stub">Dustin B. Roach</th>
    <td class="gt_row gt_left">1183 Columbia Road</td>
    <td class="gt_row gt_left">Holly Oak, DE</td>
    <td class="gt_row gt_left">19809</td>
    <td class="gt_row gt_left">Sep 16, 1970</td>
    <td class="gt_row gt_left">5' 9"</td>
    <td class="gt_row gt_right">202 lbs</td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">Iwona Adamczyk</th>
    <td class="gt_row gt_left gt_striped">ul. Zabłudowska 133</td>
    <td class="gt_row gt_left gt_striped">Warszawa</td>
    <td class="gt_row gt_left gt_striped">04-788</td>
    <td class="gt_row gt_left gt_striped">Jan 3, 1976</td>
    <td class="gt_row gt_left gt_striped">5' 5"</td>
    <td class="gt_row gt_right gt_striped">124 lbs</td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">Geneviève Massé</th>
    <td class="gt_row gt_left">1415 rue Principale</td>
    <td class="gt_row gt_left">Amos, QC</td>
    <td class="gt_row gt_left">J9T 1E4</td>
    <td class="gt_row gt_left">Dec 8, 1967</td>
    <td class="gt_row gt_left">5' 3"</td>
    <td class="gt_row gt_right">136 lbs</td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">João Souza Lima</th>
    <td class="gt_row gt_left gt_striped">Rua Cosmorama, 538</td>
    <td class="gt_row gt_left gt_striped">São Paulo-SP</td>
    <td class="gt_row gt_left gt_striped">04648-080</td>
    <td class="gt_row gt_left gt_striped">Apr 21, 2001</td>
    <td class="gt_row gt_left gt_striped">6' 2"</td>
    <td class="gt_row gt_right gt_striped">231 lbs</td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">Maddison McCabe</th>
    <td class="gt_row gt_left">149 Raymond Street</td>
    <td class="gt_row gt_left">Strathern</td>
    <td class="gt_row gt_left">Invercargill 9812</td>
    <td class="gt_row gt_left">Mar 5, 1982</td>
    <td class="gt_row gt_left">5' 8"</td>
    <td class="gt_row gt_right">146 lbs</td>
  </tr>
</tbody>
  <tfoot class="gt_sourcenotes">
  
  <tr>
    <td class="gt_sourcenote" colspan="7"><strong>Data last updated</strong>: December 18, 2022.</td>
  </tr>

</tfoot>

</table>

</div>
</div>
</div>
<p style="font-size: 12px;">
A table of named individuals redone, <strong>Great Tables</strong> style!
</p>
<p>Notice that there is a blue row stub component that makes the row labels distinct from the body of the table. This is important because each person described forms a unique observation and we want to highlight the subject of each row. The heading provides context on what’s contained within the table. The two column spanners arrange the columns into sensible groupings (e.g., ‘Location’). The consistent use of blue lines and cell backgrounds gives the table a professional look.</p>
<p>If you look at the table code above you’ll see that every method for modifying the table starts with <code>tab_</code>. These particular methods are concerned with adding a table component (e.g., <code>tab_header()</code> creates a <strong>Table Header</strong>) and they’re designed to be easy and straightforward to use.</p>
<section id="formatting" class="level4">
<h4 class="anchored" data-anchor-id="formatting">Formatting</h4>
<p>Table structuring is important, but not the only thing. Tables in different disciplines have a certain set of display requirements specific for any values shown. Even something as simple as a number can be formatted in many different ways depending on a community’s norms and expectations. This extends to a very wide area when we consider that dates, times, and currencies also need to be formatted.</p>
<p>Depending on your display requirements, a raw value like 134,000 could presented as:</p>
<ul>
<li>scientific notation (<code>fmt_scientific()</code>): 1.34 × 10<sup style="font-size: 65%;">5</sup></li>
<li>a number in the German locale (<code>fmt_number()</code>): 134.000,00</li>
<li>a compact integer value (<code>fmt_integer()</code>): 134K</li>
</ul>
<p>The problem grows worse when values need to be conveyed as images or plots. If you’re a medical analyst, for example, you might need to effectively convey whether test results for a patient are improving or worsening over time. Reading such data as a sequence of numbers across a row can slow interpretation. But by using <em>nanoplots</em>, available as the <code>fmt_nanoplot()</code> formatting method, readers can spot trends right away. Here’s an example that provides test results over a series of days.</p>
<div id="e70403d2" class="cell" data-execution_count="3">
<details class="code-fold">
<summary>Show the code</summary>
<div class="code-copy-outer-scaffold"><div class="sourceCode cell-code" id="cb2" style="background: #f1f3f5;"><pre class="sourceCode python code-with-copy"><code class="sourceCode python"><span id="cb2-1"><span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">from</span> great_tables <span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">import</span> GT, md</span>
<span id="cb2-2"><span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">from</span> great_tables.data <span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">import</span> illness</span>
<span id="cb2-3"><span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">import</span> polars <span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">as</span> pl</span>
<span id="cb2-4"><span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">from</span> polars <span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">import</span> selectors <span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">as</span> cs</span>
<span id="cb2-5"></span>
<span id="cb2-6">illness_mini <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> (</span>
<span id="cb2-7">    pl.from_pandas(illness)</span>
<span id="cb2-8">    .head(<span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">10</span>)</span>
<span id="cb2-9">    .select(</span>
<span id="cb2-10">        <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"test"</span>, values<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>pl.concat_str(cs.starts_with(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"day"</span>), separator<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">" "</span>, ignore_nulls<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="va" style="color: #111111;
background-color: null;
font-style: inherit;">True</span>)</span>
<span id="cb2-11">    )</span>
<span id="cb2-12">    .<span class="bu" style="color: null;
background-color: null;
font-style: inherit;">slice</span>(<span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">1</span>, <span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">9</span>)</span>
<span id="cb2-13">)</span>
<span id="cb2-14"></span>
<span id="cb2-15">(</span>
<span id="cb2-16">    GT(illness_mini, rowname_col<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"test"</span>)</span>
<span id="cb2-17">    .fmt_nanoplot(columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"values"</span>)</span>
<span id="cb2-18">    .tab_header(md(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Partial summary of daily tests&lt;br&gt;performed on YF patient"</span>))</span>
<span id="cb2-19">    .tab_stubhead(label<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>md(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"**Test**"</span>))</span>
<span id="cb2-20">    .cols_label(values<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>md(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"*Progression*"</span>))</span>
<span id="cb2-21">    .cols_align(align<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"center"</span>, columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"values"</span>)</span>
<span id="cb2-22">    .tab_source_note(source_note<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Measurements from Day 3 through Day 9."</span>)</span>
<span id="cb2-23">)</span></code></pre></div></div>
</details>
<div class="cell-output cell-output-display" data-execution_count="3">
<div id="bpqpilsgwz" style="padding-left:0px;padding-right:0px;padding-top:10px;padding-bottom:10px;overflow-x:auto;overflow-y:auto;width:auto;height:auto;">
<style>
#bpqpilsgwz table {
          font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Helvetica Neue', 'Fira Sans', 'Droid Sans', Arial, sans-serif;
          -webkit-font-smoothing: antialiased;
          -moz-osx-font-smoothing: grayscale;
        }

#bpqpilsgwz thead, tbody, tfoot, tr, td, th { border-style: none; }
 tr { background-color: transparent; }
#bpqpilsgwz p { margin: 0; padding: 0; }
 #bpqpilsgwz .gt_table { display: table; border-collapse: collapse; line-height: normal; margin-left: auto; margin-right: auto; color: #333333; font-size: 16px; font-weight: normal; font-style: normal; background-color: #FFFFFF; width: auto; border-top-style: solid; border-top-width: 2px; border-top-color: #A8A8A8; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #A8A8A8; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; }
 #bpqpilsgwz .gt_caption { padding-top: 4px; padding-bottom: 4px; }
 #bpqpilsgwz .gt_title { color: #333333; font-size: 125%; font-weight: initial; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; border-bottom-color: #FFFFFF; border-bottom-width: 0; }
 #bpqpilsgwz .gt_subtitle { color: #333333; font-size: 85%; font-weight: initial; padding-top: 3px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; border-top-color: #FFFFFF; border-top-width: 0; }
 #bpqpilsgwz .gt_heading { background-color: #FFFFFF; text-align: center; border-bottom-color: #FFFFFF; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #bpqpilsgwz .gt_bottom_border { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #bpqpilsgwz .gt_col_headings { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #bpqpilsgwz .gt_col_heading { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; overflow-x: hidden; }
 #bpqpilsgwz .gt_column_spanner_outer { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; padding-top: 0; padding-bottom: 0; padding-left: 4px; padding-right: 4px; }
 #bpqpilsgwz .gt_column_spanner_outer:first-child { padding-left: 0; }
 #bpqpilsgwz .gt_column_spanner_outer:last-child { padding-right: 0; }
 #bpqpilsgwz .gt_column_spanner { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; overflow-x: hidden; display: inline-block; width: 100%; }
 #bpqpilsgwz .gt_spanner_row { border-bottom-style: hidden; }
 #bpqpilsgwz .gt_group_heading { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; text-align: left; }
 #bpqpilsgwz .gt_empty_group_heading { padding: 0.5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: middle; }
 #bpqpilsgwz .gt_from_md> :first-child { margin-top: 0; }
 #bpqpilsgwz .gt_from_md> :last-child { margin-bottom: 0; }
 #bpqpilsgwz .gt_row { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; margin: 10px; border-top-style: solid; border-top-width: 1px; border-top-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; overflow-x: hidden; }
 #bpqpilsgwz .gt_stub { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; }
 #bpqpilsgwz .gt_stub_row_group { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; vertical-align: top; }
 #bpqpilsgwz .gt_row_group_first td { border-top-width: 2px; }
 #bpqpilsgwz .gt_row_group_first th { border-top-width: 2px; }
 #bpqpilsgwz .gt_striped { color: #333333; background-color: #F4F4F4; }
 #bpqpilsgwz .gt_table_body { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #bpqpilsgwz .gt_grand_summary_row { color: #333333; background-color: #FFFFFF; text-transform: inherit; padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; }
 #bpqpilsgwz .gt_first_grand_summary_row_bottom { border-top-style: double; border-top-width: 6px; border-top-color: #D3D3D3; }
 #bpqpilsgwz .gt_last_grand_summary_row_top { border-bottom-style: double; border-bottom-width: 6px; border-bottom-color: #D3D3D3; }
 #bpqpilsgwz .gt_sourcenotes { color: #333333; background-color: #FFFFFF; border-bottom-style: none; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; }
 #bpqpilsgwz .gt_sourcenote { font-size: 90%; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; text-align: left; }
 #bpqpilsgwz .gt_left { text-align: left; }
 #bpqpilsgwz .gt_center { text-align: center; }
 #bpqpilsgwz .gt_right { text-align: right; font-variant-numeric: tabular-nums; }
 #bpqpilsgwz .gt_font_normal { font-weight: normal; }
 #bpqpilsgwz .gt_font_bold { font-weight: bold; }
 #bpqpilsgwz .gt_font_italic { font-style: italic; }
 #bpqpilsgwz .gt_super { font-size: 65%; }
 #bpqpilsgwz .gt_footnote_marks { font-size: 75%; vertical-align: 0.4em; position: initial; }
 #bpqpilsgwz .gt_asterisk { font-size: 100%; vertical-align: 0; }
 
</style>
<table class="gt_table" data-quarto-disable-processing="false" data-quarto-bootstrap="false">
<thead>

  <tr class="gt_heading">
    <td colspan="2" class="gt_heading gt_title gt_font_normal">Partial summary of daily tests<br>performed on YF patient</td>
  </tr>
<tr class="gt_col_headings">
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="1" colspan="1" scope="col" id="<strong>Test</strong>"><strong>Test</strong></th>
  <th class="gt_col_heading gt_columns_bottom_border gt_center" rowspan="1" colspan="1" scope="col" id="values"><em>Progression</em></th>
</tr>
</thead>
<tbody class="gt_table_body">
  <tr>
    <th class="gt_row gt_left gt_stub">WBC</th>
    <td class="gt_row gt_center"><div><svg viewbox="0 0 450 130" style="height: 2em; margin-left: auto; margin-right: auto; font-size: inherit; overflow: visible; vertical-align: middle; position:relative;"><defs><pattern id="area_pattern" width="8" height="8" patternunits="userSpaceOnUse"><path class="pattern-line" d="M 0,8 l 8,-8 M -1,1 l 4,-4 M 6,10 l 4,-4" stroke="#FF0000" stroke-width="1.5" stroke-linecap="round" shape-rendering="geometricPrecision"></path></pattern></defs><style> text { font-family: ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace; stroke-width: 0.15em; paint-order: stroke; stroke-linejoin: round; cursor: default; } .vert-line:hover rect { fill: #911EB4; fill-opacity: 40%; stroke: #FFFFFF60; color: red; } .vert-line:hover text { stroke: white; fill: #212427; } .horizontal-line:hover text {stroke: white; fill: #212427; } .ref-line:hover rect { stroke: #FFFFFF60; } .ref-line:hover line { stroke: #FF0000; } .ref-line:hover text { stroke: white; fill: #212427; } .y-axis-line:hover rect { fill: #EDEDED; fill-opacity: 60%; stroke: #FFFFFF60; color: red; } .y-axis-line:hover text { stroke: white; stroke-width: 0.20em; fill: #1A1C1F; } </style><path class="area-closed" d="M 50.0,111.15384615384616 108.33333333333333,115.0 166.66666666666666,93.23076923076924 225.0,91.03846153846155 283.3333333333333,36.11538461538463 341.6666666666667,15.0 400.0,58.192307692307686 400.0,125 50.0,125 Z" stroke="transparent" stroke-width="2" fill="url(#area_pattern)" fill-opacity="0.7"></path><path d="M 50.0,111.15384615384616 C 75.0,111.15384615384616 83.33333333333333,115.0 108.33333333333333,115.0 C 133.33333333333331,115.0 141.66666666666666,93.23076923076924 166.66666666666666,93.23076923076924 C 191.66666666666666,93.23076923076924 200.0,91.03846153846155 225.0,91.03846153846155 C 250.0,91.03846153846155 258.3333333333333,36.11538461538463 283.3333333333333,36.11538461538463 C 308.3333333333333,36.11538461538463 316.6666666666667,15.0 341.6666666666667,15.0 C 366.6666666666667,15.0 375.0,58.192307692307686 400.0,58.192307692307686" stroke="#4682B4" stroke-width="8" fill="none"></path><circle cx="50.0" cy="111.15384615384616" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="108.33333333333333" cy="115.0" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="166.66666666666666" cy="93.23076923076924" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="225.0" cy="91.03846153846155" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="283.3333333333333" cy="36.11538461538463" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="341.6666666666667" cy="15.0" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="400.0" cy="58.192307692307686" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><g class="y-axis-line"><rect x="0" y="0" width="65" height="130" stroke="transparent" stroke-width="0" fill="transparent"></rect><text x="0" y="19.0" fill="transparent" stroke="transparent" font-size="25">30.3</text><text x="0" y="126.0" fill="transparent" stroke="transparent" font-size="25">4.26</text></g><g class="vert-line"><rect x="40.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="60.0" y="20" fill="transparent" stroke="transparent" font-size="30px">5.26</text></g><g class="vert-line"><rect x="98.33333333333333" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="118.33333333333333" y="20" fill="transparent" stroke="transparent" font-size="30px">4.26</text></g><g class="vert-line"><rect x="156.66666666666666" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="176.66666666666666" y="20" fill="transparent" stroke="transparent" font-size="30px">9.92</text></g><g class="vert-line"><rect x="215.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="235.0" y="20" fill="transparent" stroke="transparent" font-size="30px">10.5</text></g><g class="vert-line"><rect x="273.3333333333333" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="293.3333333333333" y="20" fill="transparent" stroke="transparent" font-size="30px">24.8</text></g><g class="vert-line"><rect x="331.6666666666667" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="351.6666666666667" y="20" fill="transparent" stroke="transparent" font-size="30px">30.3</text></g><g class="vert-line"><rect x="390.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="410.0" y="20" fill="transparent" stroke="transparent" font-size="30px">19.0</text></g></svg></div></td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">Neutrophils</th>
    <td class="gt_row gt_center"><div><svg viewbox="0 0 450 130" style="height: 2em; margin-left: auto; margin-right: auto; font-size: inherit; overflow: visible; vertical-align: middle; position:relative;"><defs><pattern id="area_pattern" width="8" height="8" patternunits="userSpaceOnUse"><path class="pattern-line" d="M 0,8 l 8,-8 M -1,1 l 4,-4 M 6,10 l 4,-4" stroke="#FF0000" stroke-width="1.5" stroke-linecap="round" shape-rendering="geometricPrecision"></path></pattern></defs><style> text { font-family: ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace; stroke-width: 0.15em; paint-order: stroke; stroke-linejoin: round; cursor: default; } .vert-line:hover rect { fill: #911EB4; fill-opacity: 40%; stroke: #FFFFFF60; color: red; } .vert-line:hover text { stroke: white; fill: #212427; } .horizontal-line:hover text {stroke: white; fill: #212427; } .ref-line:hover rect { stroke: #FFFFFF60; } .ref-line:hover line { stroke: #FF0000; } .ref-line:hover text { stroke: white; fill: #212427; } .y-axis-line:hover rect { fill: #EDEDED; fill-opacity: 60%; stroke: #FFFFFF60; color: red; } .y-axis-line:hover text { stroke: white; stroke-width: 0.20em; fill: #1A1C1F; } </style><path class="area-closed" d="M 50.0,114.33184855233853 108.33333333333333,115.0 166.66666666666666,100.74610244988864 225.0,54.9109131403118 283.3333333333333,37.672605790645896 341.6666666666667,15.0 400.0,62.12694877505568 400.0,125 50.0,125 Z" stroke="transparent" stroke-width="2" fill="url(#area_pattern)" fill-opacity="0.7"></path><path d="M 50.0,114.33184855233853 C 75.0,114.33184855233853 83.33333333333333,115.0 108.33333333333333,115.0 C 133.33333333333331,115.0 141.66666666666666,100.74610244988864 166.66666666666666,100.74610244988864 C 191.66666666666666,100.74610244988864 200.0,54.9109131403118 225.0,54.9109131403118 C 250.0,54.9109131403118 258.3333333333333,37.672605790645896 283.3333333333333,37.672605790645896 C 308.3333333333333,37.672605790645896 316.6666666666667,15.0 341.6666666666667,15.0 C 366.6666666666667,15.0 375.0,62.12694877505568 400.0,62.12694877505568" stroke="#4682B4" stroke-width="8" fill="none"></path><circle cx="50.0" cy="114.33184855233853" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="108.33333333333333" cy="115.0" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="166.66666666666666" cy="100.74610244988864" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="225.0" cy="54.9109131403118" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="283.3333333333333" cy="37.672605790645896" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="341.6666666666667" cy="15.0" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="400.0" cy="62.12694877505568" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><g class="y-axis-line"><rect x="0" y="0" width="65" height="130" stroke="transparent" stroke-width="0" fill="transparent"></rect><text x="0" y="19.0" fill="transparent" stroke="transparent" font-size="25">27.2</text><text x="0" y="126.0" fill="transparent" stroke="transparent" font-size="25">4.72</text></g><g class="vert-line"><rect x="40.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="60.0" y="20" fill="transparent" stroke="transparent" font-size="30px">4.87</text></g><g class="vert-line"><rect x="98.33333333333333" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="118.33333333333333" y="20" fill="transparent" stroke="transparent" font-size="30px">4.72</text></g><g class="vert-line"><rect x="156.66666666666666" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="176.66666666666666" y="20" fill="transparent" stroke="transparent" font-size="30px">7.92</text></g><g class="vert-line"><rect x="215.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="235.0" y="20" fill="transparent" stroke="transparent" font-size="30px">18.2</text></g><g class="vert-line"><rect x="273.3333333333333" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="293.3333333333333" y="20" fill="transparent" stroke="transparent" font-size="30px">22.1</text></g><g class="vert-line"><rect x="331.6666666666667" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="351.6666666666667" y="20" fill="transparent" stroke="transparent" font-size="30px">27.2</text></g><g class="vert-line"><rect x="390.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="410.0" y="20" fill="transparent" stroke="transparent" font-size="30px">16.6</text></g></svg></div></td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">RBC</th>
    <td class="gt_row gt_center"><div><svg viewbox="0 0 450 130" style="height: 2em; margin-left: auto; margin-right: auto; font-size: inherit; overflow: visible; vertical-align: middle; position:relative;"><defs><pattern id="area_pattern" width="8" height="8" patternunits="userSpaceOnUse"><path class="pattern-line" d="M 0,8 l 8,-8 M -1,1 l 4,-4 M 6,10 l 4,-4" stroke="#FF0000" stroke-width="1.5" stroke-linecap="round" shape-rendering="geometricPrecision"></path></pattern></defs><style> text { font-family: ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace; stroke-width: 0.15em; paint-order: stroke; stroke-linejoin: round; cursor: default; } .vert-line:hover rect { fill: #911EB4; fill-opacity: 40%; stroke: #FFFFFF60; color: red; } .vert-line:hover text { stroke: white; fill: #212427; } .horizontal-line:hover text {stroke: white; fill: #212427; } .ref-line:hover rect { stroke: #FFFFFF60; } .ref-line:hover line { stroke: #FF0000; } .ref-line:hover text { stroke: white; fill: #212427; } .y-axis-line:hover rect { fill: #EDEDED; fill-opacity: 60%; stroke: #FFFFFF60; color: red; } .y-axis-line:hover text { stroke: white; stroke-width: 0.20em; fill: #1A1C1F; } </style><path class="area-closed" d="M 50.0,22.878787878787897 108.33333333333333,15.0 166.66666666666666,68.03030303030303 225.0,49.84848484848486 283.3333333333333,71.36363636363637 341.6666666666667,115.0 400.0,95.60606060606061 400.0,125 50.0,125 Z" stroke="transparent" stroke-width="2" fill="url(#area_pattern)" fill-opacity="0.7"></path><path d="M 50.0,22.878787878787897 C 75.0,22.878787878787897 83.33333333333333,15.0 108.33333333333333,15.0 C 133.33333333333331,15.0 141.66666666666666,68.03030303030303 166.66666666666666,68.03030303030303 C 191.66666666666666,68.03030303030303 200.0,49.84848484848486 225.0,49.84848484848486 C 250.0,49.84848484848486 258.3333333333333,71.36363636363637 283.3333333333333,71.36363636363637 C 308.3333333333333,71.36363636363637 316.6666666666667,115.0 341.6666666666667,115.0 C 366.6666666666667,115.0 375.0,95.60606060606061 400.0,95.60606060606061" stroke="#4682B4" stroke-width="8" fill="none"></path><circle cx="50.0" cy="22.878787878787897" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="108.33333333333333" cy="15.0" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="166.66666666666666" cy="68.03030303030303" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="225.0" cy="49.84848484848486" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="283.3333333333333" cy="71.36363636363637" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="341.6666666666667" cy="115.0" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="400.0" cy="95.60606060606061" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><g class="y-axis-line"><rect x="0" y="0" width="65" height="130" stroke="transparent" stroke-width="0" fill="transparent"></rect><text x="0" y="19.0" fill="transparent" stroke="transparent" font-size="25">5.98</text><text x="0" y="126.0" fill="transparent" stroke="transparent" font-size="25">2.68</text></g><g class="vert-line"><rect x="40.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="60.0" y="20" fill="transparent" stroke="transparent" font-size="30px">5.72</text></g><g class="vert-line"><rect x="98.33333333333333" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="118.33333333333333" y="20" fill="transparent" stroke="transparent" font-size="30px">5.98</text></g><g class="vert-line"><rect x="156.66666666666666" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="176.66666666666666" y="20" fill="transparent" stroke="transparent" font-size="30px">4.23</text></g><g class="vert-line"><rect x="215.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="235.0" y="20" fill="transparent" stroke="transparent" font-size="30px">4.83</text></g><g class="vert-line"><rect x="273.3333333333333" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="293.3333333333333" y="20" fill="transparent" stroke="transparent" font-size="30px">4.12</text></g><g class="vert-line"><rect x="331.6666666666667" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="351.6666666666667" y="20" fill="transparent" stroke="transparent" font-size="30px">2.68</text></g><g class="vert-line"><rect x="390.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="410.0" y="20" fill="transparent" stroke="transparent" font-size="30px">3.32</text></g></svg></div></td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">Hb</th>
    <td class="gt_row gt_center"><div><svg viewbox="0 0 450 130" style="height: 2em; margin-left: auto; margin-right: auto; font-size: inherit; overflow: visible; vertical-align: middle; position:relative;"><defs><pattern id="area_pattern" width="8" height="8" patternunits="userSpaceOnUse"><path class="pattern-line" d="M 0,8 l 8,-8 M -1,1 l 4,-4 M 6,10 l 4,-4" stroke="#FF0000" stroke-width="1.5" stroke-linecap="round" shape-rendering="geometricPrecision"></path></pattern></defs><style> text { font-family: ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace; stroke-width: 0.15em; paint-order: stroke; stroke-linejoin: round; cursor: default; } .vert-line:hover rect { fill: #911EB4; fill-opacity: 40%; stroke: #FFFFFF60; color: red; } .vert-line:hover text { stroke: white; fill: #212427; } .horizontal-line:hover text {stroke: white; fill: #212427; } .ref-line:hover rect { stroke: #FFFFFF60; } .ref-line:hover line { stroke: #FF0000; } .ref-line:hover text { stroke: white; fill: #212427; } .y-axis-line:hover rect { fill: #EDEDED; fill-opacity: 60%; stroke: #FFFFFF60; color: red; } .y-axis-line:hover text { stroke: white; stroke-width: 0.20em; fill: #1A1C1F; } </style><path class="area-closed" d="M 50.0,15.0 108.33333333333333,38.07692307692307 166.66666666666666,49.61538461538461 225.0,63.71794871794872 283.3333333333333,115.0 341.6666666666667,99.61538461538461 400.0,89.35897435897436 400.0,125 50.0,125 Z" stroke="transparent" stroke-width="2" fill="url(#area_pattern)" fill-opacity="0.7"></path><path d="M 50.0,15.0 C 75.0,15.0 83.33333333333333,38.07692307692307 108.33333333333333,38.07692307692307 C 133.33333333333331,38.07692307692307 141.66666666666666,49.61538461538461 166.66666666666666,49.61538461538461 C 191.66666666666666,49.61538461538461 200.0,63.71794871794872 225.0,63.71794871794872 C 250.0,63.71794871794872 258.3333333333333,115.0 283.3333333333333,115.0 C 308.3333333333333,115.0 316.6666666666667,99.61538461538461 341.6666666666667,99.61538461538461 C 366.6666666666667,99.61538461538461 375.0,89.35897435897436 400.0,89.35897435897436" stroke="#4682B4" stroke-width="8" fill="none"></path><circle cx="50.0" cy="15.0" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="108.33333333333333" cy="38.07692307692307" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="166.66666666666666" cy="49.61538461538461" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="225.0" cy="63.71794871794872" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="283.3333333333333" cy="115.0" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="341.6666666666667" cy="99.61538461538461" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="400.0" cy="89.35897435897436" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><g class="y-axis-line"><rect x="0" y="0" width="65" height="130" stroke="transparent" stroke-width="0" fill="transparent"></rect><text x="0" y="19.0" fill="transparent" stroke="transparent" font-size="25">153</text><text x="0" y="126.0" fill="transparent" stroke="transparent" font-size="25">75</text></g><g class="vert-line"><rect x="40.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="60.0" y="20" fill="transparent" stroke="transparent" font-size="30px">153</text></g><g class="vert-line"><rect x="98.33333333333333" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="118.33333333333333" y="20" fill="transparent" stroke="transparent" font-size="30px">135</text></g><g class="vert-line"><rect x="156.66666666666666" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="176.66666666666666" y="20" fill="transparent" stroke="transparent" font-size="30px">126</text></g><g class="vert-line"><rect x="215.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="235.0" y="20" fill="transparent" stroke="transparent" font-size="30px">115</text></g><g class="vert-line"><rect x="273.3333333333333" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="293.3333333333333" y="20" fill="transparent" stroke="transparent" font-size="30px">75</text></g><g class="vert-line"><rect x="331.6666666666667" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="351.6666666666667" y="20" fill="transparent" stroke="transparent" font-size="30px">87</text></g><g class="vert-line"><rect x="390.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="410.0" y="20" fill="transparent" stroke="transparent" font-size="30px">95</text></g></svg></div></td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">PLT</th>
    <td class="gt_row gt_center"><div><svg viewbox="0 0 450 130" style="height: 2em; margin-left: auto; margin-right: auto; font-size: inherit; overflow: visible; vertical-align: middle; position:relative;"><defs><pattern id="area_pattern" width="8" height="8" patternunits="userSpaceOnUse"><path class="pattern-line" d="M 0,8 l 8,-8 M -1,1 l 4,-4 M 6,10 l 4,-4" stroke="#FF0000" stroke-width="1.5" stroke-linecap="round" shape-rendering="geometricPrecision"></path></pattern></defs><style> text { font-family: ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace; stroke-width: 0.15em; paint-order: stroke; stroke-linejoin: round; cursor: default; } .vert-line:hover rect { fill: #911EB4; fill-opacity: 40%; stroke: #FFFFFF60; color: red; } .vert-line:hover text { stroke: white; fill: #212427; } .horizontal-line:hover text {stroke: white; fill: #212427; } .ref-line:hover rect { stroke: #FFFFFF60; } .ref-line:hover line { stroke: #FF0000; } .ref-line:hover text { stroke: white; fill: #212427; } .y-axis-line:hover rect { fill: #EDEDED; fill-opacity: 60%; stroke: #FFFFFF60; color: red; } .y-axis-line:hover text { stroke: white; stroke-width: 0.20em; fill: #1A1C1F; } </style><path class="area-closed" d="M 50.0,29.63917525773195 108.33333333333333,88.19587628865979 166.66666666666666,111.28865979381443 225.0,113.76288659793815 283.3333333333333,15.0 341.6666666666667,93.14432989690721 400.0,115.0 400.0,125 50.0,125 Z" stroke="transparent" stroke-width="2" fill="url(#area_pattern)" fill-opacity="0.7"></path><path d="M 50.0,29.63917525773195 C 75.0,29.63917525773195 83.33333333333333,88.19587628865979 108.33333333333333,88.19587628865979 C 133.33333333333331,88.19587628865979 141.66666666666666,111.28865979381443 166.66666666666666,111.28865979381443 C 191.66666666666666,111.28865979381443 200.0,113.76288659793815 225.0,113.76288659793815 C 250.0,113.76288659793815 258.3333333333333,15.0 283.3333333333333,15.0 C 308.3333333333333,15.0 316.6666666666667,93.14432989690721 341.6666666666667,93.14432989690721 C 366.6666666666667,93.14432989690721 375.0,115.0 400.0,115.0" stroke="#4682B4" stroke-width="8" fill="none"></path><circle cx="50.0" cy="29.63917525773195" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="108.33333333333333" cy="88.19587628865979" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="166.66666666666666" cy="111.28865979381443" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="225.0" cy="113.76288659793815" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="283.3333333333333" cy="15.0" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="341.6666666666667" cy="93.14432989690721" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="400.0" cy="115.0" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><g class="y-axis-line"><rect x="0" y="0" width="65" height="130" stroke="transparent" stroke-width="0" fill="transparent"></rect><text x="0" y="19.0" fill="transparent" stroke="transparent" font-size="25">74.1</text><text x="0" y="126.0" fill="transparent" stroke="transparent" font-size="25">25.6</text></g><g class="vert-line"><rect x="40.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="60.0" y="20" fill="transparent" stroke="transparent" font-size="30px">67.0</text></g><g class="vert-line"><rect x="98.33333333333333" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="118.33333333333333" y="20" fill="transparent" stroke="transparent" font-size="30px">38.6</text></g><g class="vert-line"><rect x="156.66666666666666" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="176.66666666666666" y="20" fill="transparent" stroke="transparent" font-size="30px">27.4</text></g><g class="vert-line"><rect x="215.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="235.0" y="20" fill="transparent" stroke="transparent" font-size="30px">26.2</text></g><g class="vert-line"><rect x="273.3333333333333" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="293.3333333333333" y="20" fill="transparent" stroke="transparent" font-size="30px">74.1</text></g><g class="vert-line"><rect x="331.6666666666667" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="351.6666666666667" y="20" fill="transparent" stroke="transparent" font-size="30px">36.2</text></g><g class="vert-line"><rect x="390.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="410.0" y="20" fill="transparent" stroke="transparent" font-size="30px">25.6</text></g></svg></div></td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">ALT</th>
    <td class="gt_row gt_center"><div><svg viewbox="0 0 450 130" style="height: 2em; margin-left: auto; margin-right: auto; font-size: inherit; overflow: visible; vertical-align: middle; position:relative;"><defs><pattern id="area_pattern" width="8" height="8" patternunits="userSpaceOnUse"><path class="pattern-line" d="M 0,8 l 8,-8 M -1,1 l 4,-4 M 6,10 l 4,-4" stroke="#FF0000" stroke-width="1.5" stroke-linecap="round" shape-rendering="geometricPrecision"></path></pattern></defs><style> text { font-family: ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace; stroke-width: 0.15em; paint-order: stroke; stroke-linejoin: round; cursor: default; } .vert-line:hover rect { fill: #911EB4; fill-opacity: 40%; stroke: #FFFFFF60; color: red; } .vert-line:hover text { stroke: white; fill: #212427; } .horizontal-line:hover text {stroke: white; fill: #212427; } .ref-line:hover rect { stroke: #FFFFFF60; } .ref-line:hover line { stroke: #FF0000; } .ref-line:hover text { stroke: white; fill: #212427; } .y-axis-line:hover rect { fill: #EDEDED; fill-opacity: 60%; stroke: #FFFFFF60; color: red; } .y-axis-line:hover text { stroke: white; stroke-width: 0.20em; fill: #1A1C1F; } </style><path class="area-closed" d="M 50.0,15.0 108.33333333333333,16.647379611445633 166.66666666666666,67.00444711343386 225.0,84.56243000665444 283.3333333333333,105.9816110236476 341.6666666666667,113.6999496859429 400.0,115.0 400.0,125 50.0,125 Z" stroke="transparent" stroke-width="2" fill="url(#area_pattern)" fill-opacity="0.7"></path><path d="M 50.0,15.0 C 75.0,15.0 83.33333333333333,16.647379611445633 108.33333333333333,16.647379611445633 C 133.33333333333331,16.647379611445633 141.66666666666666,67.00444711343386 166.66666666666666,67.00444711343386 C 191.66666666666666,67.00444711343386 200.0,84.56243000665444 225.0,84.56243000665444 C 250.0,84.56243000665444 258.3333333333333,105.9816110236476 283.3333333333333,105.9816110236476 C 308.3333333333333,105.9816110236476 316.6666666666667,113.6999496859429 341.6666666666667,113.6999496859429 C 366.6666666666667,113.6999496859429 375.0,115.0 400.0,115.0" stroke="#4682B4" stroke-width="8" fill="none"></path><circle cx="50.0" cy="15.0" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="108.33333333333333" cy="16.647379611445633" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="166.66666666666666" cy="67.00444711343386" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="225.0" cy="84.56243000665444" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="283.3333333333333" cy="105.9816110236476" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="341.6666666666667" cy="113.6999496859429" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="400.0" cy="115.0" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><g class="y-axis-line"><rect x="0" y="0" width="65" height="130" stroke="transparent" stroke-width="0" fill="transparent"></rect><text x="0" y="19.0" fill="transparent" stroke="transparent" font-size="25">12.8K</text><text x="0" y="126.0" fill="transparent" stroke="transparent" font-size="25">512</text></g><g class="vert-line"><rect x="40.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="60.0" y="20" fill="transparent" stroke="transparent" font-size="30px">12.8K</text></g><g class="vert-line"><rect x="98.33333333333333" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="118.33333333333333" y="20" fill="transparent" stroke="transparent" font-size="30px">12.6K</text></g><g class="vert-line"><rect x="156.66666666666666" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="176.66666666666666" y="20" fill="transparent" stroke="transparent" font-size="30px">6.43K</text></g><g class="vert-line"><rect x="215.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="235.0" y="20" fill="transparent" stroke="transparent" font-size="30px">4.26K</text></g><g class="vert-line"><rect x="273.3333333333333" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="293.3333333333333" y="20" fill="transparent" stroke="transparent" font-size="30px">1.62K</text></g><g class="vert-line"><rect x="331.6666666666667" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="351.6666666666667" y="20" fill="transparent" stroke="transparent" font-size="30px">673</text></g><g class="vert-line"><rect x="390.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="410.0" y="20" fill="transparent" stroke="transparent" font-size="30px">512</text></g></svg></div></td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">AST</th>
    <td class="gt_row gt_center"><div><svg viewbox="0 0 450 130" style="height: 2em; margin-left: auto; margin-right: auto; font-size: inherit; overflow: visible; vertical-align: middle; position:relative;"><defs><pattern id="area_pattern" width="8" height="8" patternunits="userSpaceOnUse"><path class="pattern-line" d="M 0,8 l 8,-8 M -1,1 l 4,-4 M 6,10 l 4,-4" stroke="#FF0000" stroke-width="1.5" stroke-linecap="round" shape-rendering="geometricPrecision"></path></pattern></defs><style> text { font-family: ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace; stroke-width: 0.15em; paint-order: stroke; stroke-linejoin: round; cursor: default; } .vert-line:hover rect { fill: #911EB4; fill-opacity: 40%; stroke: #FFFFFF60; color: red; } .vert-line:hover text { stroke: white; fill: #212427; } .horizontal-line:hover text {stroke: white; fill: #212427; } .ref-line:hover rect { stroke: #FFFFFF60; } .ref-line:hover line { stroke: #FF0000; } .ref-line:hover text { stroke: white; fill: #212427; } .y-axis-line:hover rect { fill: #EDEDED; fill-opacity: 60%; stroke: #FFFFFF60; color: red; } .y-axis-line:hover text { stroke: white; stroke-width: 0.20em; fill: #1A1C1F; } </style><path class="area-closed" d="M 50.0,15.0 108.33333333333333,25.065750671705366 166.66666666666666,54.06594726839817 225.0,80.4492234430634 283.3333333333333,108.85526114594029 341.6666666666667,113.41630441905677 400.0,115.0 400.0,125 50.0,125 Z" stroke="transparent" stroke-width="2" fill="url(#area_pattern)" fill-opacity="0.7"></path><path d="M 50.0,15.0 C 75.0,15.0 83.33333333333333,25.065750671705366 108.33333333333333,25.065750671705366 C 133.33333333333331,25.065750671705366 141.66666666666666,54.06594726839817 166.66666666666666,54.06594726839817 C 191.66666666666666,54.06594726839817 200.0,80.4492234430634 225.0,80.4492234430634 C 250.0,80.4492234430634 258.3333333333333,108.85526114594029 283.3333333333333,108.85526114594029 C 308.3333333333333,108.85526114594029 316.6666666666667,113.41630441905677 341.6666666666667,113.41630441905677 C 366.6666666666667,113.41630441905677 375.0,115.0 400.0,115.0" stroke="#4682B4" stroke-width="8" fill="none"></path><circle cx="50.0" cy="15.0" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="108.33333333333333" cy="25.065750671705366" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="166.66666666666666" cy="54.06594726839817" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="225.0" cy="80.4492234430634" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="283.3333333333333" cy="108.85526114594029" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="341.6666666666667" cy="113.41630441905677" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="400.0" cy="115.0" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><g class="y-axis-line"><rect x="0" y="0" width="65" height="130" stroke="transparent" stroke-width="0" fill="transparent"></rect><text x="0" y="19.0" fill="transparent" stroke="transparent" font-size="25">23.7K</text><text x="0" y="126.0" fill="transparent" stroke="transparent" font-size="25">782</text></g><g class="vert-line"><rect x="40.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="60.0" y="20" fill="transparent" stroke="transparent" font-size="30px">23.7K</text></g><g class="vert-line"><rect x="98.33333333333333" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="118.33333333333333" y="20" fill="transparent" stroke="transparent" font-size="30px">21.4K</text></g><g class="vert-line"><rect x="156.66666666666666" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="176.66666666666666" y="20" fill="transparent" stroke="transparent" font-size="30px">14.7K</text></g><g class="vert-line"><rect x="215.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="235.0" y="20" fill="transparent" stroke="transparent" font-size="30px">8.69K</text></g><g class="vert-line"><rect x="273.3333333333333" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="293.3333333333333" y="20" fill="transparent" stroke="transparent" font-size="30px">2.19K</text></g><g class="vert-line"><rect x="331.6666666666667" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="351.6666666666667" y="20" fill="transparent" stroke="transparent" font-size="30px">1.14K</text></g><g class="vert-line"><rect x="390.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="410.0" y="20" fill="transparent" stroke="transparent" font-size="30px">782</text></g></svg></div></td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">TBIL</th>
    <td class="gt_row gt_center"><div><svg viewbox="0 0 450 130" style="height: 2em; margin-left: auto; margin-right: auto; font-size: inherit; overflow: visible; vertical-align: middle; position:relative;"><defs><pattern id="area_pattern" width="8" height="8" patternunits="userSpaceOnUse"><path class="pattern-line" d="M 0,8 l 8,-8 M -1,1 l 4,-4 M 6,10 l 4,-4" stroke="#FF0000" stroke-width="1.5" stroke-linecap="round" shape-rendering="geometricPrecision"></path></pattern></defs><style> text { font-family: ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace; stroke-width: 0.15em; paint-order: stroke; stroke-linejoin: round; cursor: default; } .vert-line:hover rect { fill: #911EB4; fill-opacity: 40%; stroke: #FFFFFF60; color: red; } .vert-line:hover text { stroke: white; fill: #212427; } .horizontal-line:hover text {stroke: white; fill: #212427; } .ref-line:hover rect { stroke: #FFFFFF60; } .ref-line:hover line { stroke: #FF0000; } .ref-line:hover text { stroke: white; fill: #212427; } .y-axis-line:hover rect { fill: #EDEDED; fill-opacity: 60%; stroke: #FFFFFF60; color: red; } .y-axis-line:hover text { stroke: white; stroke-width: 0.20em; fill: #1A1C1F; } </style><path class="area-closed" d="M 50.0,94.17383820998278 108.33333333333333,48.39070567986228 166.66666666666666,59.75043029259898 225.0,23.777969018932865 283.3333333333333,76.79001721170395 341.6666666666667,115.0 400.0,15.0 400.0,125 50.0,125 Z" stroke="transparent" stroke-width="2" fill="url(#area_pattern)" fill-opacity="0.7"></path><path d="M 50.0,94.17383820998278 C 75.0,94.17383820998278 83.33333333333333,48.39070567986228 108.33333333333333,48.39070567986228 C 133.33333333333331,48.39070567986228 141.66666666666666,59.75043029259898 166.66666666666666,59.75043029259898 C 191.66666666666666,59.75043029259898 200.0,23.777969018932865 225.0,23.777969018932865 C 250.0,23.777969018932865 258.3333333333333,76.79001721170395 283.3333333333333,76.79001721170395 C 308.3333333333333,76.79001721170395 316.6666666666667,115.0 341.6666666666667,115.0 C 366.6666666666667,115.0 375.0,15.0 400.0,15.0" stroke="#4682B4" stroke-width="8" fill="none"></path><circle cx="50.0" cy="94.17383820998278" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="108.33333333333333" cy="48.39070567986228" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="166.66666666666666" cy="59.75043029259898" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="225.0" cy="23.777969018932865" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="283.3333333333333" cy="76.79001721170395" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="341.6666666666667" cy="115.0" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="400.0" cy="15.0" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><g class="y-axis-line"><rect x="0" y="0" width="65" height="130" stroke="transparent" stroke-width="0" fill="transparent"></rect><text x="0" y="19.0" fill="transparent" stroke="transparent" font-size="25">163</text><text x="0" y="126.0" fill="transparent" stroke="transparent" font-size="25">105</text></g><g class="vert-line"><rect x="40.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="60.0" y="20" fill="transparent" stroke="transparent" font-size="30px">117</text></g><g class="vert-line"><rect x="98.33333333333333" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="118.33333333333333" y="20" fill="transparent" stroke="transparent" font-size="30px">144</text></g><g class="vert-line"><rect x="156.66666666666666" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="176.66666666666666" y="20" fill="transparent" stroke="transparent" font-size="30px">137</text></g><g class="vert-line"><rect x="215.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="235.0" y="20" fill="transparent" stroke="transparent" font-size="30px">158</text></g><g class="vert-line"><rect x="273.3333333333333" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="293.3333333333333" y="20" fill="transparent" stroke="transparent" font-size="30px">127</text></g><g class="vert-line"><rect x="331.6666666666667" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="351.6666666666667" y="20" fill="transparent" stroke="transparent" font-size="30px">105</text></g><g class="vert-line"><rect x="390.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="410.0" y="20" fill="transparent" stroke="transparent" font-size="30px">163</text></g></svg></div></td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">DBIL</th>
    <td class="gt_row gt_center"><div><svg viewbox="0 0 450 130" style="height: 2em; margin-left: auto; margin-right: auto; font-size: inherit; overflow: visible; vertical-align: middle; position:relative;"><defs><pattern id="area_pattern" width="8" height="8" patternunits="userSpaceOnUse"><path class="pattern-line" d="M 0,8 l 8,-8 M -1,1 l 4,-4 M 6,10 l 4,-4" stroke="#FF0000" stroke-width="1.5" stroke-linecap="round" shape-rendering="geometricPrecision"></path></pattern></defs><style> text { font-family: ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace; stroke-width: 0.15em; paint-order: stroke; stroke-linejoin: round; cursor: default; } .vert-line:hover rect { fill: #911EB4; fill-opacity: 40%; stroke: #FFFFFF60; color: red; } .vert-line:hover text { stroke: white; fill: #212427; } .horizontal-line:hover text {stroke: white; fill: #212427; } .ref-line:hover rect { stroke: #FFFFFF60; } .ref-line:hover line { stroke: #FF0000; } .ref-line:hover text { stroke: white; fill: #212427; } .y-axis-line:hover rect { fill: #EDEDED; fill-opacity: 60%; stroke: #FFFFFF60; color: red; } .y-axis-line:hover text { stroke: white; stroke-width: 0.20em; fill: #1A1C1F; } </style><path class="area-closed" d="M 50.0,115.0 108.33333333333333,69.20689655172416 166.66666666666666,83.00000000000001 225.0,15.0 283.3333333333333,51.00000000000001 341.6666666666667,98.17241379310346 400.0,39.27586206896552 400.0,125 50.0,125 Z" stroke="transparent" stroke-width="2" fill="url(#area_pattern)" fill-opacity="0.7"></path><path d="M 50.0,115.0 C 75.0,115.0 83.33333333333333,69.20689655172416 108.33333333333333,69.20689655172416 C 133.33333333333331,69.20689655172416 141.66666666666666,83.00000000000001 166.66666666666666,83.00000000000001 C 191.66666666666666,83.00000000000001 200.0,15.0 225.0,15.0 C 250.0,15.0 258.3333333333333,51.00000000000001 283.3333333333333,51.00000000000001 C 308.3333333333333,51.00000000000001 316.6666666666667,98.17241379310346 341.6666666666667,98.17241379310346 C 366.6666666666667,98.17241379310346 375.0,39.27586206896552 400.0,39.27586206896552" stroke="#4682B4" stroke-width="8" fill="none"></path><circle cx="50.0" cy="115.0" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="108.33333333333333" cy="69.20689655172416" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="166.66666666666666" cy="83.00000000000001" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="225.0" cy="15.0" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="283.3333333333333" cy="51.00000000000001" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="341.6666666666667" cy="98.17241379310346" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="400.0" cy="39.27586206896552" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><g class="y-axis-line"><rect x="0" y="0" width="65" height="130" stroke="transparent" stroke-width="0" fill="transparent"></rect><text x="0" y="19.0" fill="transparent" stroke="transparent" font-size="25">144</text><text x="0" y="126.0" fill="transparent" stroke="transparent" font-size="25">71.4</text></g><g class="vert-line"><rect x="40.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="60.0" y="20" fill="transparent" stroke="transparent" font-size="30px">71.4</text></g><g class="vert-line"><rect x="98.33333333333333" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="118.33333333333333" y="20" fill="transparent" stroke="transparent" font-size="30px">105</text></g><g class="vert-line"><rect x="156.66666666666666" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="176.66666666666666" y="20" fill="transparent" stroke="transparent" font-size="30px">94.6</text></g><g class="vert-line"><rect x="215.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="235.0" y="20" fill="transparent" stroke="transparent" font-size="30px">144</text></g><g class="vert-line"><rect x="273.3333333333333" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="293.3333333333333" y="20" fill="transparent" stroke="transparent" font-size="30px">118</text></g><g class="vert-line"><rect x="331.6666666666667" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="351.6666666666667" y="20" fill="transparent" stroke="transparent" font-size="30px">83.6</text></g><g class="vert-line"><rect x="390.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="410.0" y="20" fill="transparent" stroke="transparent" font-size="30px">126</text></g></svg></div></td>
  </tr>
</tbody>
  <tfoot class="gt_sourcenotes">
  
  <tr>
    <td class="gt_sourcenote" colspan="2">Measurements from Day 3 through Day 9.</td>
  </tr>

</tfoot>

</table>

</div>
</div>
</div>
<p>Notice that if you hover over the data points, you still get values for each of the days. We designed nanoplots to be stripped down plotting visualizations that balance the quick visual interpretation of a plot against the compactness of a table.</p>
<p><a href="https://github.com/posit-dev/great-tables"><strong>Great Tables</strong></a> contains a lot of functionality for formatting. If you peeked at the code in the above table displays you might have noticed there are methods beginning with <code>fmt_</code> (i.e., <code>fmt_date()</code>, <code>fmt_integer()</code>, <code>fmt_nanoplot()</code>). We want to make many formatting methods available to serve different users’ needs. We also want them to be easy to use, but with many useful options to provide flexibility for all your formatting tasks.</p>
</section>
<section id="great-tables-is-focused-on-display" class="level4">
<h4 class="anchored" data-anchor-id="great-tables-is-focused-on-display">Great Tables is focused on display</h4>
<p>There are myriad ways that people interact with tables. <a href="https://github.com/posit-dev/great-tables"><strong>Great Tables</strong></a> is focused on the display of tables for publication and presentation. If you’re analyzing data in a database, you might want a simple table display that offers controls to navigate and filter hundreds, thousands, maybe even more records. And that is great for those situations.</p>
<p>The publication of results is a entirely different task, and the emphasis here is on structuring, formatting, and styling. We believe that beautiful table displays should do the following:</p>
<ul>
<li>make information easier to digest</li>
<li>provide extra context wherever needed</li>
<li>adhere to the style of the document or of the organization</li>
</ul>
<p>We wanted to help the type of user that wanted to present data in this way. This is typically what you see in journal articles, in books, and in reports. We think the area of static summary tables deserves it’s own focus. This class of tables can look <em>great</em> and we offer various <code>opt_*()</code> methods in the <a href="https://github.com/posit-dev/great-tables"><strong>Great Tables</strong></a> API so it’s that much easier to provide a great table to your readers.</p>
</section>
</section>
<section id="in-conclusion" class="level3">
<h3 class="anchored" data-anchor-id="in-conclusion">In conclusion</h3>
<p>Tables have come a long way and we’ve learned a lot from our continued research in tabular design. We hope to make the <a href="https://github.com/posit-dev/great-tables"><strong>Great Tables</strong></a> package useful for your generation of summary tables. Given there’s ample room for innovation in this area, we’ll keep plugging away at doing that work to improve the API. We measure success by the quality of the tables the package is able to produce and we always keep that goal top of mind.</p>
<p>We’re very excited about where things are going with <a href="https://github.com/posit-dev/great-tables"><strong>Great Tables</strong></a> and we genuinely appreciate community feedback. If ever you want to talk tables with us, you’re always welcome to jump into our <a href="https://discord.com/invite/Ux7nrcXHVV">Discord Server</a> and drop us a line!</p>
<p>Many thanks to Curtis Kephart and <a href="https://anthonywbaker.com">Anthony Baker</a> for providing helpful advice when writing this article.</p>


</section>


<div id="quarto-appendix" class="default"><section id="footnotes" class="footnotes footnotes-end-of-document"><h2 class="anchored quarto-appendix-heading">Footnotes</h2>

<ol>
<li id="fn1"><p>Taylor, B. (2021). Lunar timekeeping in Upper Paleolithic Cave Art. <em>PRAEHISTORIA New Series</em>, <em>3</em>(13), 215–232.↩︎</p></li>
<li id="fn2"><p>Duke, D. W. (2002). Hipparchus’ Coordinate System. <em>Archive for History of Exact Sciences</em>, <em>56</em>(5), 427-433.↩︎</p></li>
<li id="fn3"><p><a href="https://en.wikipedia.org/wiki/Geography_(Ptolemy)" class="uri">https://en.wikipedia.org/wiki/Geography_(Ptolemy)</a>↩︎</p></li>
<li id="fn4"><p>Palet, J. M. and Orengo, H. A., The Roman Centuriated Landscape: Conception, Genesis, and Development as Inferred from the Ager Tarraconensis Case. <em>American Journal of Archaeology</em>, <em>115</em>(3), 383-402.↩︎</p></li>
<li id="fn5"><p>Marchese, F. T., Exploring the Origins of Tables for Information Visualization. <em>Proceedings of the 2011 15th International Conference on Information Visualisation</em>, 13-15 July 2011, doi:10.1109/IV.2011.36.↩︎</p></li>
<li id="fn6"><p>M. W. Green, The construction and implementation of the cuneiform writing system, <em>Visible Writing</em>, <em>15</em>, 1981, 345-72.↩︎</p></li>
<li id="fn7"><p>Robson, E., “Tables and tabular formatting in Sumer, Babylonia, and Assyria, 2500-50 BCE” in M. Campbell-Kelly, M. Croarken, R.G. Flood, and E. Robson (eds.), <em>The History of Mathematical Tables from Sumer to Spreadsheets</em>. Oxford: Oxford University Press, 2003, 18–47.↩︎</p></li>
<li id="fn8"><p><a href="https://site.xavier.edu/polt/typewriters/varityper.html" class="uri">https://site.xavier.edu/polt/typewriters/varityper.html</a>↩︎</p></li>
<li id="fn9"><p>Manual of Tabular Presentation: An Outline of Theory and Practice in the Presentation of Statistical Data in Tables for Publication. United States. Bureau of the Census. U.S. Government Printing Office, 1949. Resource available at: <a href="https://www2.census.gov/library/publications/1949/general/tabular-presentation.pdf" class="uri">https://www2.census.gov/library/publications/1949/general/tabular-presentation.pdf</a>.↩︎</p></li>
</ol>
</section></div> ]]></description>
  <guid>https://posit-dev.github.io/great-tables/blog/design-philosophy/</guid>
  <pubDate>Thu, 04 Apr 2024 00:00:00 GMT</pubDate>
</item>
<item>
  <title>Great Tables v0.4.0: Nanoplots and More</title>
  <dc:creator>Rich Iannone</dc:creator>
  <link>https://posit-dev.github.io/great-tables/blog/introduction-0.4.0/</link>
  <description><![CDATA[ 




<p>The recent <code>v0.4.0</code> release of <strong>Great Tables</strong> contains nanoplots as a major new feature. So, in this post I’ll concentrate on showing you all the things you can do with nanoplots. What are nanoplots? Well, with nanoplots you can do this:</p>
<div id="d8375d4c" class="cell" data-execution_count="1">
<details class="code-fold">
<summary>Show the code</summary>
<div class="code-copy-outer-scaffold"><div class="sourceCode cell-code" id="cb1" style="background: #f1f3f5;"><pre class="sourceCode python code-with-copy"><code class="sourceCode python"><span id="cb1-1"><span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">from</span> great_tables <span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">import</span> GT, md</span>
<span id="cb1-2"><span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">from</span> great_tables.data <span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">import</span> illness</span>
<span id="cb1-3"><span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">import</span> polars <span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">as</span> pl</span>
<span id="cb1-4"></span>
<span id="cb1-5">illness_mini <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> (</span>
<span id="cb1-6">    pl.from_pandas(illness)</span>
<span id="cb1-7">    .head(<span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">10</span>)</span>
<span id="cb1-8">    .select(</span>
<span id="cb1-9">        <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"test"</span>, values<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>pl.concat_str(pl.exclude(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"test"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"units"</span>), separator<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">" "</span>, ignore_nulls<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="va" style="color: #111111;
background-color: null;
font-style: inherit;">True</span>)</span>
<span id="cb1-10">    )</span>
<span id="cb1-11">    .<span class="bu" style="color: null;
background-color: null;
font-style: inherit;">slice</span>(<span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">1</span>, <span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">9</span>)</span>
<span id="cb1-12">)</span>
<span id="cb1-13"></span>
<span id="cb1-14">(</span>
<span id="cb1-15">    GT(illness_mini, rowname_col<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"test"</span>)</span>
<span id="cb1-16">    .fmt_nanoplot(columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"values"</span>)</span>
<span id="cb1-17">    .tab_header(md(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Partial summary of daily tests&lt;br&gt;performed on YF patient"</span>))</span>
<span id="cb1-18">    .tab_stubhead(label<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>md(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"**Test**"</span>))</span>
<span id="cb1-19">    .cols_label(values<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>md(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"*Progression*"</span>))</span>
<span id="cb1-20">    .cols_align(align<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"center"</span>, columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"values"</span>)</span>
<span id="cb1-21">    .tab_source_note(source_note<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Measurements from Day 3 through to Day 8."</span>)</span>
<span id="cb1-22">)</span></code></pre></div></div>
</details>
<div class="cell-output cell-output-display" data-execution_count="1">
<div id="wurjyhhpmi" style="padding-left:0px;padding-right:0px;padding-top:10px;padding-bottom:10px;overflow-x:auto;overflow-y:auto;width:auto;height:auto;">
<style>
#wurjyhhpmi table {
          font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Helvetica Neue', 'Fira Sans', 'Droid Sans', Arial, sans-serif;
          -webkit-font-smoothing: antialiased;
          -moz-osx-font-smoothing: grayscale;
        }

#wurjyhhpmi thead, tbody, tfoot, tr, td, th { border-style: none; }
 tr { background-color: transparent; }
#wurjyhhpmi p { margin: 0; padding: 0; }
 #wurjyhhpmi .gt_table { display: table; border-collapse: collapse; line-height: normal; margin-left: auto; margin-right: auto; color: #333333; font-size: 16px; font-weight: normal; font-style: normal; background-color: #FFFFFF; width: auto; border-top-style: solid; border-top-width: 2px; border-top-color: #A8A8A8; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #A8A8A8; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; }
 #wurjyhhpmi .gt_caption { padding-top: 4px; padding-bottom: 4px; }
 #wurjyhhpmi .gt_title { color: #333333; font-size: 125%; font-weight: initial; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; border-bottom-color: #FFFFFF; border-bottom-width: 0; }
 #wurjyhhpmi .gt_subtitle { color: #333333; font-size: 85%; font-weight: initial; padding-top: 3px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; border-top-color: #FFFFFF; border-top-width: 0; }
 #wurjyhhpmi .gt_heading { background-color: #FFFFFF; text-align: center; border-bottom-color: #FFFFFF; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #wurjyhhpmi .gt_bottom_border { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #wurjyhhpmi .gt_col_headings { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #wurjyhhpmi .gt_col_heading { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; overflow-x: hidden; }
 #wurjyhhpmi .gt_column_spanner_outer { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; padding-top: 0; padding-bottom: 0; padding-left: 4px; padding-right: 4px; }
 #wurjyhhpmi .gt_column_spanner_outer:first-child { padding-left: 0; }
 #wurjyhhpmi .gt_column_spanner_outer:last-child { padding-right: 0; }
 #wurjyhhpmi .gt_column_spanner { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; overflow-x: hidden; display: inline-block; width: 100%; }
 #wurjyhhpmi .gt_spanner_row { border-bottom-style: hidden; }
 #wurjyhhpmi .gt_group_heading { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; text-align: left; }
 #wurjyhhpmi .gt_empty_group_heading { padding: 0.5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: middle; }
 #wurjyhhpmi .gt_from_md> :first-child { margin-top: 0; }
 #wurjyhhpmi .gt_from_md> :last-child { margin-bottom: 0; }
 #wurjyhhpmi .gt_row { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; margin: 10px; border-top-style: solid; border-top-width: 1px; border-top-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; overflow-x: hidden; }
 #wurjyhhpmi .gt_stub { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; }
 #wurjyhhpmi .gt_stub_row_group { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; vertical-align: top; }
 #wurjyhhpmi .gt_row_group_first td { border-top-width: 2px; }
 #wurjyhhpmi .gt_row_group_first th { border-top-width: 2px; }
 #wurjyhhpmi .gt_striped { color: #333333; background-color: #F4F4F4; }
 #wurjyhhpmi .gt_table_body { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #wurjyhhpmi .gt_grand_summary_row { color: #333333; background-color: #FFFFFF; text-transform: inherit; padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; }
 #wurjyhhpmi .gt_first_grand_summary_row_bottom { border-top-style: double; border-top-width: 6px; border-top-color: #D3D3D3; }
 #wurjyhhpmi .gt_last_grand_summary_row_top { border-bottom-style: double; border-bottom-width: 6px; border-bottom-color: #D3D3D3; }
 #wurjyhhpmi .gt_sourcenotes { color: #333333; background-color: #FFFFFF; border-bottom-style: none; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; }
 #wurjyhhpmi .gt_sourcenote { font-size: 90%; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; text-align: left; }
 #wurjyhhpmi .gt_left { text-align: left; }
 #wurjyhhpmi .gt_center { text-align: center; }
 #wurjyhhpmi .gt_right { text-align: right; font-variant-numeric: tabular-nums; }
 #wurjyhhpmi .gt_font_normal { font-weight: normal; }
 #wurjyhhpmi .gt_font_bold { font-weight: bold; }
 #wurjyhhpmi .gt_font_italic { font-style: italic; }
 #wurjyhhpmi .gt_super { font-size: 65%; }
 #wurjyhhpmi .gt_footnote_marks { font-size: 75%; vertical-align: 0.4em; position: initial; }
 #wurjyhhpmi .gt_asterisk { font-size: 100%; vertical-align: 0; }
 
</style>
<table class="gt_table" data-quarto-disable-processing="false" data-quarto-bootstrap="false">
<thead>

  <tr class="gt_heading">
    <td colspan="2" class="gt_heading gt_title gt_font_normal">Partial summary of daily tests<br>performed on YF patient</td>
  </tr>
<tr class="gt_col_headings">
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="1" colspan="1" scope="col" id="<strong>Test</strong>"><strong>Test</strong></th>
  <th class="gt_col_heading gt_columns_bottom_border gt_center" rowspan="1" colspan="1" scope="col" id="values"><em>Progression</em></th>
</tr>
</thead>
<tbody class="gt_table_body">
  <tr>
    <th class="gt_row gt_left gt_stub">WBC</th>
    <td class="gt_row gt_center"><div><svg viewbox="0 0 550 130" style="height: 2em; margin-left: auto; margin-right: auto; font-size: inherit; overflow: visible; vertical-align: middle; position:relative;"><defs><pattern id="area_pattern" width="8" height="8" patternunits="userSpaceOnUse"><path class="pattern-line" d="M 0,8 l 8,-8 M -1,1 l 4,-4 M 6,10 l 4,-4" stroke="#FF0000" stroke-width="1.5" stroke-linecap="round" shape-rendering="geometricPrecision"></path></pattern></defs><style> text { font-family: ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace; stroke-width: 0.15em; paint-order: stroke; stroke-linejoin: round; cursor: default; } .vert-line:hover rect { fill: #911EB4; fill-opacity: 40%; stroke: #FFFFFF60; color: red; } .vert-line:hover text { stroke: white; fill: #212427; } .horizontal-line:hover text {stroke: white; fill: #212427; } .ref-line:hover rect { stroke: #FFFFFF60; } .ref-line:hover line { stroke: #FF0000; } .ref-line:hover text { stroke: white; fill: #212427; } .y-axis-line:hover rect { fill: #EDEDED; fill-opacity: 60%; stroke: #FFFFFF60; color: red; } .y-axis-line:hover text { stroke: white; stroke-width: 0.20em; fill: #1A1C1F; } </style><path class="area-closed" d="M 50.0,110.2018278750952 106.25,114.00990099009901 162.5,92.45620715917745 218.75,90.28560548362529 275.0,35.90632140137091 331.25,15.0 387.5,57.76466108149276 443.75,115.0 500.0,92.15156130997715 500.0,125 50.0,125 Z" stroke="transparent" stroke-width="2" fill="url(#area_pattern)" fill-opacity="0.7"></path><path d="M 50.0,110.2018278750952 C 75.0,110.2018278750952 81.25,114.00990099009901 106.25,114.00990099009901 C 131.25,114.00990099009901 137.5,92.45620715917745 162.5,92.45620715917745 C 187.5,92.45620715917745 193.75,90.28560548362529 218.75,90.28560548362529 C 243.75,90.28560548362529 250.0,35.90632140137091 275.0,35.90632140137091 C 300.0,35.90632140137091 306.25,15.0 331.25,15.0 C 356.25,15.0 362.5,57.76466108149276 387.5,57.76466108149276 C 412.5,57.76466108149276 418.75,115.0 443.75,115.0 C 468.75,115.0 475.0,92.15156130997715 500.0,92.15156130997715" stroke="#4682B4" stroke-width="8" fill="none"></path><circle cx="50.0" cy="110.2018278750952" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="106.25" cy="114.00990099009901" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="162.5" cy="92.45620715917745" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="218.75" cy="90.28560548362529" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="275.0" cy="35.90632140137091" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="331.25" cy="15.0" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="387.5" cy="57.76466108149276" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="443.75" cy="115.0" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="500.0" cy="92.15156130997715" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><g class="y-axis-line"><rect x="0" y="0" width="65" height="130" stroke="transparent" stroke-width="0" fill="transparent"></rect><text x="0" y="19.0" fill="transparent" stroke="transparent" font-size="25">30.3</text><text x="0" y="126.0" fill="transparent" stroke="transparent" font-size="25">4.00</text></g><g class="vert-line"><rect x="40.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="60.0" y="20" fill="transparent" stroke="transparent" font-size="30px">5.26</text></g><g class="vert-line"><rect x="96.25" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="116.25" y="20" fill="transparent" stroke="transparent" font-size="30px">4.26</text></g><g class="vert-line"><rect x="152.5" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="172.5" y="20" fill="transparent" stroke="transparent" font-size="30px">9.92</text></g><g class="vert-line"><rect x="208.75" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="228.75" y="20" fill="transparent" stroke="transparent" font-size="30px">10.5</text></g><g class="vert-line"><rect x="265.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="285.0" y="20" fill="transparent" stroke="transparent" font-size="30px">24.8</text></g><g class="vert-line"><rect x="321.25" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="341.25" y="20" fill="transparent" stroke="transparent" font-size="30px">30.3</text></g><g class="vert-line"><rect x="377.5" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="397.5" y="20" fill="transparent" stroke="transparent" font-size="30px">19.0</text></g><g class="vert-line"><rect x="433.75" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="453.75" y="20" fill="transparent" stroke="transparent" font-size="30px">4.00</text></g><g class="vert-line"><rect x="490.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="510.0" y="20" fill="transparent" stroke="transparent" font-size="30px">10.0</text></g></svg></div></td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">Neutrophils</th>
    <td class="gt_row gt_center"><div><svg viewbox="0 0 550 130" style="height: 2em; margin-left: auto; margin-right: auto; font-size: inherit; overflow: visible; vertical-align: middle; position:relative;"><defs><pattern id="area_pattern" width="8" height="8" patternunits="userSpaceOnUse"><path class="pattern-line" d="M 0,8 l 8,-8 M -1,1 l 4,-4 M 6,10 l 4,-4" stroke="#FF0000" stroke-width="1.5" stroke-linecap="round" shape-rendering="geometricPrecision"></path></pattern></defs><style> text { font-family: ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace; stroke-width: 0.15em; paint-order: stroke; stroke-linejoin: round; cursor: default; } .vert-line:hover rect { fill: #911EB4; fill-opacity: 40%; stroke: #FFFFFF60; color: red; } .vert-line:hover text { stroke: white; fill: #212427; } .horizontal-line:hover text {stroke: white; fill: #212427; } .ref-line:hover rect { stroke: #FFFFFF60; } .ref-line:hover line { stroke: #FF0000; } .ref-line:hover text { stroke: white; fill: #212427; } .y-axis-line:hover rect { fill: #EDEDED; fill-opacity: 60%; stroke: #FFFFFF60; color: red; } .y-axis-line:hover text { stroke: white; stroke-width: 0.20em; fill: #1A1C1F; } </style><path class="area-closed" d="M 50.0,103.59753675009932 106.25,104.19348430671434 162.5,91.47993643226063 218.75,50.59793404847041 275.0,35.22248708780295 331.25,15.0 387.5,57.034167659912605 443.75,115.0 500.0,91.16209773539929 500.0,125 50.0,125 Z" stroke="transparent" stroke-width="2" fill="url(#area_pattern)" fill-opacity="0.7"></path><path d="M 50.0,103.59753675009932 C 75.0,103.59753675009932 81.25,104.19348430671434 106.25,104.19348430671434 C 131.25,104.19348430671434 137.5,91.47993643226063 162.5,91.47993643226063 C 187.5,91.47993643226063 193.75,50.59793404847041 218.75,50.59793404847041 C 243.75,50.59793404847041 250.0,35.22248708780295 275.0,35.22248708780295 C 300.0,35.22248708780295 306.25,15.0 331.25,15.0 C 356.25,15.0 362.5,57.034167659912605 387.5,57.034167659912605 C 412.5,57.034167659912605 418.75,115.0 443.75,115.0 C 468.75,115.0 475.0,91.16209773539929 500.0,91.16209773539929" stroke="#4682B4" stroke-width="8" fill="none"></path><circle cx="50.0" cy="103.59753675009932" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="106.25" cy="104.19348430671434" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="162.5" cy="91.47993643226063" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="218.75" cy="50.59793404847041" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="275.0" cy="35.22248708780295" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="331.25" cy="15.0" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="387.5" cy="57.034167659912605" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="443.75" cy="115.0" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="500.0" cy="91.16209773539929" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><g class="y-axis-line"><rect x="0" y="0" width="65" height="130" stroke="transparent" stroke-width="0" fill="transparent"></rect><text x="0" y="19.0" fill="transparent" stroke="transparent" font-size="25">27.2</text><text x="0" y="126.0" fill="transparent" stroke="transparent" font-size="25">2.00</text></g><g class="vert-line"><rect x="40.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="60.0" y="20" fill="transparent" stroke="transparent" font-size="30px">4.87</text></g><g class="vert-line"><rect x="96.25" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="116.25" y="20" fill="transparent" stroke="transparent" font-size="30px">4.72</text></g><g class="vert-line"><rect x="152.5" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="172.5" y="20" fill="transparent" stroke="transparent" font-size="30px">7.92</text></g><g class="vert-line"><rect x="208.75" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="228.75" y="20" fill="transparent" stroke="transparent" font-size="30px">18.2</text></g><g class="vert-line"><rect x="265.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="285.0" y="20" fill="transparent" stroke="transparent" font-size="30px">22.1</text></g><g class="vert-line"><rect x="321.25" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="341.25" y="20" fill="transparent" stroke="transparent" font-size="30px">27.2</text></g><g class="vert-line"><rect x="377.5" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="397.5" y="20" fill="transparent" stroke="transparent" font-size="30px">16.6</text></g><g class="vert-line"><rect x="433.75" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="453.75" y="20" fill="transparent" stroke="transparent" font-size="30px">2.00</text></g><g class="vert-line"><rect x="490.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="510.0" y="20" fill="transparent" stroke="transparent" font-size="30px">8.00</text></g></svg></div></td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">RBC</th>
    <td class="gt_row gt_center"><div><svg viewbox="0 0 550 130" style="height: 2em; margin-left: auto; margin-right: auto; font-size: inherit; overflow: visible; vertical-align: middle; position:relative;"><defs><pattern id="area_pattern" width="8" height="8" patternunits="userSpaceOnUse"><path class="pattern-line" d="M 0,8 l 8,-8 M -1,1 l 4,-4 M 6,10 l 4,-4" stroke="#FF0000" stroke-width="1.5" stroke-linecap="round" shape-rendering="geometricPrecision"></path></pattern></defs><style> text { font-family: ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace; stroke-width: 0.15em; paint-order: stroke; stroke-linejoin: round; cursor: default; } .vert-line:hover rect { fill: #911EB4; fill-opacity: 40%; stroke: #FFFFFF60; color: red; } .vert-line:hover text { stroke: white; fill: #212427; } .horizontal-line:hover text {stroke: white; fill: #212427; } .ref-line:hover rect { stroke: #FFFFFF60; } .ref-line:hover line { stroke: #FF0000; } .ref-line:hover text { stroke: white; fill: #212427; } .y-axis-line:hover rect { fill: #EDEDED; fill-opacity: 60%; stroke: #FFFFFF60; color: red; } .y-axis-line:hover text { stroke: white; stroke-width: 0.20em; fill: #1A1C1F; } </style><path class="area-closed" d="M 50.0,22.878787878787897 106.25,15.0 162.5,68.03030303030303 218.75,49.84848484848486 275.0,71.36363636363637 331.25,115.0 387.5,95.60606060606061 443.75,75.0 500.0,29.54545454545456 500.0,125 50.0,125 Z" stroke="transparent" stroke-width="2" fill="url(#area_pattern)" fill-opacity="0.7"></path><path d="M 50.0,22.878787878787897 C 75.0,22.878787878787897 81.25,15.0 106.25,15.0 C 131.25,15.0 137.5,68.03030303030303 162.5,68.03030303030303 C 187.5,68.03030303030303 193.75,49.84848484848486 218.75,49.84848484848486 C 243.75,49.84848484848486 250.0,71.36363636363637 275.0,71.36363636363637 C 300.0,71.36363636363637 306.25,115.0 331.25,115.0 C 356.25,115.0 362.5,95.60606060606061 387.5,95.60606060606061 C 412.5,95.60606060606061 418.75,75.0 443.75,75.0 C 468.75,75.0 475.0,29.54545454545456 500.0,29.54545454545456" stroke="#4682B4" stroke-width="8" fill="none"></path><circle cx="50.0" cy="22.878787878787897" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="106.25" cy="15.0" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="162.5" cy="68.03030303030303" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="218.75" cy="49.84848484848486" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="275.0" cy="71.36363636363637" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="331.25" cy="115.0" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="387.5" cy="95.60606060606061" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="443.75" cy="75.0" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="500.0" cy="29.54545454545456" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><g class="y-axis-line"><rect x="0" y="0" width="65" height="130" stroke="transparent" stroke-width="0" fill="transparent"></rect><text x="0" y="19.0" fill="transparent" stroke="transparent" font-size="25">5.98</text><text x="0" y="126.0" fill="transparent" stroke="transparent" font-size="25">2.68</text></g><g class="vert-line"><rect x="40.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="60.0" y="20" fill="transparent" stroke="transparent" font-size="30px">5.72</text></g><g class="vert-line"><rect x="96.25" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="116.25" y="20" fill="transparent" stroke="transparent" font-size="30px">5.98</text></g><g class="vert-line"><rect x="152.5" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="172.5" y="20" fill="transparent" stroke="transparent" font-size="30px">4.23</text></g><g class="vert-line"><rect x="208.75" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="228.75" y="20" fill="transparent" stroke="transparent" font-size="30px">4.83</text></g><g class="vert-line"><rect x="265.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="285.0" y="20" fill="transparent" stroke="transparent" font-size="30px">4.12</text></g><g class="vert-line"><rect x="321.25" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="341.25" y="20" fill="transparent" stroke="transparent" font-size="30px">2.68</text></g><g class="vert-line"><rect x="377.5" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="397.5" y="20" fill="transparent" stroke="transparent" font-size="30px">3.32</text></g><g class="vert-line"><rect x="433.75" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="453.75" y="20" fill="transparent" stroke="transparent" font-size="30px">4.00</text></g><g class="vert-line"><rect x="490.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="510.0" y="20" fill="transparent" stroke="transparent" font-size="30px">5.50</text></g></svg></div></td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">Hb</th>
    <td class="gt_row gt_center"><div><svg viewbox="0 0 550 130" style="height: 2em; margin-left: auto; margin-right: auto; font-size: inherit; overflow: visible; vertical-align: middle; position:relative;"><defs><pattern id="area_pattern" width="8" height="8" patternunits="userSpaceOnUse"><path class="pattern-line" d="M 0,8 l 8,-8 M -1,1 l 4,-4 M 6,10 l 4,-4" stroke="#FF0000" stroke-width="1.5" stroke-linecap="round" shape-rendering="geometricPrecision"></path></pattern></defs><style> text { font-family: ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace; stroke-width: 0.15em; paint-order: stroke; stroke-linejoin: round; cursor: default; } .vert-line:hover rect { fill: #911EB4; fill-opacity: 40%; stroke: #FFFFFF60; color: red; } .vert-line:hover text { stroke: white; fill: #212427; } .horizontal-line:hover text {stroke: white; fill: #212427; } .ref-line:hover rect { stroke: #FFFFFF60; } .ref-line:hover line { stroke: #FF0000; } .ref-line:hover text { stroke: white; fill: #212427; } .y-axis-line:hover rect { fill: #EDEDED; fill-opacity: 60%; stroke: #FFFFFF60; color: red; } .y-axis-line:hover text { stroke: white; stroke-width: 0.20em; fill: #1A1C1F; } </style><path class="area-closed" d="M 50.0,23.235294117647065 106.25,44.41176470588235 162.5,55.0 218.75,67.94117647058823 275.0,115.0 331.25,100.88235294117648 387.5,91.47058823529412 443.75,62.05882352941176 500.0,15.0 500.0,125 50.0,125 Z" stroke="transparent" stroke-width="2" fill="url(#area_pattern)" fill-opacity="0.7"></path><path d="M 50.0,23.235294117647065 C 75.0,23.235294117647065 81.25,44.41176470588235 106.25,44.41176470588235 C 131.25,44.41176470588235 137.5,55.0 162.5,55.0 C 187.5,55.0 193.75,67.94117647058823 218.75,67.94117647058823 C 243.75,67.94117647058823 250.0,115.0 275.0,115.0 C 300.0,115.0 306.25,100.88235294117648 331.25,100.88235294117648 C 356.25,100.88235294117648 362.5,91.47058823529412 387.5,91.47058823529412 C 412.5,91.47058823529412 418.75,62.05882352941176 443.75,62.05882352941176 C 468.75,62.05882352941176 475.0,15.0 500.0,15.0" stroke="#4682B4" stroke-width="8" fill="none"></path><circle cx="50.0" cy="23.235294117647065" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="106.25" cy="44.41176470588235" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="162.5" cy="55.0" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="218.75" cy="67.94117647058823" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="275.0" cy="115.0" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="331.25" cy="100.88235294117648" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="387.5" cy="91.47058823529412" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="443.75" cy="62.05882352941176" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="500.0" cy="15.0" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><g class="y-axis-line"><rect x="0" y="0" width="65" height="130" stroke="transparent" stroke-width="0" fill="transparent"></rect><text x="0" y="19.0" fill="transparent" stroke="transparent" font-size="25">160</text><text x="0" y="126.0" fill="transparent" stroke="transparent" font-size="25">75</text></g><g class="vert-line"><rect x="40.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="60.0" y="20" fill="transparent" stroke="transparent" font-size="30px">153</text></g><g class="vert-line"><rect x="96.25" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="116.25" y="20" fill="transparent" stroke="transparent" font-size="30px">135</text></g><g class="vert-line"><rect x="152.5" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="172.5" y="20" fill="transparent" stroke="transparent" font-size="30px">126</text></g><g class="vert-line"><rect x="208.75" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="228.75" y="20" fill="transparent" stroke="transparent" font-size="30px">115</text></g><g class="vert-line"><rect x="265.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="285.0" y="20" fill="transparent" stroke="transparent" font-size="30px">75</text></g><g class="vert-line"><rect x="321.25" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="341.25" y="20" fill="transparent" stroke="transparent" font-size="30px">87</text></g><g class="vert-line"><rect x="377.5" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="397.5" y="20" fill="transparent" stroke="transparent" font-size="30px">95</text></g><g class="vert-line"><rect x="433.75" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="453.75" y="20" fill="transparent" stroke="transparent" font-size="30px">120</text></g><g class="vert-line"><rect x="490.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="510.0" y="20" fill="transparent" stroke="transparent" font-size="30px">160</text></g></svg></div></td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">PLT</th>
    <td class="gt_row gt_center"><div><svg viewbox="0 0 550 130" style="height: 2em; margin-left: auto; margin-right: auto; font-size: inherit; overflow: visible; vertical-align: middle; position:relative;"><defs><pattern id="area_pattern" width="8" height="8" patternunits="userSpaceOnUse"><path class="pattern-line" d="M 0,8 l 8,-8 M -1,1 l 4,-4 M 6,10 l 4,-4" stroke="#FF0000" stroke-width="1.5" stroke-linecap="round" shape-rendering="geometricPrecision"></path></pattern></defs><style> text { font-family: ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace; stroke-width: 0.15em; paint-order: stroke; stroke-linejoin: round; cursor: default; } .vert-line:hover rect { fill: #911EB4; fill-opacity: 40%; stroke: #FFFFFF60; color: red; } .vert-line:hover text { stroke: white; fill: #212427; } .horizontal-line:hover text {stroke: white; fill: #212427; } .ref-line:hover rect { stroke: #FFFFFF60; } .ref-line:hover line { stroke: #FF0000; } .ref-line:hover text { stroke: white; fill: #212427; } .y-axis-line:hover rect { fill: #EDEDED; fill-opacity: 60%; stroke: #FFFFFF60; color: red; } .y-axis-line:hover text { stroke: white; stroke-width: 0.20em; fill: #1A1C1F; } </style><path class="area-closed" d="M 50.0,99.9125364431487 106.25,110.26239067055393 162.5,114.34402332361516 218.75,114.78134110787173 275.0,97.32507288629738 331.25,111.13702623906705 387.5,115.0 443.75,87.8862973760933 500.0,15.0 500.0,125 50.0,125 Z" stroke="transparent" stroke-width="2" fill="url(#area_pattern)" fill-opacity="0.7"></path><path d="M 50.0,99.9125364431487 C 75.0,99.9125364431487 81.25,110.26239067055393 106.25,110.26239067055393 C 131.25,110.26239067055393 137.5,114.34402332361516 162.5,114.34402332361516 C 187.5,114.34402332361516 193.75,114.78134110787173 218.75,114.78134110787173 C 243.75,114.78134110787173 250.0,97.32507288629738 275.0,97.32507288629738 C 300.0,97.32507288629738 306.25,111.13702623906705 331.25,111.13702623906705 C 356.25,111.13702623906705 362.5,115.0 387.5,115.0 C 412.5,115.0 418.75,87.8862973760933 443.75,87.8862973760933 C 468.75,87.8862973760933 475.0,15.0 500.0,15.0" stroke="#4682B4" stroke-width="8" fill="none"></path><circle cx="50.0" cy="99.9125364431487" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="106.25" cy="110.26239067055393" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="162.5" cy="114.34402332361516" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="218.75" cy="114.78134110787173" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="275.0" cy="97.32507288629738" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="331.25" cy="111.13702623906705" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="387.5" cy="115.0" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="443.75" cy="87.8862973760933" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="500.0" cy="15.0" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><g class="y-axis-line"><rect x="0" y="0" width="65" height="130" stroke="transparent" stroke-width="0" fill="transparent"></rect><text x="0" y="19.0" fill="transparent" stroke="transparent" font-size="25">300</text><text x="0" y="126.0" fill="transparent" stroke="transparent" font-size="25">25.6</text></g><g class="vert-line"><rect x="40.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="60.0" y="20" fill="transparent" stroke="transparent" font-size="30px">67.0</text></g><g class="vert-line"><rect x="96.25" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="116.25" y="20" fill="transparent" stroke="transparent" font-size="30px">38.6</text></g><g class="vert-line"><rect x="152.5" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="172.5" y="20" fill="transparent" stroke="transparent" font-size="30px">27.4</text></g><g class="vert-line"><rect x="208.75" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="228.75" y="20" fill="transparent" stroke="transparent" font-size="30px">26.2</text></g><g class="vert-line"><rect x="265.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="285.0" y="20" fill="transparent" stroke="transparent" font-size="30px">74.1</text></g><g class="vert-line"><rect x="321.25" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="341.25" y="20" fill="transparent" stroke="transparent" font-size="30px">36.2</text></g><g class="vert-line"><rect x="377.5" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="397.5" y="20" fill="transparent" stroke="transparent" font-size="30px">25.6</text></g><g class="vert-line"><rect x="433.75" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="453.75" y="20" fill="transparent" stroke="transparent" font-size="30px">100</text></g><g class="vert-line"><rect x="490.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="510.0" y="20" fill="transparent" stroke="transparent" font-size="30px">300</text></g></svg></div></td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">ALT</th>
    <td class="gt_row gt_center"><div><svg viewbox="0 0 550 130" style="height: 2em; margin-left: auto; margin-right: auto; font-size: inherit; overflow: visible; vertical-align: middle; position:relative;"><defs><pattern id="area_pattern" width="8" height="8" patternunits="userSpaceOnUse"><path class="pattern-line" d="M 0,8 l 8,-8 M -1,1 l 4,-4 M 6,10 l 4,-4" stroke="#FF0000" stroke-width="1.5" stroke-linecap="round" shape-rendering="geometricPrecision"></path></pattern></defs><style> text { font-family: ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace; stroke-width: 0.15em; paint-order: stroke; stroke-linejoin: round; cursor: default; } .vert-line:hover rect { fill: #911EB4; fill-opacity: 40%; stroke: #FFFFFF60; color: red; } .vert-line:hover text { stroke: white; fill: #212427; } .horizontal-line:hover text {stroke: white; fill: #212427; } .ref-line:hover rect { stroke: #FFFFFF60; } .ref-line:hover line { stroke: #FF0000; } .ref-line:hover text { stroke: white; fill: #212427; } .y-axis-line:hover rect { fill: #EDEDED; fill-opacity: 60%; stroke: #FFFFFF60; color: red; } .y-axis-line:hover text { stroke: white; stroke-width: 0.20em; fill: #1A1C1F; } </style><path class="area-closed" d="M 50.0,15.0 106.25,16.582722594729457 162.5,64.96335568376736 218.75,81.83221581163261 275.0,102.41072820832684 331.25,109.8261344144706 387.5,111.07515983159209 443.75,115.0 500.0,114.68033681584282 500.0,125 50.0,125 Z" stroke="transparent" stroke-width="2" fill="url(#area_pattern)" fill-opacity="0.7"></path><path d="M 50.0,15.0 C 75.0,15.0 81.25,16.582722594729457 106.25,16.582722594729457 C 131.25,16.582722594729457 137.5,64.96335568376736 162.5,64.96335568376736 C 187.5,64.96335568376736 193.75,81.83221581163261 218.75,81.83221581163261 C 243.75,81.83221581163261 250.0,102.41072820832684 275.0,102.41072820832684 C 300.0,102.41072820832684 306.25,109.8261344144706 331.25,109.8261344144706 C 356.25,109.8261344144706 362.5,111.07515983159209 387.5,111.07515983159209 C 412.5,111.07515983159209 418.75,115.0 443.75,115.0 C 468.75,115.0 475.0,114.68033681584282 500.0,114.68033681584282" stroke="#4682B4" stroke-width="8" fill="none"></path><circle cx="50.0" cy="15.0" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="106.25" cy="16.582722594729457" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="162.5" cy="64.96335568376736" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="218.75" cy="81.83221581163261" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="275.0" cy="102.41072820832684" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="331.25" cy="109.8261344144706" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="387.5" cy="111.07515983159209" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="443.75" cy="115.0" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="500.0" cy="114.68033681584282" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><g class="y-axis-line"><rect x="0" y="0" width="65" height="130" stroke="transparent" stroke-width="0" fill="transparent"></rect><text x="0" y="19.0" fill="transparent" stroke="transparent" font-size="25">12.8K</text><text x="0" y="126.0" fill="transparent" stroke="transparent" font-size="25">9.00</text></g><g class="vert-line"><rect x="40.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="60.0" y="20" fill="transparent" stroke="transparent" font-size="30px">12.8K</text></g><g class="vert-line"><rect x="96.25" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="116.25" y="20" fill="transparent" stroke="transparent" font-size="30px">12.6K</text></g><g class="vert-line"><rect x="152.5" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="172.5" y="20" fill="transparent" stroke="transparent" font-size="30px">6.43K</text></g><g class="vert-line"><rect x="208.75" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="228.75" y="20" fill="transparent" stroke="transparent" font-size="30px">4.26K</text></g><g class="vert-line"><rect x="265.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="285.0" y="20" fill="transparent" stroke="transparent" font-size="30px">1.62K</text></g><g class="vert-line"><rect x="321.25" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="341.25" y="20" fill="transparent" stroke="transparent" font-size="30px">673</text></g><g class="vert-line"><rect x="377.5" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="397.5" y="20" fill="transparent" stroke="transparent" font-size="30px">512</text></g><g class="vert-line"><rect x="433.75" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="453.75" y="20" fill="transparent" stroke="transparent" font-size="30px">9.00</text></g><g class="vert-line"><rect x="490.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="510.0" y="20" fill="transparent" stroke="transparent" font-size="30px">50.0</text></g></svg></div></td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">AST</th>
    <td class="gt_row gt_center"><div><svg viewbox="0 0 550 130" style="height: 2em; margin-left: auto; margin-right: auto; font-size: inherit; overflow: visible; vertical-align: middle; position:relative;"><defs><pattern id="area_pattern" width="8" height="8" patternunits="userSpaceOnUse"><path class="pattern-line" d="M 0,8 l 8,-8 M -1,1 l 4,-4 M 6,10 l 4,-4" stroke="#FF0000" stroke-width="1.5" stroke-linecap="round" shape-rendering="geometricPrecision"></path></pattern></defs><style> text { font-family: ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace; stroke-width: 0.15em; paint-order: stroke; stroke-linejoin: round; cursor: default; } .vert-line:hover rect { fill: #911EB4; fill-opacity: 40%; stroke: #FFFFFF60; color: red; } .vert-line:hover text { stroke: white; fill: #212427; } .horizontal-line:hover text {stroke: white; fill: #212427; } .ref-line:hover rect { stroke: #FFFFFF60; } .ref-line:hover line { stroke: #FF0000; } .ref-line:hover text { stroke: white; fill: #212427; } .y-axis-line:hover rect { fill: #EDEDED; fill-opacity: 60%; stroke: #FFFFFF60; color: red; } .y-axis-line:hover text { stroke: white; stroke-width: 0.20em; fill: #1A1C1F; } </style><path class="area-closed" d="M 50.0,15.0 106.25,24.739189246311874 162.5,52.798537430781586 218.75,78.32586549435685 275.0,105.81033098025955 331.25,110.22340110749461 387.5,111.75571712389568 443.75,115.0 500.0,114.89432303335165 500.0,125 50.0,125 Z" stroke="transparent" stroke-width="2" fill="url(#area_pattern)" fill-opacity="0.7"></path><path d="M 50.0,15.0 C 75.0,15.0 81.25,24.739189246311874 106.25,24.739189246311874 C 131.25,24.739189246311874 137.5,52.798537430781586 162.5,52.798537430781586 C 187.5,52.798537430781586 193.75,78.32586549435685 218.75,78.32586549435685 C 243.75,78.32586549435685 250.0,105.81033098025955 275.0,105.81033098025955 C 300.0,105.81033098025955 306.25,110.22340110749461 331.25,110.22340110749461 C 356.25,110.22340110749461 362.5,111.75571712389568 387.5,111.75571712389568 C 412.5,111.75571712389568 418.75,115.0 443.75,115.0 C 468.75,115.0 475.0,114.89432303335165 500.0,114.89432303335165" stroke="#4682B4" stroke-width="8" fill="none"></path><circle cx="50.0" cy="15.0" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="106.25" cy="24.739189246311874" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="162.5" cy="52.798537430781586" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="218.75" cy="78.32586549435685" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="275.0" cy="105.81033098025955" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="331.25" cy="110.22340110749461" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="387.5" cy="111.75571712389568" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="443.75" cy="115.0" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="500.0" cy="114.89432303335165" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><g class="y-axis-line"><rect x="0" y="0" width="65" height="130" stroke="transparent" stroke-width="0" fill="transparent"></rect><text x="0" y="19.0" fill="transparent" stroke="transparent" font-size="25">23.7K</text><text x="0" y="126.0" fill="transparent" stroke="transparent" font-size="25">15.0</text></g><g class="vert-line"><rect x="40.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="60.0" y="20" fill="transparent" stroke="transparent" font-size="30px">23.7K</text></g><g class="vert-line"><rect x="96.25" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="116.25" y="20" fill="transparent" stroke="transparent" font-size="30px">21.4K</text></g><g class="vert-line"><rect x="152.5" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="172.5" y="20" fill="transparent" stroke="transparent" font-size="30px">14.7K</text></g><g class="vert-line"><rect x="208.75" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="228.75" y="20" fill="transparent" stroke="transparent" font-size="30px">8.69K</text></g><g class="vert-line"><rect x="265.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="285.0" y="20" fill="transparent" stroke="transparent" font-size="30px">2.19K</text></g><g class="vert-line"><rect x="321.25" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="341.25" y="20" fill="transparent" stroke="transparent" font-size="30px">1.14K</text></g><g class="vert-line"><rect x="377.5" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="397.5" y="20" fill="transparent" stroke="transparent" font-size="30px">782</text></g><g class="vert-line"><rect x="433.75" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="453.75" y="20" fill="transparent" stroke="transparent" font-size="30px">15.0</text></g><g class="vert-line"><rect x="490.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="510.0" y="20" fill="transparent" stroke="transparent" font-size="30px">40.0</text></g></svg></div></td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">TBIL</th>
    <td class="gt_row gt_center"><div><svg viewbox="0 0 550 130" style="height: 2em; margin-left: auto; margin-right: auto; font-size: inherit; overflow: visible; vertical-align: middle; position:relative;"><defs><pattern id="area_pattern" width="8" height="8" patternunits="userSpaceOnUse"><path class="pattern-line" d="M 0,8 l 8,-8 M -1,1 l 4,-4 M 6,10 l 4,-4" stroke="#FF0000" stroke-width="1.5" stroke-linecap="round" shape-rendering="geometricPrecision"></path></pattern></defs><style> text { font-family: ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace; stroke-width: 0.15em; paint-order: stroke; stroke-linejoin: round; cursor: default; } .vert-line:hover rect { fill: #911EB4; fill-opacity: 40%; stroke: #FFFFFF60; color: red; } .vert-line:hover text { stroke: white; fill: #212427; } .horizontal-line:hover text {stroke: white; fill: #212427; } .ref-line:hover rect { stroke: #FFFFFF60; } .ref-line:hover line { stroke: #FF0000; } .ref-line:hover text { stroke: white; fill: #212427; } .y-axis-line:hover rect { fill: #EDEDED; fill-opacity: 60%; stroke: #FFFFFF60; color: red; } .y-axis-line:hover text { stroke: white; stroke-width: 0.20em; fill: #1A1C1F; } </style><path class="area-closed" d="M 50.0,43.18627450980391 106.25,26.887254901960773 162.5,30.931372549019606 218.75,18.125 275.0,36.997549019607845 331.25,50.600490196078425 387.5,15.0 443.75,115.0 500.0,103.48039215686273 500.0,125 50.0,125 Z" stroke="transparent" stroke-width="2" fill="url(#area_pattern)" fill-opacity="0.7"></path><path d="M 50.0,43.18627450980391 C 75.0,43.18627450980391 81.25,26.887254901960773 106.25,26.887254901960773 C 131.25,26.887254901960773 137.5,30.931372549019606 162.5,30.931372549019606 C 187.5,30.931372549019606 193.75,18.125 218.75,18.125 C 243.75,18.125 250.0,36.997549019607845 275.0,36.997549019607845 C 300.0,36.997549019607845 306.25,50.600490196078425 331.25,50.600490196078425 C 356.25,50.600490196078425 362.5,15.0 387.5,15.0 C 412.5,15.0 418.75,115.0 443.75,115.0 C 468.75,115.0 475.0,103.48039215686273 500.0,103.48039215686273" stroke="#4682B4" stroke-width="8" fill="none"></path><circle cx="50.0" cy="43.18627450980391" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="106.25" cy="26.887254901960773" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="162.5" cy="30.931372549019606" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="218.75" cy="18.125" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="275.0" cy="36.997549019607845" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="331.25" cy="50.600490196078425" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="387.5" cy="15.0" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="443.75" cy="115.0" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="500.0" cy="103.48039215686273" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><g class="y-axis-line"><rect x="0" y="0" width="65" height="130" stroke="transparent" stroke-width="0" fill="transparent"></rect><text x="0" y="19.0" fill="transparent" stroke="transparent" font-size="25">163</text><text x="0" y="126.0" fill="transparent" stroke="transparent" font-size="25">0</text></g><g class="vert-line"><rect x="40.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="60.0" y="20" fill="transparent" stroke="transparent" font-size="30px">117</text></g><g class="vert-line"><rect x="96.25" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="116.25" y="20" fill="transparent" stroke="transparent" font-size="30px">144</text></g><g class="vert-line"><rect x="152.5" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="172.5" y="20" fill="transparent" stroke="transparent" font-size="30px">137</text></g><g class="vert-line"><rect x="208.75" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="228.75" y="20" fill="transparent" stroke="transparent" font-size="30px">158</text></g><g class="vert-line"><rect x="265.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="285.0" y="20" fill="transparent" stroke="transparent" font-size="30px">127</text></g><g class="vert-line"><rect x="321.25" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="341.25" y="20" fill="transparent" stroke="transparent" font-size="30px">105</text></g><g class="vert-line"><rect x="377.5" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="397.5" y="20" fill="transparent" stroke="transparent" font-size="30px">163</text></g><g class="vert-line"><rect x="433.75" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="453.75" y="20" fill="transparent" stroke="transparent" font-size="30px">0</text></g><g class="vert-line"><rect x="490.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="510.0" y="20" fill="transparent" stroke="transparent" font-size="30px">18.8</text></g></svg></div></td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">DBIL</th>
    <td class="gt_row gt_center"><div><svg viewbox="0 0 550 130" style="height: 2em; margin-left: auto; margin-right: auto; font-size: inherit; overflow: visible; vertical-align: middle; position:relative;"><defs><pattern id="area_pattern" width="8" height="8" patternunits="userSpaceOnUse"><path class="pattern-line" d="M 0,8 l 8,-8 M -1,1 l 4,-4 M 6,10 l 4,-4" stroke="#FF0000" stroke-width="1.5" stroke-linecap="round" shape-rendering="geometricPrecision"></path></pattern></defs><style> text { font-family: ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace; stroke-width: 0.15em; paint-order: stroke; stroke-linejoin: round; cursor: default; } .vert-line:hover rect { fill: #911EB4; fill-opacity: 40%; stroke: #FFFFFF60; color: red; } .vert-line:hover text { stroke: white; fill: #212427; } .horizontal-line:hover text {stroke: white; fill: #212427; } .ref-line:hover rect { stroke: #FFFFFF60; } .ref-line:hover line { stroke: #FF0000; } .ref-line:hover text { stroke: white; fill: #212427; } .y-axis-line:hover rect { fill: #EDEDED; fill-opacity: 60%; stroke: #FFFFFF60; color: red; } .y-axis-line:hover text { stroke: white; stroke-width: 0.20em; fill: #1A1C1F; } </style><path class="area-closed" d="M 50.0,65.38220986796387 106.25,42.31063238359973 162.5,49.25990271021543 218.75,15.0 275.0,33.137595552467005 331.25,56.90410006949271 387.5,27.23071577484365 443.75,115.0 500.0,110.27449617790133 500.0,125 50.0,125 Z" stroke="transparent" stroke-width="2" fill="url(#area_pattern)" fill-opacity="0.7"></path><path d="M 50.0,65.38220986796387 C 75.0,65.38220986796387 81.25,42.31063238359973 106.25,42.31063238359973 C 131.25,42.31063238359973 137.5,49.25990271021543 162.5,49.25990271021543 C 187.5,49.25990271021543 193.75,15.0 218.75,15.0 C 243.75,15.0 250.0,33.137595552467005 275.0,33.137595552467005 C 300.0,33.137595552467005 306.25,56.90410006949271 331.25,56.90410006949271 C 356.25,56.90410006949271 362.5,27.23071577484365 387.5,27.23071577484365 C 412.5,27.23071577484365 418.75,115.0 443.75,115.0 C 468.75,115.0 475.0,110.27449617790133 500.0,110.27449617790133" stroke="#4682B4" stroke-width="8" fill="none"></path><circle cx="50.0" cy="65.38220986796387" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="106.25" cy="42.31063238359973" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="162.5" cy="49.25990271021543" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="218.75" cy="15.0" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="275.0" cy="33.137595552467005" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="331.25" cy="56.90410006949271" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="387.5" cy="27.23071577484365" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="443.75" cy="115.0" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="500.0" cy="110.27449617790133" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><g class="y-axis-line"><rect x="0" y="0" width="65" height="130" stroke="transparent" stroke-width="0" fill="transparent"></rect><text x="0" y="19.0" fill="transparent" stroke="transparent" font-size="25">144</text><text x="0" y="126.0" fill="transparent" stroke="transparent" font-size="25">0</text></g><g class="vert-line"><rect x="40.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="60.0" y="20" fill="transparent" stroke="transparent" font-size="30px">71.4</text></g><g class="vert-line"><rect x="96.25" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="116.25" y="20" fill="transparent" stroke="transparent" font-size="30px">105</text></g><g class="vert-line"><rect x="152.5" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="172.5" y="20" fill="transparent" stroke="transparent" font-size="30px">94.6</text></g><g class="vert-line"><rect x="208.75" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="228.75" y="20" fill="transparent" stroke="transparent" font-size="30px">144</text></g><g class="vert-line"><rect x="265.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="285.0" y="20" fill="transparent" stroke="transparent" font-size="30px">118</text></g><g class="vert-line"><rect x="321.25" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="341.25" y="20" fill="transparent" stroke="transparent" font-size="30px">83.6</text></g><g class="vert-line"><rect x="377.5" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="397.5" y="20" fill="transparent" stroke="transparent" font-size="30px">126</text></g><g class="vert-line"><rect x="433.75" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="453.75" y="20" fill="transparent" stroke="transparent" font-size="30px">0</text></g><g class="vert-line"><rect x="490.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="510.0" y="20" fill="transparent" stroke="transparent" font-size="30px">6.80</text></g></svg></div></td>
  </tr>
</tbody>
  <tfoot class="gt_sourcenotes">
  
  <tr>
    <td class="gt_sourcenote" colspan="2">Measurements from Day 3 through to Day 8.</td>
  </tr>

</tfoot>

</table>

</div>
</div>
</div>
<p>While the emphasis here will be on the aforementioned nanoplots feature, the last two releases (<code>v0.3.1</code> and <code>v0.4.0</code>) overall gave us a nice collection of improvements which includes:</p>
<ul>
<li>the <a href="../../reference/GT.fmt_nanoplot.html#great_tables.GT.fmt_nanoplot"><code>fmt_nanoplot()</code></a> method for adding nanoplots to your table</li>
<li>improved HTML table representations in different code environments</li>
<li>integration of Polars selectors in the <code>columns=</code> arg of all formatting (<code>fmt_*()</code>) methods</li>
<li>the <a href="../../reference/GT.save.html#great_tables.GT.save"><code>save()</code></a> method for saving a <strong>GT</strong> table as an image file</li>
<li>rendering a <strong>GT</strong> table as an HTML string though <a href="../../reference/GT.as_raw_html.html#great_tables.GT.as_raw_html"><code>as_raw_html()</code></a></li>
</ul>
<p>Now let’s dive into the wonderful world of nanoplots!</p>
<section id="nanoplots-small-interactive-plots-in-your-table" class="level3">
<h3 class="anchored" data-anchor-id="nanoplots-small-interactive-plots-in-your-table">Nanoplots, small interactive plots in your table</h3>
<p>Nanoplots are small yet information-laden plots that fit nicely into table cells. They are interactive, allowing for more information to be shown on hovering (or through touch when that interaction is available). Nanoplots try to show individual data points with reasonably good visibility (space is limited, this is going in a table after all!) and the plot representations change depending on the data fed into them.</p>
<p>We can generate nanoplots via the <a href="../../reference/GT.fmt_nanoplot.html#great_tables.GT.fmt_nanoplot"><code>fmt_nanoplot()</code></a> method. Let’s make two nanoplots of the two different available plot types: <code>"line"</code> and <code>"bar"</code>:</p>
<div id="ca8240b0" class="cell" data-execution_count="2">
<div class="code-copy-outer-scaffold"><div class="sourceCode cell-code" id="cb2" style="background: #f1f3f5;"><pre class="sourceCode python code-with-copy"><code class="sourceCode python"><span id="cb2-1">random_numbers_df <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> pl.DataFrame(</span>
<span id="cb2-2">    {</span>
<span id="cb2-3">        <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"i"</span>: <span class="bu" style="color: null;
background-color: null;
font-style: inherit;">range</span>(<span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">1</span>, <span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">5</span>),</span>
<span id="cb2-4">        <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"lines"</span>: [</span>
<span id="cb2-5">            <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"20 23 6 7 37 23 21 4 7 16"</span>,</span>
<span id="cb2-6">            <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"2.3 6.8 9.2 2.42 3.5 12.1 5.3 3.6 7.2 3.74"</span>,</span>
<span id="cb2-7">            <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"-12 -5 6 3.7 0 8 -7.4"</span>,</span>
<span id="cb2-8">            <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"2 0 15 7 8 10 1 24 17 13 6"</span>,</span>
<span id="cb2-9">        ],</span>
<span id="cb2-10">    }</span>
<span id="cb2-11">).with_columns(bars<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>pl.col(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"lines"</span>))</span>
<span id="cb2-12"></span>
<span id="cb2-13">(</span>
<span id="cb2-14">    GT(random_numbers_df, rowname_col<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"i"</span>)</span>
<span id="cb2-15">    .fmt_nanoplot(columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"lines"</span>, plot_type<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"line"</span>)</span>
<span id="cb2-16">    .fmt_nanoplot(columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"bars"</span>, plot_type<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"bar"</span>)</span>
<span id="cb2-17">)</span></code></pre></div></div>
<div class="cell-output cell-output-display" data-execution_count="2">
<div id="nlnhvvtpya" style="padding-left:0px;padding-right:0px;padding-top:10px;padding-bottom:10px;overflow-x:auto;overflow-y:auto;width:auto;height:auto;">
<style>
#nlnhvvtpya table {
          font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Helvetica Neue', 'Fira Sans', 'Droid Sans', Arial, sans-serif;
          -webkit-font-smoothing: antialiased;
          -moz-osx-font-smoothing: grayscale;
        }

#nlnhvvtpya thead, tbody, tfoot, tr, td, th { border-style: none; }
 tr { background-color: transparent; }
#nlnhvvtpya p { margin: 0; padding: 0; }
 #nlnhvvtpya .gt_table { display: table; border-collapse: collapse; line-height: normal; margin-left: auto; margin-right: auto; color: #333333; font-size: 16px; font-weight: normal; font-style: normal; background-color: #FFFFFF; width: auto; border-top-style: solid; border-top-width: 2px; border-top-color: #A8A8A8; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #A8A8A8; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; }
 #nlnhvvtpya .gt_caption { padding-top: 4px; padding-bottom: 4px; }
 #nlnhvvtpya .gt_title { color: #333333; font-size: 125%; font-weight: initial; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; border-bottom-color: #FFFFFF; border-bottom-width: 0; }
 #nlnhvvtpya .gt_subtitle { color: #333333; font-size: 85%; font-weight: initial; padding-top: 3px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; border-top-color: #FFFFFF; border-top-width: 0; }
 #nlnhvvtpya .gt_heading { background-color: #FFFFFF; text-align: center; border-bottom-color: #FFFFFF; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #nlnhvvtpya .gt_bottom_border { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #nlnhvvtpya .gt_col_headings { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #nlnhvvtpya .gt_col_heading { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; overflow-x: hidden; }
 #nlnhvvtpya .gt_column_spanner_outer { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; padding-top: 0; padding-bottom: 0; padding-left: 4px; padding-right: 4px; }
 #nlnhvvtpya .gt_column_spanner_outer:first-child { padding-left: 0; }
 #nlnhvvtpya .gt_column_spanner_outer:last-child { padding-right: 0; }
 #nlnhvvtpya .gt_column_spanner { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; overflow-x: hidden; display: inline-block; width: 100%; }
 #nlnhvvtpya .gt_spanner_row { border-bottom-style: hidden; }
 #nlnhvvtpya .gt_group_heading { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; text-align: left; }
 #nlnhvvtpya .gt_empty_group_heading { padding: 0.5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: middle; }
 #nlnhvvtpya .gt_from_md> :first-child { margin-top: 0; }
 #nlnhvvtpya .gt_from_md> :last-child { margin-bottom: 0; }
 #nlnhvvtpya .gt_row { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; margin: 10px; border-top-style: solid; border-top-width: 1px; border-top-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; overflow-x: hidden; }
 #nlnhvvtpya .gt_stub { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; }
 #nlnhvvtpya .gt_stub_row_group { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; vertical-align: top; }
 #nlnhvvtpya .gt_row_group_first td { border-top-width: 2px; }
 #nlnhvvtpya .gt_row_group_first th { border-top-width: 2px; }
 #nlnhvvtpya .gt_striped { color: #333333; background-color: #F4F4F4; }
 #nlnhvvtpya .gt_table_body { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #nlnhvvtpya .gt_grand_summary_row { color: #333333; background-color: #FFFFFF; text-transform: inherit; padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; }
 #nlnhvvtpya .gt_first_grand_summary_row_bottom { border-top-style: double; border-top-width: 6px; border-top-color: #D3D3D3; }
 #nlnhvvtpya .gt_last_grand_summary_row_top { border-bottom-style: double; border-bottom-width: 6px; border-bottom-color: #D3D3D3; }
 #nlnhvvtpya .gt_sourcenotes { color: #333333; background-color: #FFFFFF; border-bottom-style: none; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; }
 #nlnhvvtpya .gt_sourcenote { font-size: 90%; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; text-align: left; }
 #nlnhvvtpya .gt_left { text-align: left; }
 #nlnhvvtpya .gt_center { text-align: center; }
 #nlnhvvtpya .gt_right { text-align: right; font-variant-numeric: tabular-nums; }
 #nlnhvvtpya .gt_font_normal { font-weight: normal; }
 #nlnhvvtpya .gt_font_bold { font-weight: bold; }
 #nlnhvvtpya .gt_font_italic { font-style: italic; }
 #nlnhvvtpya .gt_super { font-size: 65%; }
 #nlnhvvtpya .gt_footnote_marks { font-size: 75%; vertical-align: 0.4em; position: initial; }
 #nlnhvvtpya .gt_asterisk { font-size: 100%; vertical-align: 0; }
 
</style>
<table class="gt_table" data-quarto-disable-processing="false" data-quarto-bootstrap="false">
<thead>

<tr class="gt_col_headings">
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="1" colspan="1" scope="col" id=""></th>
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="1" colspan="1" scope="col" id="lines">lines</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="1" colspan="1" scope="col" id="bars">bars</th>
</tr>
</thead>
<tbody class="gt_table_body">
  <tr>
    <th class="gt_row gt_left gt_stub">1</th>
    <td class="gt_row gt_left"><div><svg viewbox="0 0 600 130" style="height: 2em; margin-left: auto; margin-right: auto; font-size: inherit; overflow: visible; vertical-align: middle; position:relative;"><defs><pattern id="area_pattern" width="8" height="8" patternunits="userSpaceOnUse"><path class="pattern-line" d="M 0,8 l 8,-8 M -1,1 l 4,-4 M 6,10 l 4,-4" stroke="#FF0000" stroke-width="1.5" stroke-linecap="round" shape-rendering="geometricPrecision"></path></pattern></defs><style> text { font-family: ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace; stroke-width: 0.15em; paint-order: stroke; stroke-linejoin: round; cursor: default; } .vert-line:hover rect { fill: #911EB4; fill-opacity: 40%; stroke: #FFFFFF60; color: red; } .vert-line:hover text { stroke: white; fill: #212427; } .horizontal-line:hover text {stroke: white; fill: #212427; } .ref-line:hover rect { stroke: #FFFFFF60; } .ref-line:hover line { stroke: #FF0000; } .ref-line:hover text { stroke: white; fill: #212427; } .y-axis-line:hover rect { fill: #EDEDED; fill-opacity: 60%; stroke: #FFFFFF60; color: red; } .y-axis-line:hover text { stroke: white; stroke-width: 0.20em; fill: #1A1C1F; } </style><path class="area-closed" d="M 50.0,66.51515151515152 105.55555555555554,57.42424242424242 161.1111111111111,108.93939393939394 216.66666666666666,105.9090909090909 272.2222222222222,15.0 327.77777777777777,57.42424242424242 383.3333333333333,63.484848484848484 438.8888888888889,115.0 494.4444444444444,105.9090909090909 550.0,78.63636363636363 550.0,125 50.0,125 Z" stroke="transparent" stroke-width="2" fill="url(#area_pattern)" fill-opacity="0.7"></path><path d="M 50.0,66.51515151515152 C 75.0,66.51515151515152 80.55555555555554,57.42424242424242 105.55555555555554,57.42424242424242 C 130.55555555555554,57.42424242424242 136.1111111111111,108.93939393939394 161.1111111111111,108.93939393939394 C 186.1111111111111,108.93939393939394 191.66666666666666,105.9090909090909 216.66666666666666,105.9090909090909 C 241.66666666666666,105.9090909090909 247.22222222222217,15.0 272.2222222222222,15.0 C 297.2222222222222,15.0 302.77777777777777,57.42424242424242 327.77777777777777,57.42424242424242 C 352.77777777777777,57.42424242424242 358.3333333333333,63.484848484848484 383.3333333333333,63.484848484848484 C 408.3333333333333,63.484848484848484 413.8888888888889,115.0 438.8888888888889,115.0 C 463.8888888888889,115.0 469.4444444444444,105.9090909090909 494.4444444444444,105.9090909090909 C 519.4444444444443,105.9090909090909 525.0,78.63636363636363 550.0,78.63636363636363" stroke="#4682B4" stroke-width="8" fill="none"></path><circle cx="50.0" cy="66.51515151515152" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="105.55555555555554" cy="57.42424242424242" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="161.1111111111111" cy="108.93939393939394" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="216.66666666666666" cy="105.9090909090909" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="272.2222222222222" cy="15.0" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="327.77777777777777" cy="57.42424242424242" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="383.3333333333333" cy="63.484848484848484" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="438.8888888888889" cy="115.0" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="494.4444444444444" cy="105.9090909090909" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="550.0" cy="78.63636363636363" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><g class="y-axis-line"><rect x="0" y="0" width="65" height="130" stroke="transparent" stroke-width="0" fill="transparent"></rect><text x="0" y="19.0" fill="transparent" stroke="transparent" font-size="25">37</text><text x="0" y="126.0" fill="transparent" stroke="transparent" font-size="25">4</text></g><g class="vert-line"><rect x="40.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="60.0" y="20" fill="transparent" stroke="transparent" font-size="30px">20</text></g><g class="vert-line"><rect x="95.55555555555554" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="115.55555555555554" y="20" fill="transparent" stroke="transparent" font-size="30px">23</text></g><g class="vert-line"><rect x="151.1111111111111" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="171.1111111111111" y="20" fill="transparent" stroke="transparent" font-size="30px">6</text></g><g class="vert-line"><rect x="206.66666666666666" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="226.66666666666666" y="20" fill="transparent" stroke="transparent" font-size="30px">7</text></g><g class="vert-line"><rect x="262.2222222222222" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="282.2222222222222" y="20" fill="transparent" stroke="transparent" font-size="30px">37</text></g><g class="vert-line"><rect x="317.77777777777777" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="337.77777777777777" y="20" fill="transparent" stroke="transparent" font-size="30px">23</text></g><g class="vert-line"><rect x="373.3333333333333" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="393.3333333333333" y="20" fill="transparent" stroke="transparent" font-size="30px">21</text></g><g class="vert-line"><rect x="428.8888888888889" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="448.8888888888889" y="20" fill="transparent" stroke="transparent" font-size="30px">4</text></g><g class="vert-line"><rect x="484.4444444444444" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="504.4444444444444" y="20" fill="transparent" stroke="transparent" font-size="30px">7</text></g><g class="vert-line"><rect x="540.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="560.0" y="20" fill="transparent" stroke="transparent" font-size="30px">16</text></g></svg></div></td>
    <td class="gt_row gt_left"><div><svg viewbox="0 0 600 130" style="height: 2em; margin-left: auto; margin-right: auto; font-size: inherit; overflow: visible; vertical-align: middle; position:relative;"><defs><pattern id="area_pattern" width="8" height="8" patternunits="userSpaceOnUse"><path class="pattern-line" d="M 0,8 l 8,-8 M -1,1 l 4,-4 M 6,10 l 4,-4" stroke="#FF0000" stroke-width="1.5" stroke-linecap="round" shape-rendering="geometricPrecision"></path></pattern></defs><style> text { font-family: ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace; stroke-width: 0.15em; paint-order: stroke; stroke-linejoin: round; cursor: default; } .vert-line:hover rect { fill: #911EB4; fill-opacity: 40%; stroke: #FFFFFF60; color: red; } .vert-line:hover text { stroke: white; fill: #212427; } .horizontal-line:hover text {stroke: white; fill: #212427; } .ref-line:hover rect { stroke: #FFFFFF60; } .ref-line:hover line { stroke: #FF0000; } .ref-line:hover text { stroke: white; fill: #212427; } .y-axis-line:hover rect { fill: #EDEDED; fill-opacity: 60%; stroke: #FFFFFF60; color: red; } .y-axis-line:hover text { stroke: white; stroke-width: 0.20em; fill: #1A1C1F; } </style><line x1="22.5" y1="115.0" x2="577.5" y2="115.0" stroke="#BFBFBF" stroke-width="4"></line><rect x="30.0" y="60.945945945945944" width="40" height="54.054054054054056" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="85.55555555555554" y="52.83783783783784" width="40" height="62.16216216216216" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="141.1111111111111" y="98.78378378378379" width="40" height="16.21621621621621" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="196.66666666666666" y="96.08108108108108" width="40" height="18.91891891891892" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="252.22222222222217" y="15.0" width="40" height="100.0" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="307.77777777777777" y="52.83783783783784" width="40" height="62.16216216216216" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="363.3333333333333" y="58.24324324324324" width="40" height="56.75675675675676" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="418.8888888888889" y="104.1891891891892" width="40" height="10.810810810810807" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="474.4444444444444" y="96.08108108108108" width="40" height="18.91891891891892" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="530.0" y="71.75675675675676" width="40" height="43.24324324324324" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><g class="y-axis-line"><rect x="0" y="0" width="65" height="130" stroke="transparent" stroke-width="0" fill="transparent"></rect><text x="0" y="19.0" fill="transparent" stroke="transparent" font-size="25">37</text><text x="0" y="126.0" fill="transparent" stroke="transparent" font-size="25">0</text></g><g class="vert-line"><rect x="40.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="60.0" y="20" fill="transparent" stroke="transparent" font-size="30px">20</text></g><g class="vert-line"><rect x="95.55555555555554" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="115.55555555555554" y="20" fill="transparent" stroke="transparent" font-size="30px">23</text></g><g class="vert-line"><rect x="151.1111111111111" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="171.1111111111111" y="20" fill="transparent" stroke="transparent" font-size="30px">6</text></g><g class="vert-line"><rect x="206.66666666666666" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="226.66666666666666" y="20" fill="transparent" stroke="transparent" font-size="30px">7</text></g><g class="vert-line"><rect x="262.2222222222222" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="282.2222222222222" y="20" fill="transparent" stroke="transparent" font-size="30px">37</text></g><g class="vert-line"><rect x="317.77777777777777" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="337.77777777777777" y="20" fill="transparent" stroke="transparent" font-size="30px">23</text></g><g class="vert-line"><rect x="373.3333333333333" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="393.3333333333333" y="20" fill="transparent" stroke="transparent" font-size="30px">21</text></g><g class="vert-line"><rect x="428.8888888888889" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="448.8888888888889" y="20" fill="transparent" stroke="transparent" font-size="30px">4</text></g><g class="vert-line"><rect x="484.4444444444444" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="504.4444444444444" y="20" fill="transparent" stroke="transparent" font-size="30px">7</text></g><g class="vert-line"><rect x="540.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="560.0" y="20" fill="transparent" stroke="transparent" font-size="30px">16</text></g></svg></div></td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">2</th>
    <td class="gt_row gt_left"><div><svg viewbox="0 0 600 130" style="height: 2em; margin-left: auto; margin-right: auto; font-size: inherit; overflow: visible; vertical-align: middle; position:relative;"><defs><pattern id="area_pattern" width="8" height="8" patternunits="userSpaceOnUse"><path class="pattern-line" d="M 0,8 l 8,-8 M -1,1 l 4,-4 M 6,10 l 4,-4" stroke="#FF0000" stroke-width="1.5" stroke-linecap="round" shape-rendering="geometricPrecision"></path></pattern></defs><style> text { font-family: ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace; stroke-width: 0.15em; paint-order: stroke; stroke-linejoin: round; cursor: default; } .vert-line:hover rect { fill: #911EB4; fill-opacity: 40%; stroke: #FFFFFF60; color: red; } .vert-line:hover text { stroke: white; fill: #212427; } .horizontal-line:hover text {stroke: white; fill: #212427; } .ref-line:hover rect { stroke: #FFFFFF60; } .ref-line:hover line { stroke: #FF0000; } .ref-line:hover text { stroke: white; fill: #212427; } .y-axis-line:hover rect { fill: #EDEDED; fill-opacity: 60%; stroke: #FFFFFF60; color: red; } .y-axis-line:hover text { stroke: white; stroke-width: 0.20em; fill: #1A1C1F; } </style><path class="area-closed" d="M 50.0,115.0 105.55555555555554,69.08163265306123 161.1111111111111,44.591836734693885 216.66666666666666,113.77551020408163 272.2222222222222,102.75510204081633 327.77777777777777,15.0 383.3333333333333,84.38775510204083 438.8888888888889,101.73469387755102 494.4444444444444,65.0 550.0,100.3061224489796 550.0,125 50.0,125 Z" stroke="transparent" stroke-width="2" fill="url(#area_pattern)" fill-opacity="0.7"></path><path d="M 50.0,115.0 C 75.0,115.0 80.55555555555554,69.08163265306123 105.55555555555554,69.08163265306123 C 130.55555555555554,69.08163265306123 136.1111111111111,44.591836734693885 161.1111111111111,44.591836734693885 C 186.1111111111111,44.591836734693885 191.66666666666666,113.77551020408163 216.66666666666666,113.77551020408163 C 241.66666666666666,113.77551020408163 247.22222222222217,102.75510204081633 272.2222222222222,102.75510204081633 C 297.2222222222222,102.75510204081633 302.77777777777777,15.0 327.77777777777777,15.0 C 352.77777777777777,15.0 358.3333333333333,84.38775510204083 383.3333333333333,84.38775510204083 C 408.3333333333333,84.38775510204083 413.8888888888889,101.73469387755102 438.8888888888889,101.73469387755102 C 463.8888888888889,101.73469387755102 469.4444444444444,65.0 494.4444444444444,65.0 C 519.4444444444443,65.0 525.0,100.3061224489796 550.0,100.3061224489796" stroke="#4682B4" stroke-width="8" fill="none"></path><circle cx="50.0" cy="115.0" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="105.55555555555554" cy="69.08163265306123" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="161.1111111111111" cy="44.591836734693885" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="216.66666666666666" cy="113.77551020408163" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="272.2222222222222" cy="102.75510204081633" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="327.77777777777777" cy="15.0" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="383.3333333333333" cy="84.38775510204083" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="438.8888888888889" cy="101.73469387755102" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="494.4444444444444" cy="65.0" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="550.0" cy="100.3061224489796" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><g class="y-axis-line"><rect x="0" y="0" width="65" height="130" stroke="transparent" stroke-width="0" fill="transparent"></rect><text x="0" y="19.0" fill="transparent" stroke="transparent" font-size="25">12.1</text><text x="0" y="126.0" fill="transparent" stroke="transparent" font-size="25">2.30</text></g><g class="vert-line"><rect x="40.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="60.0" y="20" fill="transparent" stroke="transparent" font-size="30px">2.30</text></g><g class="vert-line"><rect x="95.55555555555554" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="115.55555555555554" y="20" fill="transparent" stroke="transparent" font-size="30px">6.80</text></g><g class="vert-line"><rect x="151.1111111111111" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="171.1111111111111" y="20" fill="transparent" stroke="transparent" font-size="30px">9.20</text></g><g class="vert-line"><rect x="206.66666666666666" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="226.66666666666666" y="20" fill="transparent" stroke="transparent" font-size="30px">2.42</text></g><g class="vert-line"><rect x="262.2222222222222" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="282.2222222222222" y="20" fill="transparent" stroke="transparent" font-size="30px">3.50</text></g><g class="vert-line"><rect x="317.77777777777777" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="337.77777777777777" y="20" fill="transparent" stroke="transparent" font-size="30px">12.1</text></g><g class="vert-line"><rect x="373.3333333333333" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="393.3333333333333" y="20" fill="transparent" stroke="transparent" font-size="30px">5.30</text></g><g class="vert-line"><rect x="428.8888888888889" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="448.8888888888889" y="20" fill="transparent" stroke="transparent" font-size="30px">3.60</text></g><g class="vert-line"><rect x="484.4444444444444" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="504.4444444444444" y="20" fill="transparent" stroke="transparent" font-size="30px">7.20</text></g><g class="vert-line"><rect x="540.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="560.0" y="20" fill="transparent" stroke="transparent" font-size="30px">3.74</text></g></svg></div></td>
    <td class="gt_row gt_left"><div><svg viewbox="0 0 600 130" style="height: 2em; margin-left: auto; margin-right: auto; font-size: inherit; overflow: visible; vertical-align: middle; position:relative;"><defs><pattern id="area_pattern" width="8" height="8" patternunits="userSpaceOnUse"><path class="pattern-line" d="M 0,8 l 8,-8 M -1,1 l 4,-4 M 6,10 l 4,-4" stroke="#FF0000" stroke-width="1.5" stroke-linecap="round" shape-rendering="geometricPrecision"></path></pattern></defs><style> text { font-family: ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace; stroke-width: 0.15em; paint-order: stroke; stroke-linejoin: round; cursor: default; } .vert-line:hover rect { fill: #911EB4; fill-opacity: 40%; stroke: #FFFFFF60; color: red; } .vert-line:hover text { stroke: white; fill: #212427; } .horizontal-line:hover text {stroke: white; fill: #212427; } .ref-line:hover rect { stroke: #FFFFFF60; } .ref-line:hover line { stroke: #FF0000; } .ref-line:hover text { stroke: white; fill: #212427; } .y-axis-line:hover rect { fill: #EDEDED; fill-opacity: 60%; stroke: #FFFFFF60; color: red; } .y-axis-line:hover text { stroke: white; stroke-width: 0.20em; fill: #1A1C1F; } </style><line x1="22.5" y1="115.0" x2="577.5" y2="115.0" stroke="#BFBFBF" stroke-width="4"></line><rect x="30.0" y="95.99173553719008" width="40" height="19.00826446280992" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="85.55555555555554" y="58.80165289256198" width="40" height="56.19834710743802" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="141.1111111111111" y="38.96694214876034" width="40" height="76.03305785123966" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="196.66666666666666" y="95.0" width="40" height="20.0" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="252.22222222222217" y="86.07438016528926" width="40" height="28.925619834710744" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="307.77777777777777" y="15.0" width="40" height="100.0" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="363.3333333333333" y="71.19834710743802" width="40" height="43.801652892561975" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="418.8888888888889" y="85.24793388429752" width="40" height="29.752066115702476" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="474.4444444444444" y="55.49586776859504" width="40" height="59.50413223140496" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="530.0" y="84.0909090909091" width="40" height="30.909090909090907" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><g class="y-axis-line"><rect x="0" y="0" width="65" height="130" stroke="transparent" stroke-width="0" fill="transparent"></rect><text x="0" y="19.0" fill="transparent" stroke="transparent" font-size="25">12.1</text><text x="0" y="126.0" fill="transparent" stroke="transparent" font-size="25">0</text></g><g class="vert-line"><rect x="40.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="60.0" y="20" fill="transparent" stroke="transparent" font-size="30px">2.30</text></g><g class="vert-line"><rect x="95.55555555555554" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="115.55555555555554" y="20" fill="transparent" stroke="transparent" font-size="30px">6.80</text></g><g class="vert-line"><rect x="151.1111111111111" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="171.1111111111111" y="20" fill="transparent" stroke="transparent" font-size="30px">9.20</text></g><g class="vert-line"><rect x="206.66666666666666" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="226.66666666666666" y="20" fill="transparent" stroke="transparent" font-size="30px">2.42</text></g><g class="vert-line"><rect x="262.2222222222222" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="282.2222222222222" y="20" fill="transparent" stroke="transparent" font-size="30px">3.50</text></g><g class="vert-line"><rect x="317.77777777777777" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="337.77777777777777" y="20" fill="transparent" stroke="transparent" font-size="30px">12.1</text></g><g class="vert-line"><rect x="373.3333333333333" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="393.3333333333333" y="20" fill="transparent" stroke="transparent" font-size="30px">5.30</text></g><g class="vert-line"><rect x="428.8888888888889" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="448.8888888888889" y="20" fill="transparent" stroke="transparent" font-size="30px">3.60</text></g><g class="vert-line"><rect x="484.4444444444444" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="504.4444444444444" y="20" fill="transparent" stroke="transparent" font-size="30px">7.20</text></g><g class="vert-line"><rect x="540.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="560.0" y="20" fill="transparent" stroke="transparent" font-size="30px">3.74</text></g></svg></div></td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">3</th>
    <td class="gt_row gt_left"><div><svg viewbox="0 0 450 130" style="height: 2em; margin-left: auto; margin-right: auto; font-size: inherit; overflow: visible; vertical-align: middle; position:relative;"><defs><pattern id="area_pattern" width="8" height="8" patternunits="userSpaceOnUse"><path class="pattern-line" d="M 0,8 l 8,-8 M -1,1 l 4,-4 M 6,10 l 4,-4" stroke="#FF0000" stroke-width="1.5" stroke-linecap="round" shape-rendering="geometricPrecision"></path></pattern></defs><style> text { font-family: ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace; stroke-width: 0.15em; paint-order: stroke; stroke-linejoin: round; cursor: default; } .vert-line:hover rect { fill: #911EB4; fill-opacity: 40%; stroke: #FFFFFF60; color: red; } .vert-line:hover text { stroke: white; fill: #212427; } .horizontal-line:hover text {stroke: white; fill: #212427; } .ref-line:hover rect { stroke: #FFFFFF60; } .ref-line:hover line { stroke: #FF0000; } .ref-line:hover text { stroke: white; fill: #212427; } .y-axis-line:hover rect { fill: #EDEDED; fill-opacity: 60%; stroke: #FFFFFF60; color: red; } .y-axis-line:hover text { stroke: white; stroke-width: 0.20em; fill: #1A1C1F; } </style><path class="area-closed" d="M 50.0,115.0 108.33333333333333,80.0 166.66666666666666,25.0 225.0,36.50000000000001 283.3333333333333,55.0 341.6666666666667,15.0 400.0,92.0 400.0,125 50.0,125 Z" stroke="transparent" stroke-width="2" fill="url(#area_pattern)" fill-opacity="0.7"></path><path d="M 50.0,115.0 C 75.0,115.0 83.33333333333333,80.0 108.33333333333333,80.0 C 133.33333333333331,80.0 141.66666666666666,25.0 166.66666666666666,25.0 C 191.66666666666666,25.0 200.0,36.50000000000001 225.0,36.50000000000001 C 250.0,36.50000000000001 258.3333333333333,55.0 283.3333333333333,55.0 C 308.3333333333333,55.0 316.6666666666667,15.0 341.6666666666667,15.0 C 366.6666666666667,15.0 375.0,92.0 400.0,92.0" stroke="#4682B4" stroke-width="8" fill="none"></path><circle cx="50.0" cy="115.0" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="108.33333333333333" cy="80.0" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="166.66666666666666" cy="25.0" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="225.0" cy="36.50000000000001" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="283.3333333333333" cy="55.0" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="341.6666666666667" cy="15.0" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="400.0" cy="92.0" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><g class="y-axis-line"><rect x="0" y="0" width="65" height="130" stroke="transparent" stroke-width="0" fill="transparent"></rect><text x="0" y="19.0" fill="transparent" stroke="transparent" font-size="25">8.00</text><text x="0" y="126.0" fill="transparent" stroke="transparent" font-size="25">−12.0</text></g><g class="vert-line"><rect x="40.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="60.0" y="20" fill="transparent" stroke="transparent" font-size="30px">−12.0</text></g><g class="vert-line"><rect x="98.33333333333333" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="118.33333333333333" y="20" fill="transparent" stroke="transparent" font-size="30px">−5.00</text></g><g class="vert-line"><rect x="156.66666666666666" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="176.66666666666666" y="20" fill="transparent" stroke="transparent" font-size="30px">6.00</text></g><g class="vert-line"><rect x="215.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="235.0" y="20" fill="transparent" stroke="transparent" font-size="30px">3.70</text></g><g class="vert-line"><rect x="273.3333333333333" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="293.3333333333333" y="20" fill="transparent" stroke="transparent" font-size="30px">0</text></g><g class="vert-line"><rect x="331.6666666666667" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="351.6666666666667" y="20" fill="transparent" stroke="transparent" font-size="30px">8.00</text></g><g class="vert-line"><rect x="390.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="410.0" y="20" fill="transparent" stroke="transparent" font-size="30px">−7.40</text></g></svg></div></td>
    <td class="gt_row gt_left"><div><svg viewbox="0 0 450 130" style="height: 2em; margin-left: auto; margin-right: auto; font-size: inherit; overflow: visible; vertical-align: middle; position:relative;"><defs><pattern id="area_pattern" width="8" height="8" patternunits="userSpaceOnUse"><path class="pattern-line" d="M 0,8 l 8,-8 M -1,1 l 4,-4 M 6,10 l 4,-4" stroke="#FF0000" stroke-width="1.5" stroke-linecap="round" shape-rendering="geometricPrecision"></path></pattern></defs><style> text { font-family: ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace; stroke-width: 0.15em; paint-order: stroke; stroke-linejoin: round; cursor: default; } .vert-line:hover rect { fill: #911EB4; fill-opacity: 40%; stroke: #FFFFFF60; color: red; } .vert-line:hover text { stroke: white; fill: #212427; } .horizontal-line:hover text {stroke: white; fill: #212427; } .ref-line:hover rect { stroke: #FFFFFF60; } .ref-line:hover line { stroke: #FF0000; } .ref-line:hover text { stroke: white; fill: #212427; } .y-axis-line:hover rect { fill: #EDEDED; fill-opacity: 60%; stroke: #FFFFFF60; color: red; } .y-axis-line:hover text { stroke: white; stroke-width: 0.20em; fill: #1A1C1F; } </style><line x1="22.5" y1="55.0" x2="427.5" y2="55.0" stroke="#BFBFBF" stroke-width="4"></line><rect x="30.0" y="55.0" width="40" height="60.0" stroke="#CC3243" stroke-width="4" fill="#D75A68"></rect><rect x="88.33333333333333" y="55.0" width="40" height="25.0" stroke="#CC3243" stroke-width="4" fill="#D75A68"></rect><rect x="146.66666666666666" y="25.0" width="40" height="30.0" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="205.0" y="36.50000000000001" width="40" height="18.499999999999993" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="263.3333333333333" y="54.0" width="40" height="2" stroke="#808080" stroke-width="4" fill="#808080"></rect><rect x="321.6666666666667" y="15.0" width="40" height="40.0" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="380.0" y="55.0" width="40" height="37.0" stroke="#CC3243" stroke-width="4" fill="#D75A68"></rect><g class="y-axis-line"><rect x="0" y="0" width="65" height="130" stroke="transparent" stroke-width="0" fill="transparent"></rect><text x="0" y="19.0" fill="transparent" stroke="transparent" font-size="25">8.00</text><text x="0" y="126.0" fill="transparent" stroke="transparent" font-size="25">−12.0</text></g><g class="vert-line"><rect x="40.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="60.0" y="20" fill="transparent" stroke="transparent" font-size="30px">−12.0</text></g><g class="vert-line"><rect x="98.33333333333333" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="118.33333333333333" y="20" fill="transparent" stroke="transparent" font-size="30px">−5.00</text></g><g class="vert-line"><rect x="156.66666666666666" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="176.66666666666666" y="20" fill="transparent" stroke="transparent" font-size="30px">6.00</text></g><g class="vert-line"><rect x="215.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="235.0" y="20" fill="transparent" stroke="transparent" font-size="30px">3.70</text></g><g class="vert-line"><rect x="273.3333333333333" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="293.3333333333333" y="20" fill="transparent" stroke="transparent" font-size="30px">0</text></g><g class="vert-line"><rect x="331.6666666666667" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="351.6666666666667" y="20" fill="transparent" stroke="transparent" font-size="30px">8.00</text></g><g class="vert-line"><rect x="390.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="410.0" y="20" fill="transparent" stroke="transparent" font-size="30px">−7.40</text></g></svg></div></td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">4</th>
    <td class="gt_row gt_left"><div><svg viewbox="0 0 650 130" style="height: 2em; margin-left: auto; margin-right: auto; font-size: inherit; overflow: visible; vertical-align: middle; position:relative;"><defs><pattern id="area_pattern" width="8" height="8" patternunits="userSpaceOnUse"><path class="pattern-line" d="M 0,8 l 8,-8 M -1,1 l 4,-4 M 6,10 l 4,-4" stroke="#FF0000" stroke-width="1.5" stroke-linecap="round" shape-rendering="geometricPrecision"></path></pattern></defs><style> text { font-family: ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace; stroke-width: 0.15em; paint-order: stroke; stroke-linejoin: round; cursor: default; } .vert-line:hover rect { fill: #911EB4; fill-opacity: 40%; stroke: #FFFFFF60; color: red; } .vert-line:hover text { stroke: white; fill: #212427; } .horizontal-line:hover text {stroke: white; fill: #212427; } .ref-line:hover rect { stroke: #FFFFFF60; } .ref-line:hover line { stroke: #FF0000; } .ref-line:hover text { stroke: white; fill: #212427; } .y-axis-line:hover rect { fill: #EDEDED; fill-opacity: 60%; stroke: #FFFFFF60; color: red; } .y-axis-line:hover text { stroke: white; stroke-width: 0.20em; fill: #1A1C1F; } </style><path class="area-closed" d="M 50.0,106.66666666666666 105.0,115.0 160.0,52.5 215.0,85.83333333333333 270.0,81.66666666666667 325.0,73.33333333333333 380.0,110.83333333333334 435.0,15.0 490.0,44.166666666666664 545.0,60.833333333333336 600.0,90.0 600.0,125 50.0,125 Z" stroke="transparent" stroke-width="2" fill="url(#area_pattern)" fill-opacity="0.7"></path><path d="M 50.0,106.66666666666666 C 75.0,106.66666666666666 80.0,115.0 105.0,115.0 C 130.0,115.0 135.0,52.5 160.0,52.5 C 185.0,52.5 190.0,85.83333333333333 215.0,85.83333333333333 C 240.0,85.83333333333333 245.0,81.66666666666667 270.0,81.66666666666667 C 295.0,81.66666666666667 300.0,73.33333333333333 325.0,73.33333333333333 C 350.0,73.33333333333333 355.0,110.83333333333334 380.0,110.83333333333334 C 405.0,110.83333333333334 410.0,15.0 435.0,15.0 C 460.0,15.0 465.0,44.166666666666664 490.0,44.166666666666664 C 515.0,44.166666666666664 520.0,60.833333333333336 545.0,60.833333333333336 C 570.0,60.833333333333336 575.0,90.0 600.0,90.0" stroke="#4682B4" stroke-width="8" fill="none"></path><circle cx="50.0" cy="106.66666666666666" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="105.0" cy="115.0" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="160.0" cy="52.5" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="215.0" cy="85.83333333333333" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="270.0" cy="81.66666666666667" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="325.0" cy="73.33333333333333" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="380.0" cy="110.83333333333334" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="435.0" cy="15.0" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="490.0" cy="44.166666666666664" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="545.0" cy="60.833333333333336" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="600.0" cy="90.0" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><g class="y-axis-line"><rect x="0" y="0" width="65" height="130" stroke="transparent" stroke-width="0" fill="transparent"></rect><text x="0" y="19.0" fill="transparent" stroke="transparent" font-size="25">24</text><text x="0" y="126.0" fill="transparent" stroke="transparent" font-size="25">0</text></g><g class="vert-line"><rect x="40.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="60.0" y="20" fill="transparent" stroke="transparent" font-size="30px">2</text></g><g class="vert-line"><rect x="95.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="115.0" y="20" fill="transparent" stroke="transparent" font-size="30px">0</text></g><g class="vert-line"><rect x="150.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="170.0" y="20" fill="transparent" stroke="transparent" font-size="30px">15</text></g><g class="vert-line"><rect x="205.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="225.0" y="20" fill="transparent" stroke="transparent" font-size="30px">7</text></g><g class="vert-line"><rect x="260.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="280.0" y="20" fill="transparent" stroke="transparent" font-size="30px">8</text></g><g class="vert-line"><rect x="315.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="335.0" y="20" fill="transparent" stroke="transparent" font-size="30px">10</text></g><g class="vert-line"><rect x="370.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="390.0" y="20" fill="transparent" stroke="transparent" font-size="30px">1</text></g><g class="vert-line"><rect x="425.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="445.0" y="20" fill="transparent" stroke="transparent" font-size="30px">24</text></g><g class="vert-line"><rect x="480.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="500.0" y="20" fill="transparent" stroke="transparent" font-size="30px">17</text></g><g class="vert-line"><rect x="535.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="555.0" y="20" fill="transparent" stroke="transparent" font-size="30px">13</text></g><g class="vert-line"><rect x="590.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="610.0" y="20" fill="transparent" stroke="transparent" font-size="30px">6</text></g></svg></div></td>
    <td class="gt_row gt_left"><div><svg viewbox="0 0 650 130" style="height: 2em; margin-left: auto; margin-right: auto; font-size: inherit; overflow: visible; vertical-align: middle; position:relative;"><defs><pattern id="area_pattern" width="8" height="8" patternunits="userSpaceOnUse"><path class="pattern-line" d="M 0,8 l 8,-8 M -1,1 l 4,-4 M 6,10 l 4,-4" stroke="#FF0000" stroke-width="1.5" stroke-linecap="round" shape-rendering="geometricPrecision"></path></pattern></defs><style> text { font-family: ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace; stroke-width: 0.15em; paint-order: stroke; stroke-linejoin: round; cursor: default; } .vert-line:hover rect { fill: #911EB4; fill-opacity: 40%; stroke: #FFFFFF60; color: red; } .vert-line:hover text { stroke: white; fill: #212427; } .horizontal-line:hover text {stroke: white; fill: #212427; } .ref-line:hover rect { stroke: #FFFFFF60; } .ref-line:hover line { stroke: #FF0000; } .ref-line:hover text { stroke: white; fill: #212427; } .y-axis-line:hover rect { fill: #EDEDED; fill-opacity: 60%; stroke: #FFFFFF60; color: red; } .y-axis-line:hover text { stroke: white; stroke-width: 0.20em; fill: #1A1C1F; } </style><line x1="22.5" y1="115.0" x2="627.5" y2="115.0" stroke="#BFBFBF" stroke-width="4"></line><rect x="30.0" y="106.66666666666666" width="40" height="8.333333333333343" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="85.0" y="114.0" width="40" height="2" stroke="#808080" stroke-width="4" fill="#808080"></rect><rect x="140.0" y="52.5" width="40" height="62.5" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="195.0" y="85.83333333333333" width="40" height="29.16666666666667" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="250.0" y="81.66666666666667" width="40" height="33.33333333333333" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="305.0" y="73.33333333333333" width="40" height="41.66666666666667" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="360.0" y="110.83333333333334" width="40" height="4.166666666666657" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="415.0" y="15.0" width="40" height="100.0" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="470.0" y="44.166666666666664" width="40" height="70.83333333333334" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="525.0" y="60.833333333333336" width="40" height="54.166666666666664" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="580.0" y="90.0" width="40" height="25.0" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><g class="y-axis-line"><rect x="0" y="0" width="65" height="130" stroke="transparent" stroke-width="0" fill="transparent"></rect><text x="0" y="19.0" fill="transparent" stroke="transparent" font-size="25">24</text><text x="0" y="126.0" fill="transparent" stroke="transparent" font-size="25">0</text></g><g class="vert-line"><rect x="40.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="60.0" y="20" fill="transparent" stroke="transparent" font-size="30px">2</text></g><g class="vert-line"><rect x="95.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="115.0" y="20" fill="transparent" stroke="transparent" font-size="30px">0</text></g><g class="vert-line"><rect x="150.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="170.0" y="20" fill="transparent" stroke="transparent" font-size="30px">15</text></g><g class="vert-line"><rect x="205.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="225.0" y="20" fill="transparent" stroke="transparent" font-size="30px">7</text></g><g class="vert-line"><rect x="260.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="280.0" y="20" fill="transparent" stroke="transparent" font-size="30px">8</text></g><g class="vert-line"><rect x="315.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="335.0" y="20" fill="transparent" stroke="transparent" font-size="30px">10</text></g><g class="vert-line"><rect x="370.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="390.0" y="20" fill="transparent" stroke="transparent" font-size="30px">1</text></g><g class="vert-line"><rect x="425.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="445.0" y="20" fill="transparent" stroke="transparent" font-size="30px">24</text></g><g class="vert-line"><rect x="480.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="500.0" y="20" fill="transparent" stroke="transparent" font-size="30px">17</text></g><g class="vert-line"><rect x="535.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="555.0" y="20" fill="transparent" stroke="transparent" font-size="30px">13</text></g><g class="vert-line"><rect x="590.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="610.0" y="20" fill="transparent" stroke="transparent" font-size="30px">6</text></g></svg></div></td>
  </tr>
</tbody>


</table>

</div>
</div>
</div>
<p>As can be seen, the method accepts bundles of values per cell that are formatted as strings (with spaces between each of the values). You can also use <a href="https://docs.pola.rs/user-guide/expressions/lists/">Polars list columns</a> as acceptable input.</p>
</section>
<section id="adding-reference-lines-and-highlighted-areas" class="level3">
<h3 class="anchored" data-anchor-id="adding-reference-lines-and-highlighted-areas">Adding reference lines and highlighted areas</h3>
<p>It’s possible to add in a reference line and a reference area to individual plots. These may be useful to highlight a particular statistic (e.g., median or minimum value) or a bounded region of interest (e.g., the area between the first and third quartiles). Here is an example of how to use these options via the <code>reference_line=</code> and <code>reference_area=</code> arguments:</p>
<div id="3d09b849" class="cell" data-execution_count="3">
<div class="code-copy-outer-scaffold"><div class="sourceCode cell-code" id="cb3" style="background: #f1f3f5;"><pre class="sourceCode python code-with-copy"><code class="sourceCode python"><span id="cb3-1">(</span>
<span id="cb3-2">    GT(random_numbers_df, rowname_col<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"i"</span>)</span>
<span id="cb3-3">    .fmt_nanoplot(</span>
<span id="cb3-4">        columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"lines"</span>,</span>
<span id="cb3-5">        reference_line<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"mean"</span>,</span>
<span id="cb3-6">        reference_area<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>[<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"min"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"q1"</span>]</span>
<span id="cb3-7">    )</span>
<span id="cb3-8">    .fmt_nanoplot(</span>
<span id="cb3-9">        columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"bars"</span>,</span>
<span id="cb3-10">        plot_type<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"bar"</span>,</span>
<span id="cb3-11">        reference_line<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"max"</span>,</span>
<span id="cb3-12">        reference_area<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>[<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"max"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"median"</span>])</span>
<span id="cb3-13">)</span></code></pre></div></div>
<div class="cell-output cell-output-display" data-execution_count="3">
<div id="uoprjukjzp" style="padding-left:0px;padding-right:0px;padding-top:10px;padding-bottom:10px;overflow-x:auto;overflow-y:auto;width:auto;height:auto;">
<style>
#uoprjukjzp table {
          font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Helvetica Neue', 'Fira Sans', 'Droid Sans', Arial, sans-serif;
          -webkit-font-smoothing: antialiased;
          -moz-osx-font-smoothing: grayscale;
        }

#uoprjukjzp thead, tbody, tfoot, tr, td, th { border-style: none; }
 tr { background-color: transparent; }
#uoprjukjzp p { margin: 0; padding: 0; }
 #uoprjukjzp .gt_table { display: table; border-collapse: collapse; line-height: normal; margin-left: auto; margin-right: auto; color: #333333; font-size: 16px; font-weight: normal; font-style: normal; background-color: #FFFFFF; width: auto; border-top-style: solid; border-top-width: 2px; border-top-color: #A8A8A8; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #A8A8A8; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; }
 #uoprjukjzp .gt_caption { padding-top: 4px; padding-bottom: 4px; }
 #uoprjukjzp .gt_title { color: #333333; font-size: 125%; font-weight: initial; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; border-bottom-color: #FFFFFF; border-bottom-width: 0; }
 #uoprjukjzp .gt_subtitle { color: #333333; font-size: 85%; font-weight: initial; padding-top: 3px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; border-top-color: #FFFFFF; border-top-width: 0; }
 #uoprjukjzp .gt_heading { background-color: #FFFFFF; text-align: center; border-bottom-color: #FFFFFF; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #uoprjukjzp .gt_bottom_border { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #uoprjukjzp .gt_col_headings { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #uoprjukjzp .gt_col_heading { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; overflow-x: hidden; }
 #uoprjukjzp .gt_column_spanner_outer { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; padding-top: 0; padding-bottom: 0; padding-left: 4px; padding-right: 4px; }
 #uoprjukjzp .gt_column_spanner_outer:first-child { padding-left: 0; }
 #uoprjukjzp .gt_column_spanner_outer:last-child { padding-right: 0; }
 #uoprjukjzp .gt_column_spanner { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; overflow-x: hidden; display: inline-block; width: 100%; }
 #uoprjukjzp .gt_spanner_row { border-bottom-style: hidden; }
 #uoprjukjzp .gt_group_heading { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; text-align: left; }
 #uoprjukjzp .gt_empty_group_heading { padding: 0.5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: middle; }
 #uoprjukjzp .gt_from_md> :first-child { margin-top: 0; }
 #uoprjukjzp .gt_from_md> :last-child { margin-bottom: 0; }
 #uoprjukjzp .gt_row { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; margin: 10px; border-top-style: solid; border-top-width: 1px; border-top-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; overflow-x: hidden; }
 #uoprjukjzp .gt_stub { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; }
 #uoprjukjzp .gt_stub_row_group { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; vertical-align: top; }
 #uoprjukjzp .gt_row_group_first td { border-top-width: 2px; }
 #uoprjukjzp .gt_row_group_first th { border-top-width: 2px; }
 #uoprjukjzp .gt_striped { color: #333333; background-color: #F4F4F4; }
 #uoprjukjzp .gt_table_body { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #uoprjukjzp .gt_grand_summary_row { color: #333333; background-color: #FFFFFF; text-transform: inherit; padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; }
 #uoprjukjzp .gt_first_grand_summary_row_bottom { border-top-style: double; border-top-width: 6px; border-top-color: #D3D3D3; }
 #uoprjukjzp .gt_last_grand_summary_row_top { border-bottom-style: double; border-bottom-width: 6px; border-bottom-color: #D3D3D3; }
 #uoprjukjzp .gt_sourcenotes { color: #333333; background-color: #FFFFFF; border-bottom-style: none; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; }
 #uoprjukjzp .gt_sourcenote { font-size: 90%; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; text-align: left; }
 #uoprjukjzp .gt_left { text-align: left; }
 #uoprjukjzp .gt_center { text-align: center; }
 #uoprjukjzp .gt_right { text-align: right; font-variant-numeric: tabular-nums; }
 #uoprjukjzp .gt_font_normal { font-weight: normal; }
 #uoprjukjzp .gt_font_bold { font-weight: bold; }
 #uoprjukjzp .gt_font_italic { font-style: italic; }
 #uoprjukjzp .gt_super { font-size: 65%; }
 #uoprjukjzp .gt_footnote_marks { font-size: 75%; vertical-align: 0.4em; position: initial; }
 #uoprjukjzp .gt_asterisk { font-size: 100%; vertical-align: 0; }
 
</style>
<table class="gt_table" data-quarto-disable-processing="false" data-quarto-bootstrap="false">
<thead>

<tr class="gt_col_headings">
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="1" colspan="1" scope="col" id=""></th>
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="1" colspan="1" scope="col" id="lines">lines</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="1" colspan="1" scope="col" id="bars">bars</th>
</tr>
</thead>
<tbody class="gt_table_body">
  <tr>
    <th class="gt_row gt_left gt_stub">1</th>
    <td class="gt_row gt_left"><div><svg viewbox="0 0 600 130" style="height: 2em; margin-left: auto; margin-right: auto; font-size: inherit; overflow: visible; vertical-align: middle; position:relative;"><defs><pattern id="area_pattern" width="8" height="8" patternunits="userSpaceOnUse"><path class="pattern-line" d="M 0,8 l 8,-8 M -1,1 l 4,-4 M 6,10 l 4,-4" stroke="#FF0000" stroke-width="1.5" stroke-linecap="round" shape-rendering="geometricPrecision"></path></pattern></defs><style> text { font-family: ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace; stroke-width: 0.15em; paint-order: stroke; stroke-linejoin: round; cursor: default; } .vert-line:hover rect { fill: #911EB4; fill-opacity: 40%; stroke: #FFFFFF60; color: red; } .vert-line:hover text { stroke: white; fill: #212427; } .horizontal-line:hover text {stroke: white; fill: #212427; } .ref-line:hover rect { stroke: #FFFFFF60; } .ref-line:hover line { stroke: #FF0000; } .ref-line:hover text { stroke: white; fill: #212427; } .y-axis-line:hover rect { fill: #EDEDED; fill-opacity: 60%; stroke: #FFFFFF60; color: red; } .y-axis-line:hover text { stroke: white; stroke-width: 0.20em; fill: #1A1C1F; } </style><path d="M50.0,105.9090909090909,550.0,105.9090909090909,550.0,115.0,50.0,115.0Z" stroke="transparent" stroke-width="2" fill="#A6E6F2" fill-opacity="0.8"></path><path class="area-closed" d="M 50.0,66.51515151515152 105.55555555555554,57.42424242424242 161.1111111111111,108.93939393939394 216.66666666666666,105.9090909090909 272.2222222222222,15.0 327.77777777777777,57.42424242424242 383.3333333333333,63.484848484848484 438.8888888888889,115.0 494.4444444444444,105.9090909090909 550.0,78.63636363636363 550.0,125 50.0,125 Z" stroke="transparent" stroke-width="2" fill="url(#area_pattern)" fill-opacity="0.7"></path><path d="M 50.0,66.51515151515152 C 75.0,66.51515151515152 80.55555555555554,57.42424242424242 105.55555555555554,57.42424242424242 C 130.55555555555554,57.42424242424242 136.1111111111111,108.93939393939394 161.1111111111111,108.93939393939394 C 186.1111111111111,108.93939393939394 191.66666666666666,105.9090909090909 216.66666666666666,105.9090909090909 C 241.66666666666666,105.9090909090909 247.22222222222217,15.0 272.2222222222222,15.0 C 297.2222222222222,15.0 302.77777777777777,57.42424242424242 327.77777777777777,57.42424242424242 C 352.77777777777777,57.42424242424242 358.3333333333333,63.484848484848484 383.3333333333333,63.484848484848484 C 408.3333333333333,63.484848484848484 413.8888888888889,115.0 438.8888888888889,115.0 C 463.8888888888889,115.0 469.4444444444444,105.9090909090909 494.4444444444444,105.9090909090909 C 519.4444444444443,105.9090909090909 525.0,78.63636363636363 550.0,78.63636363636363" stroke="#4682B4" stroke-width="8" fill="none"></path><g class="ref-line"><rect x="40.0" y="67.42424242424244" width="520" height="20" stroke="transparent" stroke-width="1" fill="transparent"></rect><line class="ref-line" x1="50.0" y1="77.42424242424244" x2="550" y2="77.42424242424244" stroke="#75A8B0" stroke-width="1" stroke-dasharray="4 3" transform="" stroke-linecap="round" vector-effect="non-scaling-stroke"></line><text x="560" y="87.42424242424244" fill="transparent" stroke="transparent" font-size="30px">16.4</text></g><circle cx="50.0" cy="66.51515151515152" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="105.55555555555554" cy="57.42424242424242" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="161.1111111111111" cy="108.93939393939394" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="216.66666666666666" cy="105.9090909090909" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="272.2222222222222" cy="15.0" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="327.77777777777777" cy="57.42424242424242" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="383.3333333333333" cy="63.484848484848484" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="438.8888888888889" cy="115.0" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="494.4444444444444" cy="105.9090909090909" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="550.0" cy="78.63636363636363" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><g class="y-axis-line"><rect x="0" y="0" width="65" height="130" stroke="transparent" stroke-width="0" fill="transparent"></rect><text x="0" y="19.0" fill="transparent" stroke="transparent" font-size="25">37</text><text x="0" y="126.0" fill="transparent" stroke="transparent" font-size="25">4</text></g><g class="vert-line"><rect x="40.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="60.0" y="20" fill="transparent" stroke="transparent" font-size="30px">20</text></g><g class="vert-line"><rect x="95.55555555555554" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="115.55555555555554" y="20" fill="transparent" stroke="transparent" font-size="30px">23</text></g><g class="vert-line"><rect x="151.1111111111111" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="171.1111111111111" y="20" fill="transparent" stroke="transparent" font-size="30px">6</text></g><g class="vert-line"><rect x="206.66666666666666" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="226.66666666666666" y="20" fill="transparent" stroke="transparent" font-size="30px">7</text></g><g class="vert-line"><rect x="262.2222222222222" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="282.2222222222222" y="20" fill="transparent" stroke="transparent" font-size="30px">37</text></g><g class="vert-line"><rect x="317.77777777777777" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="337.77777777777777" y="20" fill="transparent" stroke="transparent" font-size="30px">23</text></g><g class="vert-line"><rect x="373.3333333333333" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="393.3333333333333" y="20" fill="transparent" stroke="transparent" font-size="30px">21</text></g><g class="vert-line"><rect x="428.8888888888889" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="448.8888888888889" y="20" fill="transparent" stroke="transparent" font-size="30px">4</text></g><g class="vert-line"><rect x="484.4444444444444" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="504.4444444444444" y="20" fill="transparent" stroke="transparent" font-size="30px">7</text></g><g class="vert-line"><rect x="540.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="560.0" y="20" fill="transparent" stroke="transparent" font-size="30px">16</text></g></svg></div></td>
    <td class="gt_row gt_left"><div><svg viewbox="0 0 600 130" style="height: 2em; margin-left: auto; margin-right: auto; font-size: inherit; overflow: visible; vertical-align: middle; position:relative;"><defs><pattern id="area_pattern" width="8" height="8" patternunits="userSpaceOnUse"><path class="pattern-line" d="M 0,8 l 8,-8 M -1,1 l 4,-4 M 6,10 l 4,-4" stroke="#FF0000" stroke-width="1.5" stroke-linecap="round" shape-rendering="geometricPrecision"></path></pattern></defs><style> text { font-family: ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace; stroke-width: 0.15em; paint-order: stroke; stroke-linejoin: round; cursor: default; } .vert-line:hover rect { fill: #911EB4; fill-opacity: 40%; stroke: #FFFFFF60; color: red; } .vert-line:hover text { stroke: white; fill: #212427; } .horizontal-line:hover text {stroke: white; fill: #212427; } .ref-line:hover rect { stroke: #FFFFFF60; } .ref-line:hover line { stroke: #FF0000; } .ref-line:hover text { stroke: white; fill: #212427; } .y-axis-line:hover rect { fill: #EDEDED; fill-opacity: 60%; stroke: #FFFFFF60; color: red; } .y-axis-line:hover text { stroke: white; stroke-width: 0.20em; fill: #1A1C1F; } </style><path d="M50.0,15.0,550.0,15.0,550.0,66.35135135135135,50.0,66.35135135135135Z" stroke="transparent" stroke-width="2" fill="#A6E6F2" fill-opacity="0.8"></path><line x1="22.5" y1="115.0" x2="577.5" y2="115.0" stroke="#BFBFBF" stroke-width="4"></line><rect x="30.0" y="60.945945945945944" width="40" height="54.054054054054056" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="85.55555555555554" y="52.83783783783784" width="40" height="62.16216216216216" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="141.1111111111111" y="98.78378378378379" width="40" height="16.21621621621621" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="196.66666666666666" y="96.08108108108108" width="40" height="18.91891891891892" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="252.22222222222217" y="15.0" width="40" height="100.0" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="307.77777777777777" y="52.83783783783784" width="40" height="62.16216216216216" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="363.3333333333333" y="58.24324324324324" width="40" height="56.75675675675676" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="418.8888888888889" y="104.1891891891892" width="40" height="10.810810810810807" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="474.4444444444444" y="96.08108108108108" width="40" height="18.91891891891892" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="530.0" y="71.75675675675676" width="40" height="43.24324324324324" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><g class="ref-line"><rect x="40.0" y="5.0" width="520" height="20" stroke="transparent" stroke-width="1" fill="transparent"></rect><line class="ref-line" x1="50.0" y1="15.0" x2="550" y2="15.0" stroke="#75A8B0" stroke-width="1" stroke-dasharray="4 3" transform="" stroke-linecap="round" vector-effect="non-scaling-stroke"></line><text x="560" y="25.0" fill="transparent" stroke="transparent" font-size="30px">37.0</text></g><g class="y-axis-line"><rect x="0" y="0" width="65" height="130" stroke="transparent" stroke-width="0" fill="transparent"></rect><text x="0" y="19.0" fill="transparent" stroke="transparent" font-size="25">37</text><text x="0" y="126.0" fill="transparent" stroke="transparent" font-size="25">4</text></g><g class="vert-line"><rect x="40.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="60.0" y="20" fill="transparent" stroke="transparent" font-size="30px">20</text></g><g class="vert-line"><rect x="95.55555555555554" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="115.55555555555554" y="20" fill="transparent" stroke="transparent" font-size="30px">23</text></g><g class="vert-line"><rect x="151.1111111111111" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="171.1111111111111" y="20" fill="transparent" stroke="transparent" font-size="30px">6</text></g><g class="vert-line"><rect x="206.66666666666666" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="226.66666666666666" y="20" fill="transparent" stroke="transparent" font-size="30px">7</text></g><g class="vert-line"><rect x="262.2222222222222" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="282.2222222222222" y="20" fill="transparent" stroke="transparent" font-size="30px">37</text></g><g class="vert-line"><rect x="317.77777777777777" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="337.77777777777777" y="20" fill="transparent" stroke="transparent" font-size="30px">23</text></g><g class="vert-line"><rect x="373.3333333333333" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="393.3333333333333" y="20" fill="transparent" stroke="transparent" font-size="30px">21</text></g><g class="vert-line"><rect x="428.8888888888889" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="448.8888888888889" y="20" fill="transparent" stroke="transparent" font-size="30px">4</text></g><g class="vert-line"><rect x="484.4444444444444" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="504.4444444444444" y="20" fill="transparent" stroke="transparent" font-size="30px">7</text></g><g class="vert-line"><rect x="540.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="560.0" y="20" fill="transparent" stroke="transparent" font-size="30px">16</text></g></svg></div></td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">2</th>
    <td class="gt_row gt_left"><div><svg viewbox="0 0 600 130" style="height: 2em; margin-left: auto; margin-right: auto; font-size: inherit; overflow: visible; vertical-align: middle; position:relative;"><defs><pattern id="area_pattern" width="8" height="8" patternunits="userSpaceOnUse"><path class="pattern-line" d="M 0,8 l 8,-8 M -1,1 l 4,-4 M 6,10 l 4,-4" stroke="#FF0000" stroke-width="1.5" stroke-linecap="round" shape-rendering="geometricPrecision"></path></pattern></defs><style> text { font-family: ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace; stroke-width: 0.15em; paint-order: stroke; stroke-linejoin: round; cursor: default; } .vert-line:hover rect { fill: #911EB4; fill-opacity: 40%; stroke: #FFFFFF60; color: red; } .vert-line:hover text { stroke: white; fill: #212427; } .horizontal-line:hover text {stroke: white; fill: #212427; } .ref-line:hover rect { stroke: #FFFFFF60; } .ref-line:hover line { stroke: #FF0000; } .ref-line:hover text { stroke: white; fill: #212427; } .y-axis-line:hover rect { fill: #EDEDED; fill-opacity: 60%; stroke: #FFFFFF60; color: red; } .y-axis-line:hover text { stroke: white; stroke-width: 0.20em; fill: #1A1C1F; } </style><path d="M50.0,102.75510204081633,550.0,102.75510204081633,550.0,115.0,50.0,115.0Z" stroke="transparent" stroke-width="2" fill="#A6E6F2" fill-opacity="0.8"></path><path class="area-closed" d="M 50.0,115.0 105.55555555555554,69.08163265306123 161.1111111111111,44.591836734693885 216.66666666666666,113.77551020408163 272.2222222222222,102.75510204081633 327.77777777777777,15.0 383.3333333333333,84.38775510204083 438.8888888888889,101.73469387755102 494.4444444444444,65.0 550.0,100.3061224489796 550.0,125 50.0,125 Z" stroke="transparent" stroke-width="2" fill="url(#area_pattern)" fill-opacity="0.7"></path><path d="M 50.0,115.0 C 75.0,115.0 80.55555555555554,69.08163265306123 105.55555555555554,69.08163265306123 C 130.55555555555554,69.08163265306123 136.1111111111111,44.591836734693885 161.1111111111111,44.591836734693885 C 186.1111111111111,44.591836734693885 191.66666666666666,113.77551020408163 216.66666666666666,113.77551020408163 C 241.66666666666666,113.77551020408163 247.22222222222217,102.75510204081633 272.2222222222222,102.75510204081633 C 297.2222222222222,102.75510204081633 302.77777777777777,15.0 327.77777777777777,15.0 C 352.77777777777777,15.0 358.3333333333333,84.38775510204083 383.3333333333333,84.38775510204083 C 408.3333333333333,84.38775510204083 413.8888888888889,101.73469387755102 438.8888888888889,101.73469387755102 C 463.8888888888889,101.73469387755102 469.4444444444444,65.0 494.4444444444444,65.0 C 519.4444444444443,65.0 525.0,100.3061224489796 550.0,100.3061224489796" stroke="#4682B4" stroke-width="8" fill="none"></path><g class="ref-line"><rect x="40.0" y="71.16326530612244" width="520" height="20" stroke="transparent" stroke-width="1" fill="transparent"></rect><line class="ref-line" x1="50.0" y1="81.16326530612244" x2="550" y2="81.16326530612244" stroke="#75A8B0" stroke-width="1" stroke-dasharray="4 3" transform="" stroke-linecap="round" vector-effect="non-scaling-stroke"></line><text x="560" y="91.16326530612244" fill="transparent" stroke="transparent" font-size="30px">5.62</text></g><circle cx="50.0" cy="115.0" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="105.55555555555554" cy="69.08163265306123" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="161.1111111111111" cy="44.591836734693885" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="216.66666666666666" cy="113.77551020408163" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="272.2222222222222" cy="102.75510204081633" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="327.77777777777777" cy="15.0" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="383.3333333333333" cy="84.38775510204083" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="438.8888888888889" cy="101.73469387755102" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="494.4444444444444" cy="65.0" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="550.0" cy="100.3061224489796" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><g class="y-axis-line"><rect x="0" y="0" width="65" height="130" stroke="transparent" stroke-width="0" fill="transparent"></rect><text x="0" y="19.0" fill="transparent" stroke="transparent" font-size="25">12.1</text><text x="0" y="126.0" fill="transparent" stroke="transparent" font-size="25">2.30</text></g><g class="vert-line"><rect x="40.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="60.0" y="20" fill="transparent" stroke="transparent" font-size="30px">2.30</text></g><g class="vert-line"><rect x="95.55555555555554" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="115.55555555555554" y="20" fill="transparent" stroke="transparent" font-size="30px">6.80</text></g><g class="vert-line"><rect x="151.1111111111111" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="171.1111111111111" y="20" fill="transparent" stroke="transparent" font-size="30px">9.20</text></g><g class="vert-line"><rect x="206.66666666666666" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="226.66666666666666" y="20" fill="transparent" stroke="transparent" font-size="30px">2.42</text></g><g class="vert-line"><rect x="262.2222222222222" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="282.2222222222222" y="20" fill="transparent" stroke="transparent" font-size="30px">3.50</text></g><g class="vert-line"><rect x="317.77777777777777" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="337.77777777777777" y="20" fill="transparent" stroke="transparent" font-size="30px">12.1</text></g><g class="vert-line"><rect x="373.3333333333333" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="393.3333333333333" y="20" fill="transparent" stroke="transparent" font-size="30px">5.30</text></g><g class="vert-line"><rect x="428.8888888888889" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="448.8888888888889" y="20" fill="transparent" stroke="transparent" font-size="30px">3.60</text></g><g class="vert-line"><rect x="484.4444444444444" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="504.4444444444444" y="20" fill="transparent" stroke="transparent" font-size="30px">7.20</text></g><g class="vert-line"><rect x="540.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="560.0" y="20" fill="transparent" stroke="transparent" font-size="30px">3.74</text></g></svg></div></td>
    <td class="gt_row gt_left"><div><svg viewbox="0 0 600 130" style="height: 2em; margin-left: auto; margin-right: auto; font-size: inherit; overflow: visible; vertical-align: middle; position:relative;"><defs><pattern id="area_pattern" width="8" height="8" patternunits="userSpaceOnUse"><path class="pattern-line" d="M 0,8 l 8,-8 M -1,1 l 4,-4 M 6,10 l 4,-4" stroke="#FF0000" stroke-width="1.5" stroke-linecap="round" shape-rendering="geometricPrecision"></path></pattern></defs><style> text { font-family: ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace; stroke-width: 0.15em; paint-order: stroke; stroke-linejoin: round; cursor: default; } .vert-line:hover rect { fill: #911EB4; fill-opacity: 40%; stroke: #FFFFFF60; color: red; } .vert-line:hover text { stroke: white; fill: #212427; } .horizontal-line:hover text {stroke: white; fill: #212427; } .ref-line:hover rect { stroke: #FFFFFF60; } .ref-line:hover line { stroke: #FF0000; } .ref-line:hover text { stroke: white; fill: #212427; } .y-axis-line:hover rect { fill: #EDEDED; fill-opacity: 60%; stroke: #FFFFFF60; color: red; } .y-axis-line:hover text { stroke: white; stroke-width: 0.20em; fill: #1A1C1F; } </style><path d="M50.0,15.0,550.0,15.0,550.0,77.64462809917356,50.0,77.64462809917356Z" stroke="transparent" stroke-width="2" fill="#A6E6F2" fill-opacity="0.8"></path><line x1="22.5" y1="115.0" x2="577.5" y2="115.0" stroke="#BFBFBF" stroke-width="4"></line><rect x="30.0" y="95.99173553719008" width="40" height="19.00826446280992" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="85.55555555555554" y="58.80165289256198" width="40" height="56.19834710743802" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="141.1111111111111" y="38.96694214876034" width="40" height="76.03305785123966" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="196.66666666666666" y="95.0" width="40" height="20.0" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="252.22222222222217" y="86.07438016528926" width="40" height="28.925619834710744" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="307.77777777777777" y="15.0" width="40" height="100.0" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="363.3333333333333" y="71.19834710743802" width="40" height="43.801652892561975" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="418.8888888888889" y="85.24793388429752" width="40" height="29.752066115702476" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="474.4444444444444" y="55.49586776859504" width="40" height="59.50413223140496" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="530.0" y="84.0909090909091" width="40" height="30.909090909090907" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><g class="ref-line"><rect x="40.0" y="5.0" width="520" height="20" stroke="transparent" stroke-width="1" fill="transparent"></rect><line class="ref-line" x1="50.0" y1="15.0" x2="550" y2="15.0" stroke="#75A8B0" stroke-width="1" stroke-dasharray="4 3" transform="" stroke-linecap="round" vector-effect="non-scaling-stroke"></line><text x="560" y="25.0" fill="transparent" stroke="transparent" font-size="30px">12.1</text></g><g class="y-axis-line"><rect x="0" y="0" width="65" height="130" stroke="transparent" stroke-width="0" fill="transparent"></rect><text x="0" y="19.0" fill="transparent" stroke="transparent" font-size="25">12.1</text><text x="0" y="126.0" fill="transparent" stroke="transparent" font-size="25">2.30</text></g><g class="vert-line"><rect x="40.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="60.0" y="20" fill="transparent" stroke="transparent" font-size="30px">2.30</text></g><g class="vert-line"><rect x="95.55555555555554" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="115.55555555555554" y="20" fill="transparent" stroke="transparent" font-size="30px">6.80</text></g><g class="vert-line"><rect x="151.1111111111111" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="171.1111111111111" y="20" fill="transparent" stroke="transparent" font-size="30px">9.20</text></g><g class="vert-line"><rect x="206.66666666666666" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="226.66666666666666" y="20" fill="transparent" stroke="transparent" font-size="30px">2.42</text></g><g class="vert-line"><rect x="262.2222222222222" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="282.2222222222222" y="20" fill="transparent" stroke="transparent" font-size="30px">3.50</text></g><g class="vert-line"><rect x="317.77777777777777" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="337.77777777777777" y="20" fill="transparent" stroke="transparent" font-size="30px">12.1</text></g><g class="vert-line"><rect x="373.3333333333333" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="393.3333333333333" y="20" fill="transparent" stroke="transparent" font-size="30px">5.30</text></g><g class="vert-line"><rect x="428.8888888888889" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="448.8888888888889" y="20" fill="transparent" stroke="transparent" font-size="30px">3.60</text></g><g class="vert-line"><rect x="484.4444444444444" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="504.4444444444444" y="20" fill="transparent" stroke="transparent" font-size="30px">7.20</text></g><g class="vert-line"><rect x="540.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="560.0" y="20" fill="transparent" stroke="transparent" font-size="30px">3.74</text></g></svg></div></td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">3</th>
    <td class="gt_row gt_left"><div><svg viewbox="0 0 450 130" style="height: 2em; margin-left: auto; margin-right: auto; font-size: inherit; overflow: visible; vertical-align: middle; position:relative;"><defs><pattern id="area_pattern" width="8" height="8" patternunits="userSpaceOnUse"><path class="pattern-line" d="M 0,8 l 8,-8 M -1,1 l 4,-4 M 6,10 l 4,-4" stroke="#FF0000" stroke-width="1.5" stroke-linecap="round" shape-rendering="geometricPrecision"></path></pattern></defs><style> text { font-family: ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace; stroke-width: 0.15em; paint-order: stroke; stroke-linejoin: round; cursor: default; } .vert-line:hover rect { fill: #911EB4; fill-opacity: 40%; stroke: #FFFFFF60; color: red; } .vert-line:hover text { stroke: white; fill: #212427; } .horizontal-line:hover text {stroke: white; fill: #212427; } .ref-line:hover rect { stroke: #FFFFFF60; } .ref-line:hover line { stroke: #FF0000; } .ref-line:hover text { stroke: white; fill: #212427; } .y-axis-line:hover rect { fill: #EDEDED; fill-opacity: 60%; stroke: #FFFFFF60; color: red; } .y-axis-line:hover text { stroke: white; stroke-width: 0.20em; fill: #1A1C1F; } </style><path d="M50.0,92.0,400.0,92.0,400.0,115.0,50.0,115.0Z" stroke="transparent" stroke-width="2" fill="#A6E6F2" fill-opacity="0.8"></path><path class="area-closed" d="M 50.0,115.0 108.33333333333333,80.0 166.66666666666666,25.0 225.0,36.50000000000001 283.3333333333333,55.0 341.6666666666667,15.0 400.0,92.0 400.0,125 50.0,125 Z" stroke="transparent" stroke-width="2" fill="url(#area_pattern)" fill-opacity="0.7"></path><path d="M 50.0,115.0 C 75.0,115.0 83.33333333333333,80.0 108.33333333333333,80.0 C 133.33333333333331,80.0 141.66666666666666,25.0 166.66666666666666,25.0 C 191.66666666666666,25.0 200.0,36.50000000000001 225.0,36.50000000000001 C 250.0,36.50000000000001 258.3333333333333,55.0 283.3333333333333,55.0 C 308.3333333333333,55.0 316.6666666666667,15.0 341.6666666666667,15.0 C 366.6666666666667,15.0 375.0,92.0 400.0,92.0" stroke="#4682B4" stroke-width="8" fill="none"></path><g class="ref-line"><rect x="40.0" y="49.785714285714285" width="370" height="20" stroke="transparent" stroke-width="1" fill="transparent"></rect><line class="ref-line" x1="50.0" y1="59.785714285714285" x2="400" y2="59.785714285714285" stroke="#75A8B0" stroke-width="1" stroke-dasharray="4 3" transform="" stroke-linecap="round" vector-effect="non-scaling-stroke"></line><text x="410" y="69.78571428571428" fill="transparent" stroke="transparent" font-size="30px">−0.96</text></g><circle cx="50.0" cy="115.0" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="108.33333333333333" cy="80.0" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="166.66666666666666" cy="25.0" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="225.0" cy="36.50000000000001" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="283.3333333333333" cy="55.0" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="341.6666666666667" cy="15.0" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="400.0" cy="92.0" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><g class="y-axis-line"><rect x="0" y="0" width="65" height="130" stroke="transparent" stroke-width="0" fill="transparent"></rect><text x="0" y="19.0" fill="transparent" stroke="transparent" font-size="25">8.00</text><text x="0" y="126.0" fill="transparent" stroke="transparent" font-size="25">−12.0</text></g><g class="vert-line"><rect x="40.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="60.0" y="20" fill="transparent" stroke="transparent" font-size="30px">−12.0</text></g><g class="vert-line"><rect x="98.33333333333333" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="118.33333333333333" y="20" fill="transparent" stroke="transparent" font-size="30px">−5.00</text></g><g class="vert-line"><rect x="156.66666666666666" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="176.66666666666666" y="20" fill="transparent" stroke="transparent" font-size="30px">6.00</text></g><g class="vert-line"><rect x="215.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="235.0" y="20" fill="transparent" stroke="transparent" font-size="30px">3.70</text></g><g class="vert-line"><rect x="273.3333333333333" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="293.3333333333333" y="20" fill="transparent" stroke="transparent" font-size="30px">0</text></g><g class="vert-line"><rect x="331.6666666666667" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="351.6666666666667" y="20" fill="transparent" stroke="transparent" font-size="30px">8.00</text></g><g class="vert-line"><rect x="390.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="410.0" y="20" fill="transparent" stroke="transparent" font-size="30px">−7.40</text></g></svg></div></td>
    <td class="gt_row gt_left"><div><svg viewbox="0 0 450 130" style="height: 2em; margin-left: auto; margin-right: auto; font-size: inherit; overflow: visible; vertical-align: middle; position:relative;"><defs><pattern id="area_pattern" width="8" height="8" patternunits="userSpaceOnUse"><path class="pattern-line" d="M 0,8 l 8,-8 M -1,1 l 4,-4 M 6,10 l 4,-4" stroke="#FF0000" stroke-width="1.5" stroke-linecap="round" shape-rendering="geometricPrecision"></path></pattern></defs><style> text { font-family: ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace; stroke-width: 0.15em; paint-order: stroke; stroke-linejoin: round; cursor: default; } .vert-line:hover rect { fill: #911EB4; fill-opacity: 40%; stroke: #FFFFFF60; color: red; } .vert-line:hover text { stroke: white; fill: #212427; } .horizontal-line:hover text {stroke: white; fill: #212427; } .ref-line:hover rect { stroke: #FFFFFF60; } .ref-line:hover line { stroke: #FF0000; } .ref-line:hover text { stroke: white; fill: #212427; } .y-axis-line:hover rect { fill: #EDEDED; fill-opacity: 60%; stroke: #FFFFFF60; color: red; } .y-axis-line:hover text { stroke: white; stroke-width: 0.20em; fill: #1A1C1F; } </style><path d="M50.0,15.0,400.0,15.0,400.0,55.0,50.0,55.0Z" stroke="transparent" stroke-width="2" fill="#A6E6F2" fill-opacity="0.8"></path><line x1="22.5" y1="55.0" x2="427.5" y2="55.0" stroke="#BFBFBF" stroke-width="4"></line><rect x="30.0" y="55.0" width="40" height="60.0" stroke="#CC3243" stroke-width="4" fill="#D75A68"></rect><rect x="88.33333333333333" y="55.0" width="40" height="25.0" stroke="#CC3243" stroke-width="4" fill="#D75A68"></rect><rect x="146.66666666666666" y="25.0" width="40" height="30.0" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="205.0" y="36.50000000000001" width="40" height="18.499999999999993" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="263.3333333333333" y="54.0" width="40" height="2" stroke="#808080" stroke-width="4" fill="#808080"></rect><rect x="321.6666666666667" y="15.0" width="40" height="40.0" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="380.0" y="55.0" width="40" height="37.0" stroke="#CC3243" stroke-width="4" fill="#D75A68"></rect><g class="ref-line"><rect x="40.0" y="5.0" width="370" height="20" stroke="transparent" stroke-width="1" fill="transparent"></rect><line class="ref-line" x1="50.0" y1="15.0" x2="400" y2="15.0" stroke="#75A8B0" stroke-width="1" stroke-dasharray="4 3" transform="" stroke-linecap="round" vector-effect="non-scaling-stroke"></line><text x="410" y="25.0" fill="transparent" stroke="transparent" font-size="30px">8.00</text></g><g class="y-axis-line"><rect x="0" y="0" width="65" height="130" stroke="transparent" stroke-width="0" fill="transparent"></rect><text x="0" y="19.0" fill="transparent" stroke="transparent" font-size="25">8.00</text><text x="0" y="126.0" fill="transparent" stroke="transparent" font-size="25">−12.0</text></g><g class="vert-line"><rect x="40.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="60.0" y="20" fill="transparent" stroke="transparent" font-size="30px">−12.0</text></g><g class="vert-line"><rect x="98.33333333333333" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="118.33333333333333" y="20" fill="transparent" stroke="transparent" font-size="30px">−5.00</text></g><g class="vert-line"><rect x="156.66666666666666" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="176.66666666666666" y="20" fill="transparent" stroke="transparent" font-size="30px">6.00</text></g><g class="vert-line"><rect x="215.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="235.0" y="20" fill="transparent" stroke="transparent" font-size="30px">3.70</text></g><g class="vert-line"><rect x="273.3333333333333" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="293.3333333333333" y="20" fill="transparent" stroke="transparent" font-size="30px">0</text></g><g class="vert-line"><rect x="331.6666666666667" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="351.6666666666667" y="20" fill="transparent" stroke="transparent" font-size="30px">8.00</text></g><g class="vert-line"><rect x="390.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="410.0" y="20" fill="transparent" stroke="transparent" font-size="30px">−7.40</text></g></svg></div></td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">4</th>
    <td class="gt_row gt_left"><div><svg viewbox="0 0 650 130" style="height: 2em; margin-left: auto; margin-right: auto; font-size: inherit; overflow: visible; vertical-align: middle; position:relative;"><defs><pattern id="area_pattern" width="8" height="8" patternunits="userSpaceOnUse"><path class="pattern-line" d="M 0,8 l 8,-8 M -1,1 l 4,-4 M 6,10 l 4,-4" stroke="#FF0000" stroke-width="1.5" stroke-linecap="round" shape-rendering="geometricPrecision"></path></pattern></defs><style> text { font-family: ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace; stroke-width: 0.15em; paint-order: stroke; stroke-linejoin: round; cursor: default; } .vert-line:hover rect { fill: #911EB4; fill-opacity: 40%; stroke: #FFFFFF60; color: red; } .vert-line:hover text { stroke: white; fill: #212427; } .horizontal-line:hover text {stroke: white; fill: #212427; } .ref-line:hover rect { stroke: #FFFFFF60; } .ref-line:hover line { stroke: #FF0000; } .ref-line:hover text { stroke: white; fill: #212427; } .y-axis-line:hover rect { fill: #EDEDED; fill-opacity: 60%; stroke: #FFFFFF60; color: red; } .y-axis-line:hover text { stroke: white; stroke-width: 0.20em; fill: #1A1C1F; } </style><path d="M50.0,106.66666666666666,600.0,106.66666666666666,600.0,115.0,50.0,115.0Z" stroke="transparent" stroke-width="2" fill="#A6E6F2" fill-opacity="0.8"></path><path class="area-closed" d="M 50.0,106.66666666666666 105.0,115.0 160.0,52.5 215.0,85.83333333333333 270.0,81.66666666666667 325.0,73.33333333333333 380.0,110.83333333333334 435.0,15.0 490.0,44.166666666666664 545.0,60.833333333333336 600.0,90.0 600.0,125 50.0,125 Z" stroke="transparent" stroke-width="2" fill="url(#area_pattern)" fill-opacity="0.7"></path><path d="M 50.0,106.66666666666666 C 75.0,106.66666666666666 80.0,115.0 105.0,115.0 C 130.0,115.0 135.0,52.5 160.0,52.5 C 185.0,52.5 190.0,85.83333333333333 215.0,85.83333333333333 C 240.0,85.83333333333333 245.0,81.66666666666667 270.0,81.66666666666667 C 295.0,81.66666666666667 300.0,73.33333333333333 325.0,73.33333333333333 C 350.0,73.33333333333333 355.0,110.83333333333334 380.0,110.83333333333334 C 405.0,110.83333333333334 410.0,15.0 435.0,15.0 C 460.0,15.0 465.0,44.166666666666664 490.0,44.166666666666664 C 515.0,44.166666666666664 520.0,60.833333333333336 545.0,60.833333333333336 C 570.0,60.833333333333336 575.0,90.0 600.0,90.0" stroke="#4682B4" stroke-width="8" fill="none"></path><g class="ref-line"><rect x="40.0" y="65.98484848484848" width="570" height="20" stroke="transparent" stroke-width="1" fill="transparent"></rect><line class="ref-line" x1="50.0" y1="75.98484848484848" x2="600" y2="75.98484848484848" stroke="#75A8B0" stroke-width="1" stroke-dasharray="4 3" transform="" stroke-linecap="round" vector-effect="non-scaling-stroke"></line><text x="610" y="85.98484848484848" fill="transparent" stroke="transparent" font-size="30px">9.36</text></g><circle cx="50.0" cy="106.66666666666666" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="105.0" cy="115.0" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="160.0" cy="52.5" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="215.0" cy="85.83333333333333" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="270.0" cy="81.66666666666667" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="325.0" cy="73.33333333333333" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="380.0" cy="110.83333333333334" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="435.0" cy="15.0" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="490.0" cy="44.166666666666664" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="545.0" cy="60.833333333333336" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><circle cx="600.0" cy="90.0" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle><g class="y-axis-line"><rect x="0" y="0" width="65" height="130" stroke="transparent" stroke-width="0" fill="transparent"></rect><text x="0" y="19.0" fill="transparent" stroke="transparent" font-size="25">24</text><text x="0" y="126.0" fill="transparent" stroke="transparent" font-size="25">0</text></g><g class="vert-line"><rect x="40.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="60.0" y="20" fill="transparent" stroke="transparent" font-size="30px">2</text></g><g class="vert-line"><rect x="95.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="115.0" y="20" fill="transparent" stroke="transparent" font-size="30px">0</text></g><g class="vert-line"><rect x="150.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="170.0" y="20" fill="transparent" stroke="transparent" font-size="30px">15</text></g><g class="vert-line"><rect x="205.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="225.0" y="20" fill="transparent" stroke="transparent" font-size="30px">7</text></g><g class="vert-line"><rect x="260.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="280.0" y="20" fill="transparent" stroke="transparent" font-size="30px">8</text></g><g class="vert-line"><rect x="315.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="335.0" y="20" fill="transparent" stroke="transparent" font-size="30px">10</text></g><g class="vert-line"><rect x="370.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="390.0" y="20" fill="transparent" stroke="transparent" font-size="30px">1</text></g><g class="vert-line"><rect x="425.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="445.0" y="20" fill="transparent" stroke="transparent" font-size="30px">24</text></g><g class="vert-line"><rect x="480.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="500.0" y="20" fill="transparent" stroke="transparent" font-size="30px">17</text></g><g class="vert-line"><rect x="535.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="555.0" y="20" fill="transparent" stroke="transparent" font-size="30px">13</text></g><g class="vert-line"><rect x="590.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="610.0" y="20" fill="transparent" stroke="transparent" font-size="30px">6</text></g></svg></div></td>
    <td class="gt_row gt_left"><div><svg viewbox="0 0 650 130" style="height: 2em; margin-left: auto; margin-right: auto; font-size: inherit; overflow: visible; vertical-align: middle; position:relative;"><defs><pattern id="area_pattern" width="8" height="8" patternunits="userSpaceOnUse"><path class="pattern-line" d="M 0,8 l 8,-8 M -1,1 l 4,-4 M 6,10 l 4,-4" stroke="#FF0000" stroke-width="1.5" stroke-linecap="round" shape-rendering="geometricPrecision"></path></pattern></defs><style> text { font-family: ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace; stroke-width: 0.15em; paint-order: stroke; stroke-linejoin: round; cursor: default; } .vert-line:hover rect { fill: #911EB4; fill-opacity: 40%; stroke: #FFFFFF60; color: red; } .vert-line:hover text { stroke: white; fill: #212427; } .horizontal-line:hover text {stroke: white; fill: #212427; } .ref-line:hover rect { stroke: #FFFFFF60; } .ref-line:hover line { stroke: #FF0000; } .ref-line:hover text { stroke: white; fill: #212427; } .y-axis-line:hover rect { fill: #EDEDED; fill-opacity: 60%; stroke: #FFFFFF60; color: red; } .y-axis-line:hover text { stroke: white; stroke-width: 0.20em; fill: #1A1C1F; } </style><path d="M50.0,15.0,600.0,15.0,600.0,81.66666666666667,50.0,81.66666666666667Z" stroke="transparent" stroke-width="2" fill="#A6E6F2" fill-opacity="0.8"></path><line x1="22.5" y1="115.0" x2="627.5" y2="115.0" stroke="#BFBFBF" stroke-width="4"></line><rect x="30.0" y="106.66666666666666" width="40" height="8.333333333333343" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="85.0" y="114.0" width="40" height="2" stroke="#808080" stroke-width="4" fill="#808080"></rect><rect x="140.0" y="52.5" width="40" height="62.5" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="195.0" y="85.83333333333333" width="40" height="29.16666666666667" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="250.0" y="81.66666666666667" width="40" height="33.33333333333333" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="305.0" y="73.33333333333333" width="40" height="41.66666666666667" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="360.0" y="110.83333333333334" width="40" height="4.166666666666657" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="415.0" y="15.0" width="40" height="100.0" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="470.0" y="44.166666666666664" width="40" height="70.83333333333334" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="525.0" y="60.833333333333336" width="40" height="54.166666666666664" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><rect x="580.0" y="90.0" width="40" height="25.0" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><g class="ref-line"><rect x="40.0" y="5.0" width="570" height="20" stroke="transparent" stroke-width="1" fill="transparent"></rect><line class="ref-line" x1="50.0" y1="15.0" x2="600" y2="15.0" stroke="#75A8B0" stroke-width="1" stroke-dasharray="4 3" transform="" stroke-linecap="round" vector-effect="non-scaling-stroke"></line><text x="610" y="25.0" fill="transparent" stroke="transparent" font-size="30px">24.0</text></g><g class="y-axis-line"><rect x="0" y="0" width="65" height="130" stroke="transparent" stroke-width="0" fill="transparent"></rect><text x="0" y="19.0" fill="transparent" stroke="transparent" font-size="25">24</text><text x="0" y="126.0" fill="transparent" stroke="transparent" font-size="25">0</text></g><g class="vert-line"><rect x="40.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="60.0" y="20" fill="transparent" stroke="transparent" font-size="30px">2</text></g><g class="vert-line"><rect x="95.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="115.0" y="20" fill="transparent" stroke="transparent" font-size="30px">0</text></g><g class="vert-line"><rect x="150.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="170.0" y="20" fill="transparent" stroke="transparent" font-size="30px">15</text></g><g class="vert-line"><rect x="205.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="225.0" y="20" fill="transparent" stroke="transparent" font-size="30px">7</text></g><g class="vert-line"><rect x="260.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="280.0" y="20" fill="transparent" stroke="transparent" font-size="30px">8</text></g><g class="vert-line"><rect x="315.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="335.0" y="20" fill="transparent" stroke="transparent" font-size="30px">10</text></g><g class="vert-line"><rect x="370.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="390.0" y="20" fill="transparent" stroke="transparent" font-size="30px">1</text></g><g class="vert-line"><rect x="425.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="445.0" y="20" fill="transparent" stroke="transparent" font-size="30px">24</text></g><g class="vert-line"><rect x="480.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="500.0" y="20" fill="transparent" stroke="transparent" font-size="30px">17</text></g><g class="vert-line"><rect x="535.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="555.0" y="20" fill="transparent" stroke="transparent" font-size="30px">13</text></g><g class="vert-line"><rect x="590.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="610.0" y="20" fill="transparent" stroke="transparent" font-size="30px">6</text></g></svg></div></td>
  </tr>
</tbody>


</table>

</div>
</div>
</div>
<p>Having a reference line and/or area can be valuable in different situations. We make it easy by allowing you to mix-and-match numeric values and a set of keywords (these are: <code>"mean"</code>, <code>"median"</code>, <code>"min"</code>, <code>"max"</code>, <code>"q1"</code>, <code>"q3"</code>, <code>"first"</code>, or <code>"last"</code>).</p>
</section>
<section id="simple-bars" class="level3">
<h3 class="anchored" data-anchor-id="simple-bars">Simple bars</h3>
<p>We can also have single-value bar plots and line plots. These will run in the horizontal direction and such plots are meant for easy value comparisons (which works great in tables). To make this work, give <a href="../../reference/GT.fmt_nanoplot.html#great_tables.GT.fmt_nanoplot"><code>fmt_nanoplot()</code></a> a column of numeric values. The following example shows how <a href="../../reference/GT.fmt_nanoplot.html#great_tables.GT.fmt_nanoplot"><code>fmt_nanoplot()</code></a> can be used to create single-value bar and line plots.</p>
<div id="da505040" class="cell" data-execution_count="4">
<div class="code-copy-outer-scaffold"><div class="sourceCode cell-code" id="cb4" style="background: #f1f3f5;"><pre class="sourceCode python code-with-copy"><code class="sourceCode python"><span id="cb4-1">single_vals_df <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> pl.DataFrame(</span>
<span id="cb4-2">    {</span>
<span id="cb4-3">        <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"i"</span>: <span class="bu" style="color: null;
background-color: null;
font-style: inherit;">range</span>(<span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">1</span>, <span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">6</span>),</span>
<span id="cb4-4">        <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"bars"</span>: [<span class="fl" style="color: #AD0000;
background-color: null;
font-style: inherit;">4.1</span>, <span class="fl" style="color: #AD0000;
background-color: null;
font-style: inherit;">1.3</span>, <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">-</span><span class="fl" style="color: #AD0000;
background-color: null;
font-style: inherit;">5.3</span>, <span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">0</span>, <span class="fl" style="color: #AD0000;
background-color: null;
font-style: inherit;">8.2</span>],</span>
<span id="cb4-5">        <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"lines"</span>: [<span class="fl" style="color: #AD0000;
background-color: null;
font-style: inherit;">12.44</span>, <span class="fl" style="color: #AD0000;
background-color: null;
font-style: inherit;">6.34</span>, <span class="fl" style="color: #AD0000;
background-color: null;
font-style: inherit;">5.2</span>, <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">-</span><span class="fl" style="color: #AD0000;
background-color: null;
font-style: inherit;">8.2</span>, <span class="fl" style="color: #AD0000;
background-color: null;
font-style: inherit;">9.23</span>]</span>
<span id="cb4-6">    }</span>
<span id="cb4-7">)</span>
<span id="cb4-8"></span>
<span id="cb4-9">(</span>
<span id="cb4-10">    GT(single_vals_df, rowname_col<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"i"</span>)</span>
<span id="cb4-11">    .fmt_nanoplot(columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"bars"</span>, plot_type<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"bar"</span>)</span>
<span id="cb4-12">    .fmt_nanoplot(columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"lines"</span>, plot_type<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"line"</span>)</span>
<span id="cb4-13">)</span></code></pre></div></div>
<div class="cell-output cell-output-display" data-execution_count="4">
<div id="ceyqwmfekg" style="padding-left:0px;padding-right:0px;padding-top:10px;padding-bottom:10px;overflow-x:auto;overflow-y:auto;width:auto;height:auto;">
<style>
#ceyqwmfekg table {
          font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Helvetica Neue', 'Fira Sans', 'Droid Sans', Arial, sans-serif;
          -webkit-font-smoothing: antialiased;
          -moz-osx-font-smoothing: grayscale;
        }

#ceyqwmfekg thead, tbody, tfoot, tr, td, th { border-style: none; }
 tr { background-color: transparent; }
#ceyqwmfekg p { margin: 0; padding: 0; }
 #ceyqwmfekg .gt_table { display: table; border-collapse: collapse; line-height: normal; margin-left: auto; margin-right: auto; color: #333333; font-size: 16px; font-weight: normal; font-style: normal; background-color: #FFFFFF; width: auto; border-top-style: solid; border-top-width: 2px; border-top-color: #A8A8A8; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #A8A8A8; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; }
 #ceyqwmfekg .gt_caption { padding-top: 4px; padding-bottom: 4px; }
 #ceyqwmfekg .gt_title { color: #333333; font-size: 125%; font-weight: initial; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; border-bottom-color: #FFFFFF; border-bottom-width: 0; }
 #ceyqwmfekg .gt_subtitle { color: #333333; font-size: 85%; font-weight: initial; padding-top: 3px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; border-top-color: #FFFFFF; border-top-width: 0; }
 #ceyqwmfekg .gt_heading { background-color: #FFFFFF; text-align: center; border-bottom-color: #FFFFFF; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #ceyqwmfekg .gt_bottom_border { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #ceyqwmfekg .gt_col_headings { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #ceyqwmfekg .gt_col_heading { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; overflow-x: hidden; }
 #ceyqwmfekg .gt_column_spanner_outer { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; padding-top: 0; padding-bottom: 0; padding-left: 4px; padding-right: 4px; }
 #ceyqwmfekg .gt_column_spanner_outer:first-child { padding-left: 0; }
 #ceyqwmfekg .gt_column_spanner_outer:last-child { padding-right: 0; }
 #ceyqwmfekg .gt_column_spanner { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; overflow-x: hidden; display: inline-block; width: 100%; }
 #ceyqwmfekg .gt_spanner_row { border-bottom-style: hidden; }
 #ceyqwmfekg .gt_group_heading { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; text-align: left; }
 #ceyqwmfekg .gt_empty_group_heading { padding: 0.5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: middle; }
 #ceyqwmfekg .gt_from_md> :first-child { margin-top: 0; }
 #ceyqwmfekg .gt_from_md> :last-child { margin-bottom: 0; }
 #ceyqwmfekg .gt_row { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; margin: 10px; border-top-style: solid; border-top-width: 1px; border-top-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; overflow-x: hidden; }
 #ceyqwmfekg .gt_stub { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; }
 #ceyqwmfekg .gt_stub_row_group { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; vertical-align: top; }
 #ceyqwmfekg .gt_row_group_first td { border-top-width: 2px; }
 #ceyqwmfekg .gt_row_group_first th { border-top-width: 2px; }
 #ceyqwmfekg .gt_striped { color: #333333; background-color: #F4F4F4; }
 #ceyqwmfekg .gt_table_body { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #ceyqwmfekg .gt_grand_summary_row { color: #333333; background-color: #FFFFFF; text-transform: inherit; padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; }
 #ceyqwmfekg .gt_first_grand_summary_row_bottom { border-top-style: double; border-top-width: 6px; border-top-color: #D3D3D3; }
 #ceyqwmfekg .gt_last_grand_summary_row_top { border-bottom-style: double; border-bottom-width: 6px; border-bottom-color: #D3D3D3; }
 #ceyqwmfekg .gt_sourcenotes { color: #333333; background-color: #FFFFFF; border-bottom-style: none; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; }
 #ceyqwmfekg .gt_sourcenote { font-size: 90%; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; text-align: left; }
 #ceyqwmfekg .gt_left { text-align: left; }
 #ceyqwmfekg .gt_center { text-align: center; }
 #ceyqwmfekg .gt_right { text-align: right; font-variant-numeric: tabular-nums; }
 #ceyqwmfekg .gt_font_normal { font-weight: normal; }
 #ceyqwmfekg .gt_font_bold { font-weight: bold; }
 #ceyqwmfekg .gt_font_italic { font-style: italic; }
 #ceyqwmfekg .gt_super { font-size: 65%; }
 #ceyqwmfekg .gt_footnote_marks { font-size: 75%; vertical-align: 0.4em; position: initial; }
 #ceyqwmfekg .gt_asterisk { font-size: 100%; vertical-align: 0; }
 
</style>
<table class="gt_table" data-quarto-disable-processing="false" data-quarto-bootstrap="false">
<thead>

<tr class="gt_col_headings">
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="1" colspan="1" scope="col" id=""></th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="bars">bars</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="lines">lines</th>
</tr>
</thead>
<tbody class="gt_table_body">
  <tr>
    <th class="gt_row gt_left gt_stub">1</th>
    <td class="gt_row gt_right"><div><svg viewbox="0 0 600 130" style="height: 2em; margin-left: auto; margin-right: auto; font-size: inherit; overflow: visible; vertical-align: middle; position:relative;"><defs><pattern id="area_pattern" width="8" height="8" patternunits="userSpaceOnUse"><path class="pattern-line" d="M 0,8 l 8,-8 M -1,1 l 4,-4 M 6,10 l 4,-4" stroke="#FF0000" stroke-width="1.5" stroke-linecap="round" shape-rendering="geometricPrecision"></path></pattern></defs><style> text { font-family: ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace; stroke-width: 0.15em; paint-order: stroke; stroke-linejoin: round; cursor: default; } .vert-line:hover rect { fill: #911EB4; fill-opacity: 40%; stroke: #FFFFFF60; color: red; } .vert-line:hover text { stroke: white; fill: #212427; } .horizontal-line:hover text {stroke: white; fill: #212427; } .ref-line:hover rect { stroke: #FFFFFF60; } .ref-line:hover line { stroke: #FF0000; } .ref-line:hover text { stroke: white; fill: #212427; } .y-axis-line:hover rect { fill: #EDEDED; fill-opacity: 60%; stroke: #FFFFFF60; color: red; } .y-axis-line:hover text { stroke: white; stroke-width: 0.20em; fill: #1A1C1F; } </style><line x1="235.55555555555557" y1="5.0" x2="235.55555555555557" y2="125.0" stroke="#BFBFBF" stroke-width="4"></line><rect x="235.55555555555557" y="45.0" width="182.22222222222214" height="40" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><g class="horizontal-line"><rect x="0" y="45.0" width="600" height="40" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="245.55555555555557" y="25" fill="transparent" stroke="transparent" font-size="30px">4.10</text></g></svg></div></td>
    <td class="gt_row gt_right"><div><svg viewbox="0 0 600 130" style="height: 2em; margin-left: auto; margin-right: auto; font-size: inherit; overflow: visible; vertical-align: middle; position:relative;"><defs><pattern id="area_pattern" width="8" height="8" patternunits="userSpaceOnUse"><path class="pattern-line" d="M 0,8 l 8,-8 M -1,1 l 4,-4 M 6,10 l 4,-4" stroke="#FF0000" stroke-width="1.5" stroke-linecap="round" shape-rendering="geometricPrecision"></path></pattern></defs><style> text { font-family: ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace; stroke-width: 0.15em; paint-order: stroke; stroke-linejoin: round; cursor: default; } .vert-line:hover rect { fill: #911EB4; fill-opacity: 40%; stroke: #FFFFFF60; color: red; } .vert-line:hover text { stroke: white; fill: #212427; } .horizontal-line:hover text {stroke: white; fill: #212427; } .ref-line:hover rect { stroke: #FFFFFF60; } .ref-line:hover line { stroke: #FF0000; } .ref-line:hover text { stroke: white; fill: #212427; } .y-axis-line:hover rect { fill: #EDEDED; fill-opacity: 60%; stroke: #FFFFFF60; color: red; } .y-axis-line:hover text { stroke: white; stroke-width: 0.20em; fill: #1A1C1F; } </style><line x1="238.37209302325576" y1="65.0" x2="600.0" y2="65.0" stroke="#4682B4" stroke-width="8"></line><g class="horizontal-line"><rect x="0" y="45.0" width="600" height="40" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="248.37209302325576" y="25" fill="transparent" stroke="transparent" font-size="30px">12.4</text></g><line x1="238.37209302325576" y1="5.0" x2="238.37209302325576" y2="125.0" stroke="#BFBFBF" stroke-width="4"></line><circle cx="600.0" cy="65.0" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle></svg></div></td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">2</th>
    <td class="gt_row gt_right"><div><svg viewbox="0 0 600 130" style="height: 2em; margin-left: auto; margin-right: auto; font-size: inherit; overflow: visible; vertical-align: middle; position:relative;"><defs><pattern id="area_pattern" width="8" height="8" patternunits="userSpaceOnUse"><path class="pattern-line" d="M 0,8 l 8,-8 M -1,1 l 4,-4 M 6,10 l 4,-4" stroke="#FF0000" stroke-width="1.5" stroke-linecap="round" shape-rendering="geometricPrecision"></path></pattern></defs><style> text { font-family: ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace; stroke-width: 0.15em; paint-order: stroke; stroke-linejoin: round; cursor: default; } .vert-line:hover rect { fill: #911EB4; fill-opacity: 40%; stroke: #FFFFFF60; color: red; } .vert-line:hover text { stroke: white; fill: #212427; } .horizontal-line:hover text {stroke: white; fill: #212427; } .ref-line:hover rect { stroke: #FFFFFF60; } .ref-line:hover line { stroke: #FF0000; } .ref-line:hover text { stroke: white; fill: #212427; } .y-axis-line:hover rect { fill: #EDEDED; fill-opacity: 60%; stroke: #FFFFFF60; color: red; } .y-axis-line:hover text { stroke: white; stroke-width: 0.20em; fill: #1A1C1F; } </style><line x1="235.55555555555557" y1="5.0" x2="235.55555555555557" y2="125.0" stroke="#BFBFBF" stroke-width="4"></line><rect x="235.55555555555557" y="45.0" width="57.77777777777774" height="40" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><g class="horizontal-line"><rect x="0" y="45.0" width="600" height="40" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="245.55555555555557" y="25" fill="transparent" stroke="transparent" font-size="30px">1.30</text></g></svg></div></td>
    <td class="gt_row gt_right"><div><svg viewbox="0 0 600 130" style="height: 2em; margin-left: auto; margin-right: auto; font-size: inherit; overflow: visible; vertical-align: middle; position:relative;"><defs><pattern id="area_pattern" width="8" height="8" patternunits="userSpaceOnUse"><path class="pattern-line" d="M 0,8 l 8,-8 M -1,1 l 4,-4 M 6,10 l 4,-4" stroke="#FF0000" stroke-width="1.5" stroke-linecap="round" shape-rendering="geometricPrecision"></path></pattern></defs><style> text { font-family: ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace; stroke-width: 0.15em; paint-order: stroke; stroke-linejoin: round; cursor: default; } .vert-line:hover rect { fill: #911EB4; fill-opacity: 40%; stroke: #FFFFFF60; color: red; } .vert-line:hover text { stroke: white; fill: #212427; } .horizontal-line:hover text {stroke: white; fill: #212427; } .ref-line:hover rect { stroke: #FFFFFF60; } .ref-line:hover line { stroke: #FF0000; } .ref-line:hover text { stroke: white; fill: #212427; } .y-axis-line:hover rect { fill: #EDEDED; fill-opacity: 60%; stroke: #FFFFFF60; color: red; } .y-axis-line:hover text { stroke: white; stroke-width: 0.20em; fill: #1A1C1F; } </style><line x1="238.37209302325576" y1="65.0" x2="422.6744186046511" y2="65.0" stroke="#4682B4" stroke-width="8"></line><g class="horizontal-line"><rect x="0" y="45.0" width="600" height="40" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="248.37209302325576" y="25" fill="transparent" stroke="transparent" font-size="30px">6.34</text></g><line x1="238.37209302325576" y1="5.0" x2="238.37209302325576" y2="125.0" stroke="#BFBFBF" stroke-width="4"></line><circle cx="422.6744186046511" cy="65.0" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle></svg></div></td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">3</th>
    <td class="gt_row gt_right"><div><svg viewbox="0 0 600 130" style="height: 2em; margin-left: auto; margin-right: auto; font-size: inherit; overflow: visible; vertical-align: middle; position:relative;"><defs><pattern id="area_pattern" width="8" height="8" patternunits="userSpaceOnUse"><path class="pattern-line" d="M 0,8 l 8,-8 M -1,1 l 4,-4 M 6,10 l 4,-4" stroke="#FF0000" stroke-width="1.5" stroke-linecap="round" shape-rendering="geometricPrecision"></path></pattern></defs><style> text { font-family: ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace; stroke-width: 0.15em; paint-order: stroke; stroke-linejoin: round; cursor: default; } .vert-line:hover rect { fill: #911EB4; fill-opacity: 40%; stroke: #FFFFFF60; color: red; } .vert-line:hover text { stroke: white; fill: #212427; } .horizontal-line:hover text {stroke: white; fill: #212427; } .ref-line:hover rect { stroke: #FFFFFF60; } .ref-line:hover line { stroke: #FF0000; } .ref-line:hover text { stroke: white; fill: #212427; } .y-axis-line:hover rect { fill: #EDEDED; fill-opacity: 60%; stroke: #FFFFFF60; color: red; } .y-axis-line:hover text { stroke: white; stroke-width: 0.20em; fill: #1A1C1F; } </style><line x1="235.55555555555557" y1="5.0" x2="235.55555555555557" y2="125.0" stroke="#BFBFBF" stroke-width="4"></line><rect x="0.0" y="45.0" width="235.55555555555557" height="40" stroke="#CC3243" stroke-width="4" fill="#D75A68"></rect><g class="horizontal-line"><rect x="0" y="45.0" width="600" height="40" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="225.55555555555557" y="25" fill="transparent" stroke="transparent" font-size="30px" text-anchor="end">−5.30</text></g></svg></div></td>
    <td class="gt_row gt_right"><div><svg viewbox="0 0 600 130" style="height: 2em; margin-left: auto; margin-right: auto; font-size: inherit; overflow: visible; vertical-align: middle; position:relative;"><defs><pattern id="area_pattern" width="8" height="8" patternunits="userSpaceOnUse"><path class="pattern-line" d="M 0,8 l 8,-8 M -1,1 l 4,-4 M 6,10 l 4,-4" stroke="#FF0000" stroke-width="1.5" stroke-linecap="round" shape-rendering="geometricPrecision"></path></pattern></defs><style> text { font-family: ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace; stroke-width: 0.15em; paint-order: stroke; stroke-linejoin: round; cursor: default; } .vert-line:hover rect { fill: #911EB4; fill-opacity: 40%; stroke: #FFFFFF60; color: red; } .vert-line:hover text { stroke: white; fill: #212427; } .horizontal-line:hover text {stroke: white; fill: #212427; } .ref-line:hover rect { stroke: #FFFFFF60; } .ref-line:hover line { stroke: #FF0000; } .ref-line:hover text { stroke: white; fill: #212427; } .y-axis-line:hover rect { fill: #EDEDED; fill-opacity: 60%; stroke: #FFFFFF60; color: red; } .y-axis-line:hover text { stroke: white; stroke-width: 0.20em; fill: #1A1C1F; } </style><line x1="238.37209302325576" y1="65.0" x2="389.53488372093017" y2="65.0" stroke="#4682B4" stroke-width="8"></line><g class="horizontal-line"><rect x="0" y="45.0" width="600" height="40" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="248.37209302325576" y="25" fill="transparent" stroke="transparent" font-size="30px">5.20</text></g><line x1="238.37209302325576" y1="5.0" x2="238.37209302325576" y2="125.0" stroke="#BFBFBF" stroke-width="4"></line><circle cx="389.53488372093017" cy="65.0" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle></svg></div></td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">4</th>
    <td class="gt_row gt_right"><div><svg viewbox="0 0 600 130" style="height: 2em; margin-left: auto; margin-right: auto; font-size: inherit; overflow: visible; vertical-align: middle; position:relative;"><defs><pattern id="area_pattern" width="8" height="8" patternunits="userSpaceOnUse"><path class="pattern-line" d="M 0,8 l 8,-8 M -1,1 l 4,-4 M 6,10 l 4,-4" stroke="#FF0000" stroke-width="1.5" stroke-linecap="round" shape-rendering="geometricPrecision"></path></pattern></defs><style> text { font-family: ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace; stroke-width: 0.15em; paint-order: stroke; stroke-linejoin: round; cursor: default; } .vert-line:hover rect { fill: #911EB4; fill-opacity: 40%; stroke: #FFFFFF60; color: red; } .vert-line:hover text { stroke: white; fill: #212427; } .horizontal-line:hover text {stroke: white; fill: #212427; } .ref-line:hover rect { stroke: #FFFFFF60; } .ref-line:hover line { stroke: #FF0000; } .ref-line:hover text { stroke: white; fill: #212427; } .y-axis-line:hover rect { fill: #EDEDED; fill-opacity: 60%; stroke: #FFFFFF60; color: red; } .y-axis-line:hover text { stroke: white; stroke-width: 0.20em; fill: #1A1C1F; } </style><line x1="235.55555555555557" y1="5.0" x2="235.55555555555557" y2="125.0" stroke="#BFBFBF" stroke-width="4"></line><rect x="233.05555555555557" y="45.0" width="5" height="40" stroke="#808080" stroke-width="4" fill="#808080"></rect><g class="horizontal-line"><rect x="0" y="45.0" width="600" height="40" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="245.55555555555557" y="75.0" fill="transparent" stroke="transparent" font-size="30px" text-anchor="start">0</text></g></svg></div></td>
    <td class="gt_row gt_right"><div><svg viewbox="0 0 600 130" style="height: 2em; margin-left: auto; margin-right: auto; font-size: inherit; overflow: visible; vertical-align: middle; position:relative;"><defs><pattern id="area_pattern" width="8" height="8" patternunits="userSpaceOnUse"><path class="pattern-line" d="M 0,8 l 8,-8 M -1,1 l 4,-4 M 6,10 l 4,-4" stroke="#FF0000" stroke-width="1.5" stroke-linecap="round" shape-rendering="geometricPrecision"></path></pattern></defs><style> text { font-family: ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace; stroke-width: 0.15em; paint-order: stroke; stroke-linejoin: round; cursor: default; } .vert-line:hover rect { fill: #911EB4; fill-opacity: 40%; stroke: #FFFFFF60; color: red; } .vert-line:hover text { stroke: white; fill: #212427; } .horizontal-line:hover text {stroke: white; fill: #212427; } .ref-line:hover rect { stroke: #FFFFFF60; } .ref-line:hover line { stroke: #FF0000; } .ref-line:hover text { stroke: white; fill: #212427; } .y-axis-line:hover rect { fill: #EDEDED; fill-opacity: 60%; stroke: #FFFFFF60; color: red; } .y-axis-line:hover text { stroke: white; stroke-width: 0.20em; fill: #1A1C1F; } </style><line x1="0.0" y1="65.0" x2="238.37209302325576" y2="65.0" stroke="#4682B4" stroke-width="8"></line><g class="horizontal-line"><rect x="0" y="45.0" width="600" height="40" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="228.37209302325576" y="25" fill="transparent" stroke="transparent" font-size="30px" text-anchor="end">−8.20</text></g><line x1="238.37209302325576" y1="5.0" x2="238.37209302325576" y2="125.0" stroke="#BFBFBF" stroke-width="4"></line><circle cx="0.0" cy="65.0" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle></svg></div></td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">5</th>
    <td class="gt_row gt_right"><div><svg viewbox="0 0 600 130" style="height: 2em; margin-left: auto; margin-right: auto; font-size: inherit; overflow: visible; vertical-align: middle; position:relative;"><defs><pattern id="area_pattern" width="8" height="8" patternunits="userSpaceOnUse"><path class="pattern-line" d="M 0,8 l 8,-8 M -1,1 l 4,-4 M 6,10 l 4,-4" stroke="#FF0000" stroke-width="1.5" stroke-linecap="round" shape-rendering="geometricPrecision"></path></pattern></defs><style> text { font-family: ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace; stroke-width: 0.15em; paint-order: stroke; stroke-linejoin: round; cursor: default; } .vert-line:hover rect { fill: #911EB4; fill-opacity: 40%; stroke: #FFFFFF60; color: red; } .vert-line:hover text { stroke: white; fill: #212427; } .horizontal-line:hover text {stroke: white; fill: #212427; } .ref-line:hover rect { stroke: #FFFFFF60; } .ref-line:hover line { stroke: #FF0000; } .ref-line:hover text { stroke: white; fill: #212427; } .y-axis-line:hover rect { fill: #EDEDED; fill-opacity: 60%; stroke: #FFFFFF60; color: red; } .y-axis-line:hover text { stroke: white; stroke-width: 0.20em; fill: #1A1C1F; } </style><line x1="235.55555555555557" y1="5.0" x2="235.55555555555557" y2="125.0" stroke="#BFBFBF" stroke-width="4"></line><rect x="235.55555555555557" y="45.0" width="364.44444444444446" height="40" stroke="#3290CC" stroke-width="4" fill="#3FB5FF"></rect><g class="horizontal-line"><rect x="0" y="45.0" width="600" height="40" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="245.55555555555557" y="25" fill="transparent" stroke="transparent" font-size="30px">8.20</text></g></svg></div></td>
    <td class="gt_row gt_right"><div><svg viewbox="0 0 600 130" style="height: 2em; margin-left: auto; margin-right: auto; font-size: inherit; overflow: visible; vertical-align: middle; position:relative;"><defs><pattern id="area_pattern" width="8" height="8" patternunits="userSpaceOnUse"><path class="pattern-line" d="M 0,8 l 8,-8 M -1,1 l 4,-4 M 6,10 l 4,-4" stroke="#FF0000" stroke-width="1.5" stroke-linecap="round" shape-rendering="geometricPrecision"></path></pattern></defs><style> text { font-family: ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace; stroke-width: 0.15em; paint-order: stroke; stroke-linejoin: round; cursor: default; } .vert-line:hover rect { fill: #911EB4; fill-opacity: 40%; stroke: #FFFFFF60; color: red; } .vert-line:hover text { stroke: white; fill: #212427; } .horizontal-line:hover text {stroke: white; fill: #212427; } .ref-line:hover rect { stroke: #FFFFFF60; } .ref-line:hover line { stroke: #FF0000; } .ref-line:hover text { stroke: white; fill: #212427; } .y-axis-line:hover rect { fill: #EDEDED; fill-opacity: 60%; stroke: #FFFFFF60; color: red; } .y-axis-line:hover text { stroke: white; stroke-width: 0.20em; fill: #1A1C1F; } </style><line x1="238.37209302325576" y1="65.0" x2="506.68604651162786" y2="65.0" stroke="#4682B4" stroke-width="8"></line><g class="horizontal-line"><rect x="0" y="45.0" width="600" height="40" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="248.37209302325576" y="25" fill="transparent" stroke="transparent" font-size="30px">9.23</text></g><line x1="238.37209302325576" y1="5.0" x2="238.37209302325576" y2="125.0" stroke="#BFBFBF" stroke-width="4"></line><circle cx="506.68604651162786" cy="65.0" r="10" stroke="#FFFFFF" stroke-width="4" fill="#FF0000"></circle></svg></div></td>
  </tr>
</tbody>


</table>

</div>
</div>
</div>
<p>Notice that there is some light interactivity available here as well! When hovering over a plotted bar or line the data value will appear.</p>
</section>
<section id="customizing-with-nanoplot_options" class="level3">
<h3 class="anchored" data-anchor-id="customizing-with-nanoplot_options">Customizing with <a href="../../reference/nanoplot_options.html#great_tables.nanoplot_options" title="0"><code>nanoplot_options()</code></a></h3>
<p>We provide a lot of options for customizing your nanoplots. With the <a href="../../reference/nanoplot_options.html#great_tables.nanoplot_options"><span><code>nanoplot_options()</code></span></a> helper function, it’s possible to change the look and feel for a set of nanoplots. The <code>options=</code> argument of <a href="../../reference/GT.fmt_nanoplot.html#great_tables.GT.fmt_nanoplot"><code>fmt_nanoplot()</code></a> is where you’d need to invoke that helper function. Some possibilities for customization include determining which nanoplot elements are present, changing the sizes and colors of different elements, and a whole lot more! Here’s an example where both line- and bar-based nanoplots retain their basic compositional elements, but their appearance is quite different.</p>
<div id="f8f5965d" class="cell" data-execution_count="5">
<div class="code-copy-outer-scaffold"><div class="sourceCode cell-code" id="cb5" style="background: #f1f3f5;"><pre class="sourceCode python code-with-copy"><code class="sourceCode python"><span id="cb5-1"><span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">from</span> great_tables <span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">import</span> nanoplot_options</span>
<span id="cb5-2"></span>
<span id="cb5-3">(</span>
<span id="cb5-4">    GT(random_numbers_df)</span>
<span id="cb5-5">    .fmt_nanoplot(</span>
<span id="cb5-6">        columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"lines"</span>,</span>
<span id="cb5-7">        options<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>nanoplot_options(</span>
<span id="cb5-8">            data_point_radius<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">8</span>,</span>
<span id="cb5-9">            data_point_stroke_color<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"black"</span>,</span>
<span id="cb5-10">            data_point_stroke_width<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">3</span>,</span>
<span id="cb5-11">            data_point_fill_color<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"white"</span>,</span>
<span id="cb5-12">            data_line_type<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"straight"</span>,</span>
<span id="cb5-13">            data_line_stroke_color<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"green"</span>,</span>
<span id="cb5-14">            data_line_stroke_width<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">5</span>,</span>
<span id="cb5-15">            data_area_fill_color<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"green"</span>,</span>
<span id="cb5-16">            show_data_area<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="va" style="color: #111111;
background-color: null;
font-style: inherit;">False</span>,</span>
<span id="cb5-17">        ),</span>
<span id="cb5-18">    )</span>
<span id="cb5-19">    .fmt_nanoplot(</span>
<span id="cb5-20">        columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"bars"</span>,</span>
<span id="cb5-21">        plot_type<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"bar"</span>,</span>
<span id="cb5-22">        options<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>nanoplot_options(</span>
<span id="cb5-23">            data_bar_stroke_color<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"brown"</span>,</span>
<span id="cb5-24">            data_bar_fill_color<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"yellow"</span>,</span>
<span id="cb5-25">            data_bar_negative_stroke_color<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"black"</span>,</span>
<span id="cb5-26">            data_bar_negative_fill_color<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"blue"</span>,</span>
<span id="cb5-27">        ),</span>
<span id="cb5-28">    )</span>
<span id="cb5-29">)</span></code></pre></div></div>
<div class="cell-output cell-output-display" data-execution_count="5">
<div id="kobycysayg" style="padding-left:0px;padding-right:0px;padding-top:10px;padding-bottom:10px;overflow-x:auto;overflow-y:auto;width:auto;height:auto;">
<style>
#kobycysayg table {
          font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Helvetica Neue', 'Fira Sans', 'Droid Sans', Arial, sans-serif;
          -webkit-font-smoothing: antialiased;
          -moz-osx-font-smoothing: grayscale;
        }

#kobycysayg thead, tbody, tfoot, tr, td, th { border-style: none; }
 tr { background-color: transparent; }
#kobycysayg p { margin: 0; padding: 0; }
 #kobycysayg .gt_table { display: table; border-collapse: collapse; line-height: normal; margin-left: auto; margin-right: auto; color: #333333; font-size: 16px; font-weight: normal; font-style: normal; background-color: #FFFFFF; width: auto; border-top-style: solid; border-top-width: 2px; border-top-color: #A8A8A8; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #A8A8A8; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; }
 #kobycysayg .gt_caption { padding-top: 4px; padding-bottom: 4px; }
 #kobycysayg .gt_title { color: #333333; font-size: 125%; font-weight: initial; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; border-bottom-color: #FFFFFF; border-bottom-width: 0; }
 #kobycysayg .gt_subtitle { color: #333333; font-size: 85%; font-weight: initial; padding-top: 3px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; border-top-color: #FFFFFF; border-top-width: 0; }
 #kobycysayg .gt_heading { background-color: #FFFFFF; text-align: center; border-bottom-color: #FFFFFF; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #kobycysayg .gt_bottom_border { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #kobycysayg .gt_col_headings { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #kobycysayg .gt_col_heading { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; overflow-x: hidden; }
 #kobycysayg .gt_column_spanner_outer { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; padding-top: 0; padding-bottom: 0; padding-left: 4px; padding-right: 4px; }
 #kobycysayg .gt_column_spanner_outer:first-child { padding-left: 0; }
 #kobycysayg .gt_column_spanner_outer:last-child { padding-right: 0; }
 #kobycysayg .gt_column_spanner { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; overflow-x: hidden; display: inline-block; width: 100%; }
 #kobycysayg .gt_spanner_row { border-bottom-style: hidden; }
 #kobycysayg .gt_group_heading { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; text-align: left; }
 #kobycysayg .gt_empty_group_heading { padding: 0.5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: middle; }
 #kobycysayg .gt_from_md> :first-child { margin-top: 0; }
 #kobycysayg .gt_from_md> :last-child { margin-bottom: 0; }
 #kobycysayg .gt_row { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; margin: 10px; border-top-style: solid; border-top-width: 1px; border-top-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; overflow-x: hidden; }
 #kobycysayg .gt_stub { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; }
 #kobycysayg .gt_stub_row_group { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; vertical-align: top; }
 #kobycysayg .gt_row_group_first td { border-top-width: 2px; }
 #kobycysayg .gt_row_group_first th { border-top-width: 2px; }
 #kobycysayg .gt_striped { color: #333333; background-color: #F4F4F4; }
 #kobycysayg .gt_table_body { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #kobycysayg .gt_grand_summary_row { color: #333333; background-color: #FFFFFF; text-transform: inherit; padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; }
 #kobycysayg .gt_first_grand_summary_row_bottom { border-top-style: double; border-top-width: 6px; border-top-color: #D3D3D3; }
 #kobycysayg .gt_last_grand_summary_row_top { border-bottom-style: double; border-bottom-width: 6px; border-bottom-color: #D3D3D3; }
 #kobycysayg .gt_sourcenotes { color: #333333; background-color: #FFFFFF; border-bottom-style: none; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; }
 #kobycysayg .gt_sourcenote { font-size: 90%; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; text-align: left; }
 #kobycysayg .gt_left { text-align: left; }
 #kobycysayg .gt_center { text-align: center; }
 #kobycysayg .gt_right { text-align: right; font-variant-numeric: tabular-nums; }
 #kobycysayg .gt_font_normal { font-weight: normal; }
 #kobycysayg .gt_font_bold { font-weight: bold; }
 #kobycysayg .gt_font_italic { font-style: italic; }
 #kobycysayg .gt_super { font-size: 65%; }
 #kobycysayg .gt_footnote_marks { font-size: 75%; vertical-align: 0.4em; position: initial; }
 #kobycysayg .gt_asterisk { font-size: 100%; vertical-align: 0; }
 
</style>
<table class="gt_table" data-quarto-disable-processing="false" data-quarto-bootstrap="false">
<thead>

<tr class="gt_col_headings">
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="i">i</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="1" colspan="1" scope="col" id="lines">lines</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="1" colspan="1" scope="col" id="bars">bars</th>
</tr>
</thead>
<tbody class="gt_table_body">
  <tr>
    <td class="gt_row gt_right">1</td>
    <td class="gt_row gt_left"><div><svg viewbox="0 0 600 130" style="height: 2em; margin-left: auto; margin-right: auto; font-size: inherit; overflow: visible; vertical-align: middle; position:relative;"><defs><pattern id="area_pattern" width="8" height="8" patternunits="userSpaceOnUse"><path class="pattern-line" d="M 0,8 l 8,-8 M -1,1 l 4,-4 M 6,10 l 4,-4" stroke="green" stroke-width="1.5" stroke-linecap="round" shape-rendering="geometricPrecision"></path></pattern></defs><style> text { font-family: ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace; stroke-width: 0.15em; paint-order: stroke; stroke-linejoin: round; cursor: default; } .vert-line:hover rect { fill: #911EB4; fill-opacity: 40%; stroke: #FFFFFF60; color: red; } .vert-line:hover text { stroke: white; fill: #212427; } .horizontal-line:hover text {stroke: white; fill: #212427; } .ref-line:hover rect { stroke: #FFFFFF60; } .ref-line:hover line { stroke: #FF0000; } .ref-line:hover text { stroke: white; fill: #212427; } .y-axis-line:hover rect { fill: #EDEDED; fill-opacity: 60%; stroke: #FFFFFF60; color: red; } .y-axis-line:hover text { stroke: white; stroke-width: 0.20em; fill: #1A1C1F; } </style><polyline points="50.0,66.51515151515152 105.55555555555554,57.42424242424242 161.1111111111111,108.93939393939394 216.66666666666666,105.9090909090909 272.2222222222222,15.0 327.77777777777777,57.42424242424242 383.3333333333333,63.484848484848484 438.8888888888889,115.0 494.4444444444444,105.9090909090909 550.0,78.63636363636363" stroke="green" stroke-width="5" fill="none"></polyline><circle cx="50.0" cy="66.51515151515152" r="8" stroke="black" stroke-width="3" fill="white"></circle><circle cx="105.55555555555554" cy="57.42424242424242" r="8" stroke="black" stroke-width="3" fill="white"></circle><circle cx="161.1111111111111" cy="108.93939393939394" r="8" stroke="black" stroke-width="3" fill="white"></circle><circle cx="216.66666666666666" cy="105.9090909090909" r="8" stroke="black" stroke-width="3" fill="white"></circle><circle cx="272.2222222222222" cy="15.0" r="8" stroke="black" stroke-width="3" fill="white"></circle><circle cx="327.77777777777777" cy="57.42424242424242" r="8" stroke="black" stroke-width="3" fill="white"></circle><circle cx="383.3333333333333" cy="63.484848484848484" r="8" stroke="black" stroke-width="3" fill="white"></circle><circle cx="438.8888888888889" cy="115.0" r="8" stroke="black" stroke-width="3" fill="white"></circle><circle cx="494.4444444444444" cy="105.9090909090909" r="8" stroke="black" stroke-width="3" fill="white"></circle><circle cx="550.0" cy="78.63636363636363" r="8" stroke="black" stroke-width="3" fill="white"></circle><g class="y-axis-line"><rect x="0" y="0" width="65" height="130" stroke="transparent" stroke-width="0" fill="transparent"></rect><text x="0" y="19.0" fill="transparent" stroke="transparent" font-size="25">37</text><text x="0" y="126.0" fill="transparent" stroke="transparent" font-size="25">4</text></g><g class="vert-line"><rect x="40.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="60.0" y="20" fill="transparent" stroke="transparent" font-size="30px">20</text></g><g class="vert-line"><rect x="95.55555555555554" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="115.55555555555554" y="20" fill="transparent" stroke="transparent" font-size="30px">23</text></g><g class="vert-line"><rect x="151.1111111111111" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="171.1111111111111" y="20" fill="transparent" stroke="transparent" font-size="30px">6</text></g><g class="vert-line"><rect x="206.66666666666666" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="226.66666666666666" y="20" fill="transparent" stroke="transparent" font-size="30px">7</text></g><g class="vert-line"><rect x="262.2222222222222" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="282.2222222222222" y="20" fill="transparent" stroke="transparent" font-size="30px">37</text></g><g class="vert-line"><rect x="317.77777777777777" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="337.77777777777777" y="20" fill="transparent" stroke="transparent" font-size="30px">23</text></g><g class="vert-line"><rect x="373.3333333333333" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="393.3333333333333" y="20" fill="transparent" stroke="transparent" font-size="30px">21</text></g><g class="vert-line"><rect x="428.8888888888889" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="448.8888888888889" y="20" fill="transparent" stroke="transparent" font-size="30px">4</text></g><g class="vert-line"><rect x="484.4444444444444" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="504.4444444444444" y="20" fill="transparent" stroke="transparent" font-size="30px">7</text></g><g class="vert-line"><rect x="540.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="560.0" y="20" fill="transparent" stroke="transparent" font-size="30px">16</text></g></svg></div></td>
    <td class="gt_row gt_left"><div><svg viewbox="0 0 600 130" style="height: 2em; margin-left: auto; margin-right: auto; font-size: inherit; overflow: visible; vertical-align: middle; position:relative;"><defs><pattern id="area_pattern" width="8" height="8" patternunits="userSpaceOnUse"><path class="pattern-line" d="M 0,8 l 8,-8 M -1,1 l 4,-4 M 6,10 l 4,-4" stroke="#FF0000" stroke-width="1.5" stroke-linecap="round" shape-rendering="geometricPrecision"></path></pattern></defs><style> text { font-family: ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace; stroke-width: 0.15em; paint-order: stroke; stroke-linejoin: round; cursor: default; } .vert-line:hover rect { fill: #911EB4; fill-opacity: 40%; stroke: #FFFFFF60; color: red; } .vert-line:hover text { stroke: white; fill: #212427; } .horizontal-line:hover text {stroke: white; fill: #212427; } .ref-line:hover rect { stroke: #FFFFFF60; } .ref-line:hover line { stroke: #FF0000; } .ref-line:hover text { stroke: white; fill: #212427; } .y-axis-line:hover rect { fill: #EDEDED; fill-opacity: 60%; stroke: #FFFFFF60; color: red; } .y-axis-line:hover text { stroke: white; stroke-width: 0.20em; fill: #1A1C1F; } </style><line x1="22.5" y1="115.0" x2="577.5" y2="115.0" stroke="#BFBFBF" stroke-width="4"></line><rect x="30.0" y="60.945945945945944" width="40" height="54.054054054054056" stroke="brown" stroke-width="4" fill="yellow"></rect><rect x="85.55555555555554" y="52.83783783783784" width="40" height="62.16216216216216" stroke="brown" stroke-width="4" fill="yellow"></rect><rect x="141.1111111111111" y="98.78378378378379" width="40" height="16.21621621621621" stroke="brown" stroke-width="4" fill="yellow"></rect><rect x="196.66666666666666" y="96.08108108108108" width="40" height="18.91891891891892" stroke="brown" stroke-width="4" fill="yellow"></rect><rect x="252.22222222222217" y="15.0" width="40" height="100.0" stroke="brown" stroke-width="4" fill="yellow"></rect><rect x="307.77777777777777" y="52.83783783783784" width="40" height="62.16216216216216" stroke="brown" stroke-width="4" fill="yellow"></rect><rect x="363.3333333333333" y="58.24324324324324" width="40" height="56.75675675675676" stroke="brown" stroke-width="4" fill="yellow"></rect><rect x="418.8888888888889" y="104.1891891891892" width="40" height="10.810810810810807" stroke="brown" stroke-width="4" fill="yellow"></rect><rect x="474.4444444444444" y="96.08108108108108" width="40" height="18.91891891891892" stroke="brown" stroke-width="4" fill="yellow"></rect><rect x="530.0" y="71.75675675675676" width="40" height="43.24324324324324" stroke="brown" stroke-width="4" fill="yellow"></rect><g class="y-axis-line"><rect x="0" y="0" width="65" height="130" stroke="transparent" stroke-width="0" fill="transparent"></rect><text x="0" y="19.0" fill="transparent" stroke="transparent" font-size="25">37</text><text x="0" y="126.0" fill="transparent" stroke="transparent" font-size="25">0</text></g><g class="vert-line"><rect x="40.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="60.0" y="20" fill="transparent" stroke="transparent" font-size="30px">20</text></g><g class="vert-line"><rect x="95.55555555555554" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="115.55555555555554" y="20" fill="transparent" stroke="transparent" font-size="30px">23</text></g><g class="vert-line"><rect x="151.1111111111111" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="171.1111111111111" y="20" fill="transparent" stroke="transparent" font-size="30px">6</text></g><g class="vert-line"><rect x="206.66666666666666" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="226.66666666666666" y="20" fill="transparent" stroke="transparent" font-size="30px">7</text></g><g class="vert-line"><rect x="262.2222222222222" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="282.2222222222222" y="20" fill="transparent" stroke="transparent" font-size="30px">37</text></g><g class="vert-line"><rect x="317.77777777777777" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="337.77777777777777" y="20" fill="transparent" stroke="transparent" font-size="30px">23</text></g><g class="vert-line"><rect x="373.3333333333333" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="393.3333333333333" y="20" fill="transparent" stroke="transparent" font-size="30px">21</text></g><g class="vert-line"><rect x="428.8888888888889" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="448.8888888888889" y="20" fill="transparent" stroke="transparent" font-size="30px">4</text></g><g class="vert-line"><rect x="484.4444444444444" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="504.4444444444444" y="20" fill="transparent" stroke="transparent" font-size="30px">7</text></g><g class="vert-line"><rect x="540.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="560.0" y="20" fill="transparent" stroke="transparent" font-size="30px">16</text></g></svg></div></td>
  </tr>
  <tr>
    <td class="gt_row gt_right">2</td>
    <td class="gt_row gt_left"><div><svg viewbox="0 0 600 130" style="height: 2em; margin-left: auto; margin-right: auto; font-size: inherit; overflow: visible; vertical-align: middle; position:relative;"><defs><pattern id="area_pattern" width="8" height="8" patternunits="userSpaceOnUse"><path class="pattern-line" d="M 0,8 l 8,-8 M -1,1 l 4,-4 M 6,10 l 4,-4" stroke="green" stroke-width="1.5" stroke-linecap="round" shape-rendering="geometricPrecision"></path></pattern></defs><style> text { font-family: ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace; stroke-width: 0.15em; paint-order: stroke; stroke-linejoin: round; cursor: default; } .vert-line:hover rect { fill: #911EB4; fill-opacity: 40%; stroke: #FFFFFF60; color: red; } .vert-line:hover text { stroke: white; fill: #212427; } .horizontal-line:hover text {stroke: white; fill: #212427; } .ref-line:hover rect { stroke: #FFFFFF60; } .ref-line:hover line { stroke: #FF0000; } .ref-line:hover text { stroke: white; fill: #212427; } .y-axis-line:hover rect { fill: #EDEDED; fill-opacity: 60%; stroke: #FFFFFF60; color: red; } .y-axis-line:hover text { stroke: white; stroke-width: 0.20em; fill: #1A1C1F; } </style><polyline points="50.0,115.0 105.55555555555554,69.08163265306123 161.1111111111111,44.591836734693885 216.66666666666666,113.77551020408163 272.2222222222222,102.75510204081633 327.77777777777777,15.0 383.3333333333333,84.38775510204083 438.8888888888889,101.73469387755102 494.4444444444444,65.0 550.0,100.3061224489796" stroke="green" stroke-width="5" fill="none"></polyline><circle cx="50.0" cy="115.0" r="8" stroke="black" stroke-width="3" fill="white"></circle><circle cx="105.55555555555554" cy="69.08163265306123" r="8" stroke="black" stroke-width="3" fill="white"></circle><circle cx="161.1111111111111" cy="44.591836734693885" r="8" stroke="black" stroke-width="3" fill="white"></circle><circle cx="216.66666666666666" cy="113.77551020408163" r="8" stroke="black" stroke-width="3" fill="white"></circle><circle cx="272.2222222222222" cy="102.75510204081633" r="8" stroke="black" stroke-width="3" fill="white"></circle><circle cx="327.77777777777777" cy="15.0" r="8" stroke="black" stroke-width="3" fill="white"></circle><circle cx="383.3333333333333" cy="84.38775510204083" r="8" stroke="black" stroke-width="3" fill="white"></circle><circle cx="438.8888888888889" cy="101.73469387755102" r="8" stroke="black" stroke-width="3" fill="white"></circle><circle cx="494.4444444444444" cy="65.0" r="8" stroke="black" stroke-width="3" fill="white"></circle><circle cx="550.0" cy="100.3061224489796" r="8" stroke="black" stroke-width="3" fill="white"></circle><g class="y-axis-line"><rect x="0" y="0" width="65" height="130" stroke="transparent" stroke-width="0" fill="transparent"></rect><text x="0" y="19.0" fill="transparent" stroke="transparent" font-size="25">12.1</text><text x="0" y="126.0" fill="transparent" stroke="transparent" font-size="25">2.30</text></g><g class="vert-line"><rect x="40.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="60.0" y="20" fill="transparent" stroke="transparent" font-size="30px">2.30</text></g><g class="vert-line"><rect x="95.55555555555554" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="115.55555555555554" y="20" fill="transparent" stroke="transparent" font-size="30px">6.80</text></g><g class="vert-line"><rect x="151.1111111111111" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="171.1111111111111" y="20" fill="transparent" stroke="transparent" font-size="30px">9.20</text></g><g class="vert-line"><rect x="206.66666666666666" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="226.66666666666666" y="20" fill="transparent" stroke="transparent" font-size="30px">2.42</text></g><g class="vert-line"><rect x="262.2222222222222" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="282.2222222222222" y="20" fill="transparent" stroke="transparent" font-size="30px">3.50</text></g><g class="vert-line"><rect x="317.77777777777777" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="337.77777777777777" y="20" fill="transparent" stroke="transparent" font-size="30px">12.1</text></g><g class="vert-line"><rect x="373.3333333333333" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="393.3333333333333" y="20" fill="transparent" stroke="transparent" font-size="30px">5.30</text></g><g class="vert-line"><rect x="428.8888888888889" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="448.8888888888889" y="20" fill="transparent" stroke="transparent" font-size="30px">3.60</text></g><g class="vert-line"><rect x="484.4444444444444" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="504.4444444444444" y="20" fill="transparent" stroke="transparent" font-size="30px">7.20</text></g><g class="vert-line"><rect x="540.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="560.0" y="20" fill="transparent" stroke="transparent" font-size="30px">3.74</text></g></svg></div></td>
    <td class="gt_row gt_left"><div><svg viewbox="0 0 600 130" style="height: 2em; margin-left: auto; margin-right: auto; font-size: inherit; overflow: visible; vertical-align: middle; position:relative;"><defs><pattern id="area_pattern" width="8" height="8" patternunits="userSpaceOnUse"><path class="pattern-line" d="M 0,8 l 8,-8 M -1,1 l 4,-4 M 6,10 l 4,-4" stroke="#FF0000" stroke-width="1.5" stroke-linecap="round" shape-rendering="geometricPrecision"></path></pattern></defs><style> text { font-family: ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace; stroke-width: 0.15em; paint-order: stroke; stroke-linejoin: round; cursor: default; } .vert-line:hover rect { fill: #911EB4; fill-opacity: 40%; stroke: #FFFFFF60; color: red; } .vert-line:hover text { stroke: white; fill: #212427; } .horizontal-line:hover text {stroke: white; fill: #212427; } .ref-line:hover rect { stroke: #FFFFFF60; } .ref-line:hover line { stroke: #FF0000; } .ref-line:hover text { stroke: white; fill: #212427; } .y-axis-line:hover rect { fill: #EDEDED; fill-opacity: 60%; stroke: #FFFFFF60; color: red; } .y-axis-line:hover text { stroke: white; stroke-width: 0.20em; fill: #1A1C1F; } </style><line x1="22.5" y1="115.0" x2="577.5" y2="115.0" stroke="#BFBFBF" stroke-width="4"></line><rect x="30.0" y="95.99173553719008" width="40" height="19.00826446280992" stroke="brown" stroke-width="4" fill="yellow"></rect><rect x="85.55555555555554" y="58.80165289256198" width="40" height="56.19834710743802" stroke="brown" stroke-width="4" fill="yellow"></rect><rect x="141.1111111111111" y="38.96694214876034" width="40" height="76.03305785123966" stroke="brown" stroke-width="4" fill="yellow"></rect><rect x="196.66666666666666" y="95.0" width="40" height="20.0" stroke="brown" stroke-width="4" fill="yellow"></rect><rect x="252.22222222222217" y="86.07438016528926" width="40" height="28.925619834710744" stroke="brown" stroke-width="4" fill="yellow"></rect><rect x="307.77777777777777" y="15.0" width="40" height="100.0" stroke="brown" stroke-width="4" fill="yellow"></rect><rect x="363.3333333333333" y="71.19834710743802" width="40" height="43.801652892561975" stroke="brown" stroke-width="4" fill="yellow"></rect><rect x="418.8888888888889" y="85.24793388429752" width="40" height="29.752066115702476" stroke="brown" stroke-width="4" fill="yellow"></rect><rect x="474.4444444444444" y="55.49586776859504" width="40" height="59.50413223140496" stroke="brown" stroke-width="4" fill="yellow"></rect><rect x="530.0" y="84.0909090909091" width="40" height="30.909090909090907" stroke="brown" stroke-width="4" fill="yellow"></rect><g class="y-axis-line"><rect x="0" y="0" width="65" height="130" stroke="transparent" stroke-width="0" fill="transparent"></rect><text x="0" y="19.0" fill="transparent" stroke="transparent" font-size="25">12.1</text><text x="0" y="126.0" fill="transparent" stroke="transparent" font-size="25">0</text></g><g class="vert-line"><rect x="40.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="60.0" y="20" fill="transparent" stroke="transparent" font-size="30px">2.30</text></g><g class="vert-line"><rect x="95.55555555555554" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="115.55555555555554" y="20" fill="transparent" stroke="transparent" font-size="30px">6.80</text></g><g class="vert-line"><rect x="151.1111111111111" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="171.1111111111111" y="20" fill="transparent" stroke="transparent" font-size="30px">9.20</text></g><g class="vert-line"><rect x="206.66666666666666" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="226.66666666666666" y="20" fill="transparent" stroke="transparent" font-size="30px">2.42</text></g><g class="vert-line"><rect x="262.2222222222222" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="282.2222222222222" y="20" fill="transparent" stroke="transparent" font-size="30px">3.50</text></g><g class="vert-line"><rect x="317.77777777777777" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="337.77777777777777" y="20" fill="transparent" stroke="transparent" font-size="30px">12.1</text></g><g class="vert-line"><rect x="373.3333333333333" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="393.3333333333333" y="20" fill="transparent" stroke="transparent" font-size="30px">5.30</text></g><g class="vert-line"><rect x="428.8888888888889" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="448.8888888888889" y="20" fill="transparent" stroke="transparent" font-size="30px">3.60</text></g><g class="vert-line"><rect x="484.4444444444444" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="504.4444444444444" y="20" fill="transparent" stroke="transparent" font-size="30px">7.20</text></g><g class="vert-line"><rect x="540.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="560.0" y="20" fill="transparent" stroke="transparent" font-size="30px">3.74</text></g></svg></div></td>
  </tr>
  <tr>
    <td class="gt_row gt_right">3</td>
    <td class="gt_row gt_left"><div><svg viewbox="0 0 450 130" style="height: 2em; margin-left: auto; margin-right: auto; font-size: inherit; overflow: visible; vertical-align: middle; position:relative;"><defs><pattern id="area_pattern" width="8" height="8" patternunits="userSpaceOnUse"><path class="pattern-line" d="M 0,8 l 8,-8 M -1,1 l 4,-4 M 6,10 l 4,-4" stroke="green" stroke-width="1.5" stroke-linecap="round" shape-rendering="geometricPrecision"></path></pattern></defs><style> text { font-family: ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace; stroke-width: 0.15em; paint-order: stroke; stroke-linejoin: round; cursor: default; } .vert-line:hover rect { fill: #911EB4; fill-opacity: 40%; stroke: #FFFFFF60; color: red; } .vert-line:hover text { stroke: white; fill: #212427; } .horizontal-line:hover text {stroke: white; fill: #212427; } .ref-line:hover rect { stroke: #FFFFFF60; } .ref-line:hover line { stroke: #FF0000; } .ref-line:hover text { stroke: white; fill: #212427; } .y-axis-line:hover rect { fill: #EDEDED; fill-opacity: 60%; stroke: #FFFFFF60; color: red; } .y-axis-line:hover text { stroke: white; stroke-width: 0.20em; fill: #1A1C1F; } </style><polyline points="50.0,115.0 108.33333333333333,80.0 166.66666666666666,25.0 225.0,36.50000000000001 283.3333333333333,55.0 341.6666666666667,15.0 400.0,92.0" stroke="green" stroke-width="5" fill="none"></polyline><circle cx="50.0" cy="115.0" r="8" stroke="black" stroke-width="3" fill="white"></circle><circle cx="108.33333333333333" cy="80.0" r="8" stroke="black" stroke-width="3" fill="white"></circle><circle cx="166.66666666666666" cy="25.0" r="8" stroke="black" stroke-width="3" fill="white"></circle><circle cx="225.0" cy="36.50000000000001" r="8" stroke="black" stroke-width="3" fill="white"></circle><circle cx="283.3333333333333" cy="55.0" r="8" stroke="black" stroke-width="3" fill="white"></circle><circle cx="341.6666666666667" cy="15.0" r="8" stroke="black" stroke-width="3" fill="white"></circle><circle cx="400.0" cy="92.0" r="8" stroke="black" stroke-width="3" fill="white"></circle><g class="y-axis-line"><rect x="0" y="0" width="65" height="130" stroke="transparent" stroke-width="0" fill="transparent"></rect><text x="0" y="19.0" fill="transparent" stroke="transparent" font-size="25">8.00</text><text x="0" y="126.0" fill="transparent" stroke="transparent" font-size="25">−12.0</text></g><g class="vert-line"><rect x="40.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="60.0" y="20" fill="transparent" stroke="transparent" font-size="30px">−12.0</text></g><g class="vert-line"><rect x="98.33333333333333" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="118.33333333333333" y="20" fill="transparent" stroke="transparent" font-size="30px">−5.00</text></g><g class="vert-line"><rect x="156.66666666666666" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="176.66666666666666" y="20" fill="transparent" stroke="transparent" font-size="30px">6.00</text></g><g class="vert-line"><rect x="215.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="235.0" y="20" fill="transparent" stroke="transparent" font-size="30px">3.70</text></g><g class="vert-line"><rect x="273.3333333333333" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="293.3333333333333" y="20" fill="transparent" stroke="transparent" font-size="30px">0</text></g><g class="vert-line"><rect x="331.6666666666667" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="351.6666666666667" y="20" fill="transparent" stroke="transparent" font-size="30px">8.00</text></g><g class="vert-line"><rect x="390.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="410.0" y="20" fill="transparent" stroke="transparent" font-size="30px">−7.40</text></g></svg></div></td>
    <td class="gt_row gt_left"><div><svg viewbox="0 0 450 130" style="height: 2em; margin-left: auto; margin-right: auto; font-size: inherit; overflow: visible; vertical-align: middle; position:relative;"><defs><pattern id="area_pattern" width="8" height="8" patternunits="userSpaceOnUse"><path class="pattern-line" d="M 0,8 l 8,-8 M -1,1 l 4,-4 M 6,10 l 4,-4" stroke="#FF0000" stroke-width="1.5" stroke-linecap="round" shape-rendering="geometricPrecision"></path></pattern></defs><style> text { font-family: ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace; stroke-width: 0.15em; paint-order: stroke; stroke-linejoin: round; cursor: default; } .vert-line:hover rect { fill: #911EB4; fill-opacity: 40%; stroke: #FFFFFF60; color: red; } .vert-line:hover text { stroke: white; fill: #212427; } .horizontal-line:hover text {stroke: white; fill: #212427; } .ref-line:hover rect { stroke: #FFFFFF60; } .ref-line:hover line { stroke: #FF0000; } .ref-line:hover text { stroke: white; fill: #212427; } .y-axis-line:hover rect { fill: #EDEDED; fill-opacity: 60%; stroke: #FFFFFF60; color: red; } .y-axis-line:hover text { stroke: white; stroke-width: 0.20em; fill: #1A1C1F; } </style><line x1="22.5" y1="55.0" x2="427.5" y2="55.0" stroke="#BFBFBF" stroke-width="4"></line><rect x="30.0" y="55.0" width="40" height="60.0" stroke="black" stroke-width="4" fill="blue"></rect><rect x="88.33333333333333" y="55.0" width="40" height="25.0" stroke="black" stroke-width="4" fill="blue"></rect><rect x="146.66666666666666" y="25.0" width="40" height="30.0" stroke="brown" stroke-width="4" fill="yellow"></rect><rect x="205.0" y="36.50000000000001" width="40" height="18.499999999999993" stroke="brown" stroke-width="4" fill="yellow"></rect><rect x="263.3333333333333" y="54.0" width="40" height="2" stroke="#808080" stroke-width="4" fill="#808080"></rect><rect x="321.6666666666667" y="15.0" width="40" height="40.0" stroke="brown" stroke-width="4" fill="yellow"></rect><rect x="380.0" y="55.0" width="40" height="37.0" stroke="black" stroke-width="4" fill="blue"></rect><g class="y-axis-line"><rect x="0" y="0" width="65" height="130" stroke="transparent" stroke-width="0" fill="transparent"></rect><text x="0" y="19.0" fill="transparent" stroke="transparent" font-size="25">8.00</text><text x="0" y="126.0" fill="transparent" stroke="transparent" font-size="25">−12.0</text></g><g class="vert-line"><rect x="40.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="60.0" y="20" fill="transparent" stroke="transparent" font-size="30px">−12.0</text></g><g class="vert-line"><rect x="98.33333333333333" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="118.33333333333333" y="20" fill="transparent" stroke="transparent" font-size="30px">−5.00</text></g><g class="vert-line"><rect x="156.66666666666666" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="176.66666666666666" y="20" fill="transparent" stroke="transparent" font-size="30px">6.00</text></g><g class="vert-line"><rect x="215.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="235.0" y="20" fill="transparent" stroke="transparent" font-size="30px">3.70</text></g><g class="vert-line"><rect x="273.3333333333333" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="293.3333333333333" y="20" fill="transparent" stroke="transparent" font-size="30px">0</text></g><g class="vert-line"><rect x="331.6666666666667" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="351.6666666666667" y="20" fill="transparent" stroke="transparent" font-size="30px">8.00</text></g><g class="vert-line"><rect x="390.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="410.0" y="20" fill="transparent" stroke="transparent" font-size="30px">−7.40</text></g></svg></div></td>
  </tr>
  <tr>
    <td class="gt_row gt_right">4</td>
    <td class="gt_row gt_left"><div><svg viewbox="0 0 650 130" style="height: 2em; margin-left: auto; margin-right: auto; font-size: inherit; overflow: visible; vertical-align: middle; position:relative;"><defs><pattern id="area_pattern" width="8" height="8" patternunits="userSpaceOnUse"><path class="pattern-line" d="M 0,8 l 8,-8 M -1,1 l 4,-4 M 6,10 l 4,-4" stroke="green" stroke-width="1.5" stroke-linecap="round" shape-rendering="geometricPrecision"></path></pattern></defs><style> text { font-family: ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace; stroke-width: 0.15em; paint-order: stroke; stroke-linejoin: round; cursor: default; } .vert-line:hover rect { fill: #911EB4; fill-opacity: 40%; stroke: #FFFFFF60; color: red; } .vert-line:hover text { stroke: white; fill: #212427; } .horizontal-line:hover text {stroke: white; fill: #212427; } .ref-line:hover rect { stroke: #FFFFFF60; } .ref-line:hover line { stroke: #FF0000; } .ref-line:hover text { stroke: white; fill: #212427; } .y-axis-line:hover rect { fill: #EDEDED; fill-opacity: 60%; stroke: #FFFFFF60; color: red; } .y-axis-line:hover text { stroke: white; stroke-width: 0.20em; fill: #1A1C1F; } </style><polyline points="50.0,106.66666666666666 105.0,115.0 160.0,52.5 215.0,85.83333333333333 270.0,81.66666666666667 325.0,73.33333333333333 380.0,110.83333333333334 435.0,15.0 490.0,44.166666666666664 545.0,60.833333333333336 600.0,90.0" stroke="green" stroke-width="5" fill="none"></polyline><circle cx="50.0" cy="106.66666666666666" r="8" stroke="black" stroke-width="3" fill="white"></circle><circle cx="105.0" cy="115.0" r="8" stroke="black" stroke-width="3" fill="white"></circle><circle cx="160.0" cy="52.5" r="8" stroke="black" stroke-width="3" fill="white"></circle><circle cx="215.0" cy="85.83333333333333" r="8" stroke="black" stroke-width="3" fill="white"></circle><circle cx="270.0" cy="81.66666666666667" r="8" stroke="black" stroke-width="3" fill="white"></circle><circle cx="325.0" cy="73.33333333333333" r="8" stroke="black" stroke-width="3" fill="white"></circle><circle cx="380.0" cy="110.83333333333334" r="8" stroke="black" stroke-width="3" fill="white"></circle><circle cx="435.0" cy="15.0" r="8" stroke="black" stroke-width="3" fill="white"></circle><circle cx="490.0" cy="44.166666666666664" r="8" stroke="black" stroke-width="3" fill="white"></circle><circle cx="545.0" cy="60.833333333333336" r="8" stroke="black" stroke-width="3" fill="white"></circle><circle cx="600.0" cy="90.0" r="8" stroke="black" stroke-width="3" fill="white"></circle><g class="y-axis-line"><rect x="0" y="0" width="65" height="130" stroke="transparent" stroke-width="0" fill="transparent"></rect><text x="0" y="19.0" fill="transparent" stroke="transparent" font-size="25">24</text><text x="0" y="126.0" fill="transparent" stroke="transparent" font-size="25">0</text></g><g class="vert-line"><rect x="40.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="60.0" y="20" fill="transparent" stroke="transparent" font-size="30px">2</text></g><g class="vert-line"><rect x="95.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="115.0" y="20" fill="transparent" stroke="transparent" font-size="30px">0</text></g><g class="vert-line"><rect x="150.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="170.0" y="20" fill="transparent" stroke="transparent" font-size="30px">15</text></g><g class="vert-line"><rect x="205.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="225.0" y="20" fill="transparent" stroke="transparent" font-size="30px">7</text></g><g class="vert-line"><rect x="260.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="280.0" y="20" fill="transparent" stroke="transparent" font-size="30px">8</text></g><g class="vert-line"><rect x="315.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="335.0" y="20" fill="transparent" stroke="transparent" font-size="30px">10</text></g><g class="vert-line"><rect x="370.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="390.0" y="20" fill="transparent" stroke="transparent" font-size="30px">1</text></g><g class="vert-line"><rect x="425.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="445.0" y="20" fill="transparent" stroke="transparent" font-size="30px">24</text></g><g class="vert-line"><rect x="480.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="500.0" y="20" fill="transparent" stroke="transparent" font-size="30px">17</text></g><g class="vert-line"><rect x="535.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="555.0" y="20" fill="transparent" stroke="transparent" font-size="30px">13</text></g><g class="vert-line"><rect x="590.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="610.0" y="20" fill="transparent" stroke="transparent" font-size="30px">6</text></g></svg></div></td>
    <td class="gt_row gt_left"><div><svg viewbox="0 0 650 130" style="height: 2em; margin-left: auto; margin-right: auto; font-size: inherit; overflow: visible; vertical-align: middle; position:relative;"><defs><pattern id="area_pattern" width="8" height="8" patternunits="userSpaceOnUse"><path class="pattern-line" d="M 0,8 l 8,-8 M -1,1 l 4,-4 M 6,10 l 4,-4" stroke="#FF0000" stroke-width="1.5" stroke-linecap="round" shape-rendering="geometricPrecision"></path></pattern></defs><style> text { font-family: ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace; stroke-width: 0.15em; paint-order: stroke; stroke-linejoin: round; cursor: default; } .vert-line:hover rect { fill: #911EB4; fill-opacity: 40%; stroke: #FFFFFF60; color: red; } .vert-line:hover text { stroke: white; fill: #212427; } .horizontal-line:hover text {stroke: white; fill: #212427; } .ref-line:hover rect { stroke: #FFFFFF60; } .ref-line:hover line { stroke: #FF0000; } .ref-line:hover text { stroke: white; fill: #212427; } .y-axis-line:hover rect { fill: #EDEDED; fill-opacity: 60%; stroke: #FFFFFF60; color: red; } .y-axis-line:hover text { stroke: white; stroke-width: 0.20em; fill: #1A1C1F; } </style><line x1="22.5" y1="115.0" x2="627.5" y2="115.0" stroke="#BFBFBF" stroke-width="4"></line><rect x="30.0" y="106.66666666666666" width="40" height="8.333333333333343" stroke="brown" stroke-width="4" fill="yellow"></rect><rect x="85.0" y="114.0" width="40" height="2" stroke="#808080" stroke-width="4" fill="#808080"></rect><rect x="140.0" y="52.5" width="40" height="62.5" stroke="brown" stroke-width="4" fill="yellow"></rect><rect x="195.0" y="85.83333333333333" width="40" height="29.16666666666667" stroke="brown" stroke-width="4" fill="yellow"></rect><rect x="250.0" y="81.66666666666667" width="40" height="33.33333333333333" stroke="brown" stroke-width="4" fill="yellow"></rect><rect x="305.0" y="73.33333333333333" width="40" height="41.66666666666667" stroke="brown" stroke-width="4" fill="yellow"></rect><rect x="360.0" y="110.83333333333334" width="40" height="4.166666666666657" stroke="brown" stroke-width="4" fill="yellow"></rect><rect x="415.0" y="15.0" width="40" height="100.0" stroke="brown" stroke-width="4" fill="yellow"></rect><rect x="470.0" y="44.166666666666664" width="40" height="70.83333333333334" stroke="brown" stroke-width="4" fill="yellow"></rect><rect x="525.0" y="60.833333333333336" width="40" height="54.166666666666664" stroke="brown" stroke-width="4" fill="yellow"></rect><rect x="580.0" y="90.0" width="40" height="25.0" stroke="brown" stroke-width="4" fill="yellow"></rect><g class="y-axis-line"><rect x="0" y="0" width="65" height="130" stroke="transparent" stroke-width="0" fill="transparent"></rect><text x="0" y="19.0" fill="transparent" stroke="transparent" font-size="25">24</text><text x="0" y="126.0" fill="transparent" stroke="transparent" font-size="25">0</text></g><g class="vert-line"><rect x="40.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="60.0" y="20" fill="transparent" stroke="transparent" font-size="30px">2</text></g><g class="vert-line"><rect x="95.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="115.0" y="20" fill="transparent" stroke="transparent" font-size="30px">0</text></g><g class="vert-line"><rect x="150.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="170.0" y="20" fill="transparent" stroke="transparent" font-size="30px">15</text></g><g class="vert-line"><rect x="205.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="225.0" y="20" fill="transparent" stroke="transparent" font-size="30px">7</text></g><g class="vert-line"><rect x="260.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="280.0" y="20" fill="transparent" stroke="transparent" font-size="30px">8</text></g><g class="vert-line"><rect x="315.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="335.0" y="20" fill="transparent" stroke="transparent" font-size="30px">10</text></g><g class="vert-line"><rect x="370.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="390.0" y="20" fill="transparent" stroke="transparent" font-size="30px">1</text></g><g class="vert-line"><rect x="425.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="445.0" y="20" fill="transparent" stroke="transparent" font-size="30px">24</text></g><g class="vert-line"><rect x="480.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="500.0" y="20" fill="transparent" stroke="transparent" font-size="30px">17</text></g><g class="vert-line"><rect x="535.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="555.0" y="20" fill="transparent" stroke="transparent" font-size="30px">13</text></g><g class="vert-line"><rect x="590.0" y="0" width="20" height="130" stroke="transparent" stroke-width="12" fill="transparent"></rect><text x="610.0" y="20" fill="transparent" stroke="transparent" font-size="30px">6</text></g></svg></div></td>
  </tr>
</tbody>


</table>

</div>
</div>
</div>
<p>We want you to have a lot of creative control for how these tiny plots are displayed. So, when you need it, <a href="../../reference/nanoplot_options.html#great_tables.nanoplot_options"><span><code>nanoplot_options()</code></span></a> is there for you!</p>
</section>
<section id="wrapping-up" class="level3">
<h3 class="anchored" data-anchor-id="wrapping-up">Wrapping up</h3>
<p>We’re always excited to offer new and exciting features that make summary tables fun and useful. The new nanoplots functionality is something we will continue to iterate on since there is definitely room for plotting innovation in tables for display. And there’s a lot more to nanoplots than these examples can show. For much more information on this, check out the <a href="https://posit-dev.github.io/great-tables/get-started/nanoplots.html"><em>Get Started</em> guide on nanoplots</a>. Please let us know through <a href="https://github.com/posit-dev/great-tables/issues">GitHub Issues</a> whether you ran into problems with this (or any other) feature, or, if you have suggestions for improvement!</p>


</section>

 ]]></description>
  <guid>https://posit-dev.github.io/great-tables/blog/introduction-0.4.0/</guid>
  <pubDate>Tue, 19 Mar 2024 00:00:00 GMT</pubDate>
</item>
<item>
  <title>Great Tables v0.3.0: So Many Style Options!</title>
  <dc:creator>Rich Iannone</dc:creator>
  <link>https://posit-dev.github.io/great-tables/blog/introduction-0.3.0/</link>
  <description><![CDATA[ 




<p>As our work on <strong>Great Tables</strong> continues, we want you to be able to produce increasingly sophisticated tables. The look of an HTML table really matters and we believe aesthetics can elevate the presentation of tabular data. In the <code>v0.3.0</code> release, we’ve implemented features that are concerned with modifying the visual aspects of a table. Let’s get down to what’s new in this version.</p>
<section id="modifying-the-widths-of-columns" class="level3">
<h3 class="anchored" data-anchor-id="modifying-the-widths-of-columns">Modifying the widths of columns</h3>
<p>Before <code>v0.3.0</code>, you could not alter the widths of individual columns. This meant that to great extent your content decided the width of individual columns. Even though browsers do an adequate job in sizing the widths of table columns, it doesn’t always result in a pleasing-to-look-at table. What if you want more space? Maybe you want consistently-sized columns? There’s many reasons to want to have a choice in the matter and the new <a href="../../reference/GT.cols_width.html#great_tables.GT.cols_width"><code>cols_width()</code></a> method now makes this possible.</p>
<p>Here’s an example where the widths of all columns are set with our preferred length values (in <code>px</code>).</p>
<div id="8d7751b9" class="cell" data-execution_count="1">
<div class="code-copy-outer-scaffold"><div class="sourceCode cell-code" id="cb1" style="background: #f1f3f5;"><pre class="sourceCode python code-with-copy"><code class="sourceCode python"><span id="cb1-1"><span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">import</span> warnings</span>
<span id="cb1-2"><span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">from</span> great_tables <span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">import</span> GT, exibble</span>
<span id="cb1-3"></span>
<span id="cb1-4">warnings.filterwarnings(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"ignore"</span>)</span>
<span id="cb1-5">exibble_mini <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> exibble[[<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"num"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"char"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"date"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"datetime"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"row"</span>]].head(<span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">5</span>)</span>
<span id="cb1-6"></span>
<span id="cb1-7">(</span>
<span id="cb1-8">    GT(exibble_mini).cols_width(</span>
<span id="cb1-9">        cases<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>{</span>
<span id="cb1-10">            <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"num"</span>: <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"30px"</span>,</span>
<span id="cb1-11">            <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"char"</span>: <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"100px"</span>,</span>
<span id="cb1-12">            <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"date"</span>: <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"150px"</span>,</span>
<span id="cb1-13">            <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"datetime"</span>: <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"200px"</span>,</span>
<span id="cb1-14">            <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"row"</span>: <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"50px"</span></span>
<span id="cb1-15">        }</span>
<span id="cb1-16">    )</span>
<span id="cb1-17">)</span></code></pre></div></div>
<div class="cell-output cell-output-display" data-execution_count="1">
<div id="zwwhhizbes" style="padding-left:0px;padding-right:0px;padding-top:10px;padding-bottom:10px;overflow-x:auto;overflow-y:auto;width:auto;height:auto;">
<style>
#zwwhhizbes table {
          font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Helvetica Neue', 'Fira Sans', 'Droid Sans', Arial, sans-serif;
          -webkit-font-smoothing: antialiased;
          -moz-osx-font-smoothing: grayscale;
        }

#zwwhhizbes thead, tbody, tfoot, tr, td, th { border-style: none; }
 tr { background-color: transparent; }
#zwwhhizbes p { margin: 0; padding: 0; }
 #zwwhhizbes .gt_table { display: table; border-collapse: collapse; line-height: normal; margin-left: auto; margin-right: auto; color: #333333; font-size: 16px; font-weight: normal; font-style: normal; background-color: #FFFFFF; width: auto; border-top-style: solid; border-top-width: 2px; border-top-color: #A8A8A8; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #A8A8A8; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; }
 #zwwhhizbes .gt_caption { padding-top: 4px; padding-bottom: 4px; }
 #zwwhhizbes .gt_title { color: #333333; font-size: 125%; font-weight: initial; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; border-bottom-color: #FFFFFF; border-bottom-width: 0; }
 #zwwhhizbes .gt_subtitle { color: #333333; font-size: 85%; font-weight: initial; padding-top: 3px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; border-top-color: #FFFFFF; border-top-width: 0; }
 #zwwhhizbes .gt_heading { background-color: #FFFFFF; text-align: center; border-bottom-color: #FFFFFF; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #zwwhhizbes .gt_bottom_border { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #zwwhhizbes .gt_col_headings { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #zwwhhizbes .gt_col_heading { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; overflow-x: hidden; }
 #zwwhhizbes .gt_column_spanner_outer { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; padding-top: 0; padding-bottom: 0; padding-left: 4px; padding-right: 4px; }
 #zwwhhizbes .gt_column_spanner_outer:first-child { padding-left: 0; }
 #zwwhhizbes .gt_column_spanner_outer:last-child { padding-right: 0; }
 #zwwhhizbes .gt_column_spanner { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; overflow-x: hidden; display: inline-block; width: 100%; }
 #zwwhhizbes .gt_spanner_row { border-bottom-style: hidden; }
 #zwwhhizbes .gt_group_heading { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; text-align: left; }
 #zwwhhizbes .gt_empty_group_heading { padding: 0.5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: middle; }
 #zwwhhizbes .gt_from_md> :first-child { margin-top: 0; }
 #zwwhhizbes .gt_from_md> :last-child { margin-bottom: 0; }
 #zwwhhizbes .gt_row { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; margin: 10px; border-top-style: solid; border-top-width: 1px; border-top-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; overflow-x: hidden; }
 #zwwhhizbes .gt_stub { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; }
 #zwwhhizbes .gt_stub_row_group { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; vertical-align: top; }
 #zwwhhizbes .gt_row_group_first td { border-top-width: 2px; }
 #zwwhhizbes .gt_row_group_first th { border-top-width: 2px; }
 #zwwhhizbes .gt_striped { color: #333333; background-color: #F4F4F4; }
 #zwwhhizbes .gt_table_body { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #zwwhhizbes .gt_grand_summary_row { color: #333333; background-color: #FFFFFF; text-transform: inherit; padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; }
 #zwwhhizbes .gt_first_grand_summary_row_bottom { border-top-style: double; border-top-width: 6px; border-top-color: #D3D3D3; }
 #zwwhhizbes .gt_last_grand_summary_row_top { border-bottom-style: double; border-bottom-width: 6px; border-bottom-color: #D3D3D3; }
 #zwwhhizbes .gt_sourcenotes { color: #333333; background-color: #FFFFFF; border-bottom-style: none; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; }
 #zwwhhizbes .gt_sourcenote { font-size: 90%; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; text-align: left; }
 #zwwhhizbes .gt_left { text-align: left; }
 #zwwhhizbes .gt_center { text-align: center; }
 #zwwhhizbes .gt_right { text-align: right; font-variant-numeric: tabular-nums; }
 #zwwhhizbes .gt_font_normal { font-weight: normal; }
 #zwwhhizbes .gt_font_bold { font-weight: bold; }
 #zwwhhizbes .gt_font_italic { font-style: italic; }
 #zwwhhizbes .gt_super { font-size: 65%; }
 #zwwhhizbes .gt_footnote_marks { font-size: 75%; vertical-align: 0.4em; position: initial; }
 #zwwhhizbes .gt_asterisk { font-size: 100%; vertical-align: 0; }
 
</style>
<table style="table-layout: fixed;; width: 0px" class="gt_table" data-quarto-disable-processing="false" data-quarto-bootstrap="false">
<colgroup>
  <col style="width:30px;">
  <col style="width:100px;">
  <col style="width:150px;">
  <col style="width:200px;">
  <col style="width:50px;">
</colgroup>

<thead>

<tr class="gt_col_headings">
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="num">num</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="1" colspan="1" scope="col" id="char">char</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="date">date</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="datetime">datetime</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="1" colspan="1" scope="col" id="row">row</th>
</tr>
</thead>
<tbody class="gt_table_body">
  <tr>
    <td class="gt_row gt_right">0.1111</td>
    <td class="gt_row gt_left">apricot</td>
    <td class="gt_row gt_right">2015-01-15</td>
    <td class="gt_row gt_right">2018-01-01 02:22</td>
    <td class="gt_row gt_left">row_1</td>
  </tr>
  <tr>
    <td class="gt_row gt_right">2.222</td>
    <td class="gt_row gt_left">banana</td>
    <td class="gt_row gt_right">2015-02-15</td>
    <td class="gt_row gt_right">2018-02-02 14:33</td>
    <td class="gt_row gt_left">row_2</td>
  </tr>
  <tr>
    <td class="gt_row gt_right">33.33</td>
    <td class="gt_row gt_left">coconut</td>
    <td class="gt_row gt_right">2015-03-15</td>
    <td class="gt_row gt_right">2018-03-03 03:44</td>
    <td class="gt_row gt_left">row_3</td>
  </tr>
  <tr>
    <td class="gt_row gt_right">444.4</td>
    <td class="gt_row gt_left">durian</td>
    <td class="gt_row gt_right">2015-04-15</td>
    <td class="gt_row gt_right">2018-04-04 15:55</td>
    <td class="gt_row gt_left">row_4</td>
  </tr>
  <tr>
    <td class="gt_row gt_right">5550.0</td>
    <td class="gt_row gt_left"><na></na></td>
    <td class="gt_row gt_right">2015-05-15</td>
    <td class="gt_row gt_right">2018-05-05 04:00</td>
    <td class="gt_row gt_left">row_5</td>
  </tr>
</tbody>


</table>

</div>
</div>
</div>
<p>You don’t have to define widths for all columns with <a href="../../reference/GT.cols_width.html#great_tables.GT.cols_width"><code>cols_width()</code></a>, and you’re free to use either <code>px</code> or <code>%</code> values when defining widths. See the <a href="../../reference/GT.cols_width.html#great_tables.GT.cols_width">reference page</a> for more information and relevant examples.</p>
</section>
<section id="setting-options-across-the-entire-table-with-tab_options" class="level3">
<h3 class="anchored" data-anchor-id="setting-options-across-the-entire-table-with-tab_options">Setting options across the entire table with <code>tab_options()</code></h3>
<p>The new <a href="../../reference/GT.tab_options.html#great_tables.GT.tab_options"><code>tab_options()</code></a> method gives you the freedom to specify any of dozens of global style and layout options for the table. Want a font that’s used across all cells? Use the <code>table_font_names=</code> option. Do you need to make the text smaller, but only in the stub? Use <code>stub_font_size=</code> for that. The number of options is perhaps overwhelming at first but we think you’ll enjoy having them around nonetheless. It makes styling the table (and developing your own table themes) a relatively simple task.</p>
<p>Here’s an example that creates a table with a few common components and then uses <a href="../../reference/GT.tab_options.html#great_tables.GT.tab_options"><code>tab_options()</code></a> to set up a collection of fonts for the table with the (also new) <a href="../../reference/system_fonts.html#great_tables.system_fonts"><span><code>system_fonts()</code></span></a> function:</p>
<div id="eab4b445" class="cell" data-execution_count="2">
<div class="code-copy-outer-scaffold"><div class="sourceCode cell-code" id="cb2" style="background: #f1f3f5;"><pre class="sourceCode python code-with-copy"><code class="sourceCode python"><span id="cb2-1"><span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">from</span> great_tables <span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">import</span> md, system_fonts</span>
<span id="cb2-2"></span>
<span id="cb2-3">gt_tbl <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> (</span>
<span id="cb2-4">    GT(</span>
<span id="cb2-5">        exibble[[<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"num"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"char"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"currency"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"row"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"group"</span>]],</span>
<span id="cb2-6">        rowname_col<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"row"</span>,</span>
<span id="cb2-7">        groupname_col<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"group"</span>,</span>
<span id="cb2-8">    )</span>
<span id="cb2-9">    .tab_header(</span>
<span id="cb2-10">        title<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>md(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Data listing from **exibble**"</span>),</span>
<span id="cb2-11">        subtitle<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>md(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"`exibble` is a **Great Tables** dataset."</span>),</span>
<span id="cb2-12">    )</span>
<span id="cb2-13">    .fmt_number(columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"num"</span>)</span>
<span id="cb2-14">    .fmt_currency(columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"currency"</span>)</span>
<span id="cb2-15">    .tab_source_note(source_note<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"This is only a subset of the dataset."</span>)</span>
<span id="cb2-16">)</span>
<span id="cb2-17"></span>
<span id="cb2-18">gt_tbl.tab_options(table_font_names<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>system_fonts(name<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"industrial"</span>))</span></code></pre></div></div>
<div class="cell-output cell-output-display" data-execution_count="2">
<div id="zghuwdntrl" style="padding-left:0px;padding-right:0px;padding-top:10px;padding-bottom:10px;overflow-x:auto;overflow-y:auto;width:auto;height:auto;">
<style>
#zghuwdntrl table {
          font-family: Bahnschrift, 'DIN Alternate', 'Franklin Gothic Medium', 'Nimbus Sans Narrow', sans-serif-condensed, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';
          -webkit-font-smoothing: antialiased;
          -moz-osx-font-smoothing: grayscale;
        }

#zghuwdntrl thead, tbody, tfoot, tr, td, th { border-style: none; }
 tr { background-color: transparent; }
#zghuwdntrl p { margin: 0; padding: 0; }
 #zghuwdntrl .gt_table { display: table; border-collapse: collapse; line-height: normal; margin-left: auto; margin-right: auto; color: #333333; font-size: 16px; font-weight: normal; font-style: normal; background-color: #FFFFFF; width: auto; border-top-style: solid; border-top-width: 2px; border-top-color: #A8A8A8; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #A8A8A8; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; }
 #zghuwdntrl .gt_caption { padding-top: 4px; padding-bottom: 4px; }
 #zghuwdntrl .gt_title { color: #333333; font-size: 125%; font-weight: initial; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; border-bottom-color: #FFFFFF; border-bottom-width: 0; }
 #zghuwdntrl .gt_subtitle { color: #333333; font-size: 85%; font-weight: initial; padding-top: 3px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; border-top-color: #FFFFFF; border-top-width: 0; }
 #zghuwdntrl .gt_heading { background-color: #FFFFFF; text-align: center; border-bottom-color: #FFFFFF; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #zghuwdntrl .gt_bottom_border { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #zghuwdntrl .gt_col_headings { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #zghuwdntrl .gt_col_heading { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; overflow-x: hidden; }
 #zghuwdntrl .gt_column_spanner_outer { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; padding-top: 0; padding-bottom: 0; padding-left: 4px; padding-right: 4px; }
 #zghuwdntrl .gt_column_spanner_outer:first-child { padding-left: 0; }
 #zghuwdntrl .gt_column_spanner_outer:last-child { padding-right: 0; }
 #zghuwdntrl .gt_column_spanner { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; overflow-x: hidden; display: inline-block; width: 100%; }
 #zghuwdntrl .gt_spanner_row { border-bottom-style: hidden; }
 #zghuwdntrl .gt_group_heading { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; text-align: left; }
 #zghuwdntrl .gt_empty_group_heading { padding: 0.5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: middle; }
 #zghuwdntrl .gt_from_md> :first-child { margin-top: 0; }
 #zghuwdntrl .gt_from_md> :last-child { margin-bottom: 0; }
 #zghuwdntrl .gt_row { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; margin: 10px; border-top-style: solid; border-top-width: 1px; border-top-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; overflow-x: hidden; }
 #zghuwdntrl .gt_stub { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; }
 #zghuwdntrl .gt_stub_row_group { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; vertical-align: top; }
 #zghuwdntrl .gt_row_group_first td { border-top-width: 2px; }
 #zghuwdntrl .gt_row_group_first th { border-top-width: 2px; }
 #zghuwdntrl .gt_striped { color: #333333; background-color: #F4F4F4; }
 #zghuwdntrl .gt_table_body { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #zghuwdntrl .gt_grand_summary_row { color: #333333; background-color: #FFFFFF; text-transform: inherit; padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; }
 #zghuwdntrl .gt_first_grand_summary_row_bottom { border-top-style: double; border-top-width: 6px; border-top-color: #D3D3D3; }
 #zghuwdntrl .gt_last_grand_summary_row_top { border-bottom-style: double; border-bottom-width: 6px; border-bottom-color: #D3D3D3; }
 #zghuwdntrl .gt_sourcenotes { color: #333333; background-color: #FFFFFF; border-bottom-style: none; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; }
 #zghuwdntrl .gt_sourcenote { font-size: 90%; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; text-align: left; }
 #zghuwdntrl .gt_left { text-align: left; }
 #zghuwdntrl .gt_center { text-align: center; }
 #zghuwdntrl .gt_right { text-align: right; font-variant-numeric: tabular-nums; }
 #zghuwdntrl .gt_font_normal { font-weight: normal; }
 #zghuwdntrl .gt_font_bold { font-weight: bold; }
 #zghuwdntrl .gt_font_italic { font-style: italic; }
 #zghuwdntrl .gt_super { font-size: 65%; }
 #zghuwdntrl .gt_footnote_marks { font-size: 75%; vertical-align: 0.4em; position: initial; }
 #zghuwdntrl .gt_asterisk { font-size: 100%; vertical-align: 0; }
 
</style>
<table class="gt_table" data-quarto-disable-processing="false" data-quarto-bootstrap="false">
<thead>

  <tr class="gt_heading">
    <td colspan="4" class="gt_heading gt_title gt_font_normal">Data listing from <strong>exibble</strong></td>
  </tr>
  <tr class="gt_heading">
    <td colspan="4" class="gt_heading gt_subtitle gt_font_normal gt_bottom_border"><code>exibble</code> is a <strong>Great Tables</strong> dataset.</td>
  </tr>
<tr class="gt_col_headings">
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="1" colspan="1" scope="col" id=""></th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="num">num</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="1" colspan="1" scope="col" id="char">char</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="currency">currency</th>
</tr>
</thead>
<tbody class="gt_table_body">
  <tr class="gt_group_heading_row">
    <th class="gt_group_heading" colspan="4">grp_a</th>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">row_1</th>
    <td class="gt_row gt_right">0.11</td>
    <td class="gt_row gt_left">apricot</td>
    <td class="gt_row gt_right">$49.95</td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">row_2</th>
    <td class="gt_row gt_right">2.22</td>
    <td class="gt_row gt_left">banana</td>
    <td class="gt_row gt_right">$17.95</td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">row_3</th>
    <td class="gt_row gt_right">33.33</td>
    <td class="gt_row gt_left">coconut</td>
    <td class="gt_row gt_right">$1.39</td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">row_4</th>
    <td class="gt_row gt_right">444.40</td>
    <td class="gt_row gt_left">durian</td>
    <td class="gt_row gt_right">$65,100.00</td>
  </tr>
  <tr class="gt_group_heading_row">
    <th class="gt_group_heading" colspan="4">grp_b</th>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">row_5</th>
    <td class="gt_row gt_right">5,550.00</td>
    <td class="gt_row gt_left"><na></na></td>
    <td class="gt_row gt_right">$1,325.81</td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">row_6</th>
    <td class="gt_row gt_right"><na></na></td>
    <td class="gt_row gt_left">fig</td>
    <td class="gt_row gt_right">$13.26</td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">row_7</th>
    <td class="gt_row gt_right">777,000.00</td>
    <td class="gt_row gt_left">grapefruit</td>
    <td class="gt_row gt_right"><na></na></td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">row_8</th>
    <td class="gt_row gt_right">8,880,000.00</td>
    <td class="gt_row gt_left">honeydew</td>
    <td class="gt_row gt_right">$0.44</td>
  </tr>
</tbody>
  <tfoot class="gt_sourcenotes">
  
  <tr>
    <td class="gt_sourcenote" colspan="4">This is only a subset of the dataset.</td>
  </tr>

</tfoot>

</table>

</div>
</div>
</div>
<p>Note that <code>table_font_names=</code> accepts a list of fonts that operate as fallbacks for users across different systems (i.e., they may not have the font you have). And the <a href="../../reference/system_fonts.html#great_tables.system_fonts"><span><code>system_fonts()</code></span></a> helper function in <strong>Great Tables</strong> makes this easy by providing you with themed, local font stacks that are meant to work across different computing platforms.</p>
<p>Here’s another example where we set the width of the table to span across the entire page (or containing element).</p>
<div id="310875c0" class="cell" data-execution_count="3">
<div class="code-copy-outer-scaffold"><div class="sourceCode cell-code" id="cb3" style="background: #f1f3f5;"><pre class="sourceCode python code-with-copy"><code class="sourceCode python"><span id="cb3-1">gt_tbl.tab_options(table_width<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"100%"</span>)</span></code></pre></div></div>
<div class="cell-output cell-output-display" data-execution_count="3">
<div id="mvxpcymxpu" style="padding-left:0px;padding-right:0px;padding-top:10px;padding-bottom:10px;overflow-x:auto;overflow-y:auto;width:auto;height:auto;">
<style>
#mvxpcymxpu table {
          font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Helvetica Neue', 'Fira Sans', 'Droid Sans', Arial, sans-serif;
          -webkit-font-smoothing: antialiased;
          -moz-osx-font-smoothing: grayscale;
        }

#mvxpcymxpu thead, tbody, tfoot, tr, td, th { border-style: none; }
 tr { background-color: transparent; }
#mvxpcymxpu p { margin: 0; padding: 0; }
 #mvxpcymxpu .gt_table { display: table; border-collapse: collapse; line-height: normal; margin-left: auto; margin-right: auto; color: #333333; font-size: 16px; font-weight: normal; font-style: normal; background-color: #FFFFFF; width: 100%; border-top-style: solid; border-top-width: 2px; border-top-color: #A8A8A8; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #A8A8A8; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; }
 #mvxpcymxpu .gt_caption { padding-top: 4px; padding-bottom: 4px; }
 #mvxpcymxpu .gt_title { color: #333333; font-size: 125%; font-weight: initial; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; border-bottom-color: #FFFFFF; border-bottom-width: 0; }
 #mvxpcymxpu .gt_subtitle { color: #333333; font-size: 85%; font-weight: initial; padding-top: 3px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; border-top-color: #FFFFFF; border-top-width: 0; }
 #mvxpcymxpu .gt_heading { background-color: #FFFFFF; text-align: center; border-bottom-color: #FFFFFF; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #mvxpcymxpu .gt_bottom_border { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #mvxpcymxpu .gt_col_headings { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #mvxpcymxpu .gt_col_heading { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; overflow-x: hidden; }
 #mvxpcymxpu .gt_column_spanner_outer { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; padding-top: 0; padding-bottom: 0; padding-left: 4px; padding-right: 4px; }
 #mvxpcymxpu .gt_column_spanner_outer:first-child { padding-left: 0; }
 #mvxpcymxpu .gt_column_spanner_outer:last-child { padding-right: 0; }
 #mvxpcymxpu .gt_column_spanner { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; overflow-x: hidden; display: inline-block; width: 100%; }
 #mvxpcymxpu .gt_spanner_row { border-bottom-style: hidden; }
 #mvxpcymxpu .gt_group_heading { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; text-align: left; }
 #mvxpcymxpu .gt_empty_group_heading { padding: 0.5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: middle; }
 #mvxpcymxpu .gt_from_md> :first-child { margin-top: 0; }
 #mvxpcymxpu .gt_from_md> :last-child { margin-bottom: 0; }
 #mvxpcymxpu .gt_row { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; margin: 10px; border-top-style: solid; border-top-width: 1px; border-top-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; overflow-x: hidden; }
 #mvxpcymxpu .gt_stub { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; }
 #mvxpcymxpu .gt_stub_row_group { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; vertical-align: top; }
 #mvxpcymxpu .gt_row_group_first td { border-top-width: 2px; }
 #mvxpcymxpu .gt_row_group_first th { border-top-width: 2px; }
 #mvxpcymxpu .gt_striped { color: #333333; background-color: #F4F4F4; }
 #mvxpcymxpu .gt_table_body { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #mvxpcymxpu .gt_grand_summary_row { color: #333333; background-color: #FFFFFF; text-transform: inherit; padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; }
 #mvxpcymxpu .gt_first_grand_summary_row_bottom { border-top-style: double; border-top-width: 6px; border-top-color: #D3D3D3; }
 #mvxpcymxpu .gt_last_grand_summary_row_top { border-bottom-style: double; border-bottom-width: 6px; border-bottom-color: #D3D3D3; }
 #mvxpcymxpu .gt_sourcenotes { color: #333333; background-color: #FFFFFF; border-bottom-style: none; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; }
 #mvxpcymxpu .gt_sourcenote { font-size: 90%; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; text-align: left; }
 #mvxpcymxpu .gt_left { text-align: left; }
 #mvxpcymxpu .gt_center { text-align: center; }
 #mvxpcymxpu .gt_right { text-align: right; font-variant-numeric: tabular-nums; }
 #mvxpcymxpu .gt_font_normal { font-weight: normal; }
 #mvxpcymxpu .gt_font_bold { font-weight: bold; }
 #mvxpcymxpu .gt_font_italic { font-style: italic; }
 #mvxpcymxpu .gt_super { font-size: 65%; }
 #mvxpcymxpu .gt_footnote_marks { font-size: 75%; vertical-align: 0.4em; position: initial; }
 #mvxpcymxpu .gt_asterisk { font-size: 100%; vertical-align: 0; }
 
</style>
<table class="gt_table" data-quarto-disable-processing="false" data-quarto-bootstrap="false">
<thead>

  <tr class="gt_heading">
    <td colspan="4" class="gt_heading gt_title gt_font_normal">Data listing from <strong>exibble</strong></td>
  </tr>
  <tr class="gt_heading">
    <td colspan="4" class="gt_heading gt_subtitle gt_font_normal gt_bottom_border"><code>exibble</code> is a <strong>Great Tables</strong> dataset.</td>
  </tr>
<tr class="gt_col_headings">
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="1" colspan="1" scope="col" id=""></th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="num">num</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="1" colspan="1" scope="col" id="char">char</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="currency">currency</th>
</tr>
</thead>
<tbody class="gt_table_body">
  <tr class="gt_group_heading_row">
    <th class="gt_group_heading" colspan="4">grp_a</th>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">row_1</th>
    <td class="gt_row gt_right">0.11</td>
    <td class="gt_row gt_left">apricot</td>
    <td class="gt_row gt_right">$49.95</td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">row_2</th>
    <td class="gt_row gt_right">2.22</td>
    <td class="gt_row gt_left">banana</td>
    <td class="gt_row gt_right">$17.95</td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">row_3</th>
    <td class="gt_row gt_right">33.33</td>
    <td class="gt_row gt_left">coconut</td>
    <td class="gt_row gt_right">$1.39</td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">row_4</th>
    <td class="gt_row gt_right">444.40</td>
    <td class="gt_row gt_left">durian</td>
    <td class="gt_row gt_right">$65,100.00</td>
  </tr>
  <tr class="gt_group_heading_row">
    <th class="gt_group_heading" colspan="4">grp_b</th>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">row_5</th>
    <td class="gt_row gt_right">5,550.00</td>
    <td class="gt_row gt_left"><na></na></td>
    <td class="gt_row gt_right">$1,325.81</td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">row_6</th>
    <td class="gt_row gt_right"><na></na></td>
    <td class="gt_row gt_left">fig</td>
    <td class="gt_row gt_right">$13.26</td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">row_7</th>
    <td class="gt_row gt_right">777,000.00</td>
    <td class="gt_row gt_left">grapefruit</td>
    <td class="gt_row gt_right"><na></na></td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">row_8</th>
    <td class="gt_row gt_right">8,880,000.00</td>
    <td class="gt_row gt_left">honeydew</td>
    <td class="gt_row gt_right">$0.44</td>
  </tr>
</tbody>
  <tfoot class="gt_sourcenotes">
  
  <tr>
    <td class="gt_sourcenote" colspan="4">This is only a subset of the dataset.</td>
  </tr>

</tfoot>

</table>

</div>
</div>
</div>
<p>One more where the background color of the table is set to <code>"lightcyan"</code>:</p>
<div id="565c2df3" class="cell" data-execution_count="4">
<div class="code-copy-outer-scaffold"><div class="sourceCode cell-code" id="cb4" style="background: #f1f3f5;"><pre class="sourceCode python code-with-copy"><code class="sourceCode python"><span id="cb4-1">gt_tbl.tab_options(table_background_color<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"lightcyan"</span>)</span></code></pre></div></div>
<div class="cell-output cell-output-display" data-execution_count="4">
<div id="oovwmfigbx" style="padding-left:0px;padding-right:0px;padding-top:10px;padding-bottom:10px;overflow-x:auto;overflow-y:auto;width:auto;height:auto;">
<style>
#oovwmfigbx table {
          font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Helvetica Neue', 'Fira Sans', 'Droid Sans', Arial, sans-serif;
          -webkit-font-smoothing: antialiased;
          -moz-osx-font-smoothing: grayscale;
        }

#oovwmfigbx thead, tbody, tfoot, tr, td, th { border-style: none; }
 tr { background-color: transparent; }
#oovwmfigbx p { margin: 0; padding: 0; }
 #oovwmfigbx .gt_table { display: table; border-collapse: collapse; line-height: normal; margin-left: auto; margin-right: auto; color: #333333; font-size: 16px; font-weight: normal; font-style: normal; background-color: lightcyan; width: auto; border-top-style: solid; border-top-width: 2px; border-top-color: #A8A8A8; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #A8A8A8; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; }
 #oovwmfigbx .gt_caption { padding-top: 4px; padding-bottom: 4px; }
 #oovwmfigbx .gt_title { color: #333333; font-size: 125%; font-weight: initial; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; border-bottom-color: lightcyan; border-bottom-width: 0; }
 #oovwmfigbx .gt_subtitle { color: #333333; font-size: 85%; font-weight: initial; padding-top: 3px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; border-top-color: lightcyan; border-top-width: 0; }
 #oovwmfigbx .gt_heading { background-color: lightcyan; text-align: center; border-bottom-color: lightcyan; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #oovwmfigbx .gt_bottom_border { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #oovwmfigbx .gt_col_headings { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #oovwmfigbx .gt_col_heading { color: #333333; background-color: lightcyan; font-size: 100%; font-weight: normal; text-transform: inherit; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; overflow-x: hidden; }
 #oovwmfigbx .gt_column_spanner_outer { color: #333333; background-color: lightcyan; font-size: 100%; font-weight: normal; text-transform: inherit; padding-top: 0; padding-bottom: 0; padding-left: 4px; padding-right: 4px; }
 #oovwmfigbx .gt_column_spanner_outer:first-child { padding-left: 0; }
 #oovwmfigbx .gt_column_spanner_outer:last-child { padding-right: 0; }
 #oovwmfigbx .gt_column_spanner { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; overflow-x: hidden; display: inline-block; width: 100%; }
 #oovwmfigbx .gt_spanner_row { border-bottom-style: hidden; }
 #oovwmfigbx .gt_group_heading { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; color: #333333; background-color: lightcyan; font-size: 100%; font-weight: initial; text-transform: inherit; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; text-align: left; }
 #oovwmfigbx .gt_empty_group_heading { padding: 0.5px; color: #333333; background-color: lightcyan; font-size: 100%; font-weight: initial; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: middle; }
 #oovwmfigbx .gt_from_md> :first-child { margin-top: 0; }
 #oovwmfigbx .gt_from_md> :last-child { margin-bottom: 0; }
 #oovwmfigbx .gt_row { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; margin: 10px; border-top-style: solid; border-top-width: 1px; border-top-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; overflow-x: hidden; }
 #oovwmfigbx .gt_stub { color: #333333; background-color: lightcyan; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; }
 #oovwmfigbx .gt_stub_row_group { color: #333333; background-color: lightcyan; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; vertical-align: top; }
 #oovwmfigbx .gt_row_group_first td { border-top-width: 2px; }
 #oovwmfigbx .gt_row_group_first th { border-top-width: 2px; }
 #oovwmfigbx .gt_striped { color: #333333; background-color: #F4F4F4; }
 #oovwmfigbx .gt_table_body { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #oovwmfigbx .gt_grand_summary_row { color: #333333; background-color: lightcyan; text-transform: inherit; padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; }
 #oovwmfigbx .gt_first_grand_summary_row_bottom { border-top-style: double; border-top-width: 6px; border-top-color: #D3D3D3; }
 #oovwmfigbx .gt_last_grand_summary_row_top { border-bottom-style: double; border-bottom-width: 6px; border-bottom-color: #D3D3D3; }
 #oovwmfigbx .gt_sourcenotes { color: #333333; background-color: lightcyan; border-bottom-style: none; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; }
 #oovwmfigbx .gt_sourcenote { font-size: 90%; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; text-align: left; }
 #oovwmfigbx .gt_left { text-align: left; }
 #oovwmfigbx .gt_center { text-align: center; }
 #oovwmfigbx .gt_right { text-align: right; font-variant-numeric: tabular-nums; }
 #oovwmfigbx .gt_font_normal { font-weight: normal; }
 #oovwmfigbx .gt_font_bold { font-weight: bold; }
 #oovwmfigbx .gt_font_italic { font-style: italic; }
 #oovwmfigbx .gt_super { font-size: 65%; }
 #oovwmfigbx .gt_footnote_marks { font-size: 75%; vertical-align: 0.4em; position: initial; }
 #oovwmfigbx .gt_asterisk { font-size: 100%; vertical-align: 0; }
 
</style>
<table class="gt_table" data-quarto-disable-processing="false" data-quarto-bootstrap="false">
<thead>

  <tr class="gt_heading">
    <td colspan="4" class="gt_heading gt_title gt_font_normal">Data listing from <strong>exibble</strong></td>
  </tr>
  <tr class="gt_heading">
    <td colspan="4" class="gt_heading gt_subtitle gt_font_normal gt_bottom_border"><code>exibble</code> is a <strong>Great Tables</strong> dataset.</td>
  </tr>
<tr class="gt_col_headings">
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="1" colspan="1" scope="col" id=""></th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="num">num</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="1" colspan="1" scope="col" id="char">char</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="currency">currency</th>
</tr>
</thead>
<tbody class="gt_table_body">
  <tr class="gt_group_heading_row">
    <th class="gt_group_heading" colspan="4">grp_a</th>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">row_1</th>
    <td class="gt_row gt_right">0.11</td>
    <td class="gt_row gt_left">apricot</td>
    <td class="gt_row gt_right">$49.95</td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">row_2</th>
    <td class="gt_row gt_right">2.22</td>
    <td class="gt_row gt_left">banana</td>
    <td class="gt_row gt_right">$17.95</td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">row_3</th>
    <td class="gt_row gt_right">33.33</td>
    <td class="gt_row gt_left">coconut</td>
    <td class="gt_row gt_right">$1.39</td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">row_4</th>
    <td class="gt_row gt_right">444.40</td>
    <td class="gt_row gt_left">durian</td>
    <td class="gt_row gt_right">$65,100.00</td>
  </tr>
  <tr class="gt_group_heading_row">
    <th class="gt_group_heading" colspan="4">grp_b</th>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">row_5</th>
    <td class="gt_row gt_right">5,550.00</td>
    <td class="gt_row gt_left"><na></na></td>
    <td class="gt_row gt_right">$1,325.81</td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">row_6</th>
    <td class="gt_row gt_right"><na></na></td>
    <td class="gt_row gt_left">fig</td>
    <td class="gt_row gt_right">$13.26</td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">row_7</th>
    <td class="gt_row gt_right">777,000.00</td>
    <td class="gt_row gt_left">grapefruit</td>
    <td class="gt_row gt_right"><na></na></td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">row_8</th>
    <td class="gt_row gt_right">8,880,000.00</td>
    <td class="gt_row gt_left">honeydew</td>
    <td class="gt_row gt_right">$0.44</td>
  </tr>
</tbody>
  <tfoot class="gt_sourcenotes">
  
  <tr>
    <td class="gt_sourcenote" colspan="4">This is only a subset of the dataset.</td>
  </tr>

</tfoot>

</table>

</div>
</div>
</div>
<p>There are many more options available in <a href="../../reference/GT.tab_options.html#great_tables.GT.tab_options"><code>tab_options()</code></a>, so have a look at its <a href="../../reference/GT.tab_options.html#great_tables.GT.tab_options">reference page</a> for more information and useful examples.</p>
</section>
<section id="using-the-new-opt_-methods-to-do-more-complex-tasks-with-table-options" class="level3">
<h3 class="anchored" data-anchor-id="using-the-new-opt_-methods-to-do-more-complex-tasks-with-table-options">Using the new <code>opt_*()</code> methods to do more complex tasks with table options</h3>
<p>While <a href="../../reference/GT.tab_options.html#great_tables.GT.tab_options"><code>tab_options()</code></a> is a great method for setting global table options, sometimes you want to set a number of them at once for a combined effect. For that type of operation, we have the <code>opt_*()</code> series of methods. A common thing you might do is align the content in the table header, we can make that an easy thing with <a href="../../reference/GT.opt_align_table_header.html#great_tables.GT.opt_align_table_header"><code>opt_align_table_header()</code></a>:</p>
<div id="79ea6d29" class="cell" data-execution_count="5">
<div class="code-copy-outer-scaffold"><div class="sourceCode cell-code" id="cb5" style="background: #f1f3f5;"><pre class="sourceCode python code-with-copy"><code class="sourceCode python"><span id="cb5-1">gt_tbl.opt_align_table_header(align<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"left"</span>)</span></code></pre></div></div>
<div class="cell-output cell-output-display" data-execution_count="5">
<div id="bukkxyxoot" style="padding-left:0px;padding-right:0px;padding-top:10px;padding-bottom:10px;overflow-x:auto;overflow-y:auto;width:auto;height:auto;">
<style>
#bukkxyxoot table {
          font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Helvetica Neue', 'Fira Sans', 'Droid Sans', Arial, sans-serif;
          -webkit-font-smoothing: antialiased;
          -moz-osx-font-smoothing: grayscale;
        }

#bukkxyxoot thead, tbody, tfoot, tr, td, th { border-style: none; }
 tr { background-color: transparent; }
#bukkxyxoot p { margin: 0; padding: 0; }
 #bukkxyxoot .gt_table { display: table; border-collapse: collapse; line-height: normal; margin-left: auto; margin-right: auto; color: #333333; font-size: 16px; font-weight: normal; font-style: normal; background-color: #FFFFFF; width: auto; border-top-style: solid; border-top-width: 2px; border-top-color: #A8A8A8; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #A8A8A8; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; }
 #bukkxyxoot .gt_caption { padding-top: 4px; padding-bottom: 4px; }
 #bukkxyxoot .gt_title { color: #333333; font-size: 125%; font-weight: initial; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; border-bottom-color: #FFFFFF; border-bottom-width: 0; }
 #bukkxyxoot .gt_subtitle { color: #333333; font-size: 85%; font-weight: initial; padding-top: 3px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; border-top-color: #FFFFFF; border-top-width: 0; }
 #bukkxyxoot .gt_heading { background-color: #FFFFFF; text-align: left; border-bottom-color: #FFFFFF; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #bukkxyxoot .gt_bottom_border { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #bukkxyxoot .gt_col_headings { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #bukkxyxoot .gt_col_heading { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; overflow-x: hidden; }
 #bukkxyxoot .gt_column_spanner_outer { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; padding-top: 0; padding-bottom: 0; padding-left: 4px; padding-right: 4px; }
 #bukkxyxoot .gt_column_spanner_outer:first-child { padding-left: 0; }
 #bukkxyxoot .gt_column_spanner_outer:last-child { padding-right: 0; }
 #bukkxyxoot .gt_column_spanner { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; overflow-x: hidden; display: inline-block; width: 100%; }
 #bukkxyxoot .gt_spanner_row { border-bottom-style: hidden; }
 #bukkxyxoot .gt_group_heading { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; text-align: left; }
 #bukkxyxoot .gt_empty_group_heading { padding: 0.5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: middle; }
 #bukkxyxoot .gt_from_md> :first-child { margin-top: 0; }
 #bukkxyxoot .gt_from_md> :last-child { margin-bottom: 0; }
 #bukkxyxoot .gt_row { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; margin: 10px; border-top-style: solid; border-top-width: 1px; border-top-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; overflow-x: hidden; }
 #bukkxyxoot .gt_stub { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; }
 #bukkxyxoot .gt_stub_row_group { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; vertical-align: top; }
 #bukkxyxoot .gt_row_group_first td { border-top-width: 2px; }
 #bukkxyxoot .gt_row_group_first th { border-top-width: 2px; }
 #bukkxyxoot .gt_striped { color: #333333; background-color: #F4F4F4; }
 #bukkxyxoot .gt_table_body { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #bukkxyxoot .gt_grand_summary_row { color: #333333; background-color: #FFFFFF; text-transform: inherit; padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; }
 #bukkxyxoot .gt_first_grand_summary_row_bottom { border-top-style: double; border-top-width: 6px; border-top-color: #D3D3D3; }
 #bukkxyxoot .gt_last_grand_summary_row_top { border-bottom-style: double; border-bottom-width: 6px; border-bottom-color: #D3D3D3; }
 #bukkxyxoot .gt_sourcenotes { color: #333333; background-color: #FFFFFF; border-bottom-style: none; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; }
 #bukkxyxoot .gt_sourcenote { font-size: 90%; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; text-align: left; }
 #bukkxyxoot .gt_left { text-align: left; }
 #bukkxyxoot .gt_center { text-align: center; }
 #bukkxyxoot .gt_right { text-align: right; font-variant-numeric: tabular-nums; }
 #bukkxyxoot .gt_font_normal { font-weight: normal; }
 #bukkxyxoot .gt_font_bold { font-weight: bold; }
 #bukkxyxoot .gt_font_italic { font-style: italic; }
 #bukkxyxoot .gt_super { font-size: 65%; }
 #bukkxyxoot .gt_footnote_marks { font-size: 75%; vertical-align: 0.4em; position: initial; }
 #bukkxyxoot .gt_asterisk { font-size: 100%; vertical-align: 0; }
 
</style>
<table class="gt_table" data-quarto-disable-processing="false" data-quarto-bootstrap="false">
<thead>

  <tr class="gt_heading">
    <td colspan="4" class="gt_heading gt_title gt_font_normal">Data listing from <strong>exibble</strong></td>
  </tr>
  <tr class="gt_heading">
    <td colspan="4" class="gt_heading gt_subtitle gt_font_normal gt_bottom_border"><code>exibble</code> is a <strong>Great Tables</strong> dataset.</td>
  </tr>
<tr class="gt_col_headings">
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="1" colspan="1" scope="col" id=""></th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="num">num</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="1" colspan="1" scope="col" id="char">char</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="currency">currency</th>
</tr>
</thead>
<tbody class="gt_table_body">
  <tr class="gt_group_heading_row">
    <th class="gt_group_heading" colspan="4">grp_a</th>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">row_1</th>
    <td class="gt_row gt_right">0.11</td>
    <td class="gt_row gt_left">apricot</td>
    <td class="gt_row gt_right">$49.95</td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">row_2</th>
    <td class="gt_row gt_right">2.22</td>
    <td class="gt_row gt_left">banana</td>
    <td class="gt_row gt_right">$17.95</td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">row_3</th>
    <td class="gt_row gt_right">33.33</td>
    <td class="gt_row gt_left">coconut</td>
    <td class="gt_row gt_right">$1.39</td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">row_4</th>
    <td class="gt_row gt_right">444.40</td>
    <td class="gt_row gt_left">durian</td>
    <td class="gt_row gt_right">$65,100.00</td>
  </tr>
  <tr class="gt_group_heading_row">
    <th class="gt_group_heading" colspan="4">grp_b</th>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">row_5</th>
    <td class="gt_row gt_right">5,550.00</td>
    <td class="gt_row gt_left"><na></na></td>
    <td class="gt_row gt_right">$1,325.81</td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">row_6</th>
    <td class="gt_row gt_right"><na></na></td>
    <td class="gt_row gt_left">fig</td>
    <td class="gt_row gt_right">$13.26</td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">row_7</th>
    <td class="gt_row gt_right">777,000.00</td>
    <td class="gt_row gt_left">grapefruit</td>
    <td class="gt_row gt_right"><na></na></td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">row_8</th>
    <td class="gt_row gt_right">8,880,000.00</td>
    <td class="gt_row gt_left">honeydew</td>
    <td class="gt_row gt_right">$0.44</td>
  </tr>
</tbody>
  <tfoot class="gt_sourcenotes">
  
  <tr>
    <td class="gt_sourcenote" colspan="4">This is only a subset of the dataset.</td>
  </tr>

</tfoot>

</table>

</div>
</div>
</div>
<p>With that, you don’t have to hunt through the myriad options within <a href="../../reference/GT.tab_options.html#great_tables.GT.tab_options"><code>tab_options()</code></a> to find the two args you need to get the job done.</p>
<p>The <a href="../../reference/GT.opt_all_caps.html#great_tables.GT.opt_all_caps"><code>opt_all_caps()</code></a> method transforms the text within the column labels, the stub, and in all row groups so that we get an all-capitalized (yet somewhat sized down) look that better differentiates the labels from the data. It’s rather easy to use, just do this:</p>
<div id="92ddd9d6" class="cell" data-execution_count="6">
<div class="code-copy-outer-scaffold"><div class="sourceCode cell-code" id="cb6" style="background: #f1f3f5;"><pre class="sourceCode python code-with-copy"><code class="sourceCode python"><span id="cb6-1">gt_tbl.opt_all_caps()</span></code></pre></div></div>
<div class="cell-output cell-output-display" data-execution_count="6">
<div id="zshlpqcclo" style="padding-left:0px;padding-right:0px;padding-top:10px;padding-bottom:10px;overflow-x:auto;overflow-y:auto;width:auto;height:auto;">
<style>
#zshlpqcclo table {
          font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Helvetica Neue', 'Fira Sans', 'Droid Sans', Arial, sans-serif;
          -webkit-font-smoothing: antialiased;
          -moz-osx-font-smoothing: grayscale;
        }

#zshlpqcclo thead, tbody, tfoot, tr, td, th { border-style: none; }
 tr { background-color: transparent; }
#zshlpqcclo p { margin: 0; padding: 0; }
 #zshlpqcclo .gt_table { display: table; border-collapse: collapse; line-height: normal; margin-left: auto; margin-right: auto; color: #333333; font-size: 16px; font-weight: normal; font-style: normal; background-color: #FFFFFF; width: auto; border-top-style: solid; border-top-width: 2px; border-top-color: #A8A8A8; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #A8A8A8; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; }
 #zshlpqcclo .gt_caption { padding-top: 4px; padding-bottom: 4px; }
 #zshlpqcclo .gt_title { color: #333333; font-size: 125%; font-weight: initial; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; border-bottom-color: #FFFFFF; border-bottom-width: 0; }
 #zshlpqcclo .gt_subtitle { color: #333333; font-size: 85%; font-weight: initial; padding-top: 3px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; border-top-color: #FFFFFF; border-top-width: 0; }
 #zshlpqcclo .gt_heading { background-color: #FFFFFF; text-align: center; border-bottom-color: #FFFFFF; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #zshlpqcclo .gt_bottom_border { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #zshlpqcclo .gt_col_headings { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #zshlpqcclo .gt_col_heading { color: #333333; background-color: #FFFFFF; font-size: 80%; font-weight: bolder; text-transform: uppercase; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; overflow-x: hidden; }
 #zshlpqcclo .gt_column_spanner_outer { color: #333333; background-color: #FFFFFF; font-size: 80%; font-weight: bolder; text-transform: uppercase; padding-top: 0; padding-bottom: 0; padding-left: 4px; padding-right: 4px; }
 #zshlpqcclo .gt_column_spanner_outer:first-child { padding-left: 0; }
 #zshlpqcclo .gt_column_spanner_outer:last-child { padding-right: 0; }
 #zshlpqcclo .gt_column_spanner { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; overflow-x: hidden; display: inline-block; width: 100%; }
 #zshlpqcclo .gt_spanner_row { border-bottom-style: hidden; }
 #zshlpqcclo .gt_group_heading { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; color: #333333; background-color: #FFFFFF; font-size: 80%; font-weight: bolder; text-transform: uppercase; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; text-align: left; }
 #zshlpqcclo .gt_empty_group_heading { padding: 0.5px; color: #333333; background-color: #FFFFFF; font-size: 80%; font-weight: bolder; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: middle; }
 #zshlpqcclo .gt_from_md> :first-child { margin-top: 0; }
 #zshlpqcclo .gt_from_md> :last-child { margin-bottom: 0; }
 #zshlpqcclo .gt_row { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; margin: 10px; border-top-style: solid; border-top-width: 1px; border-top-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; overflow-x: hidden; }
 #zshlpqcclo .gt_stub { color: #333333; background-color: #FFFFFF; font-size: 80%; font-weight: bolder; text-transform: uppercase; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; }
 #zshlpqcclo .gt_stub_row_group { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; vertical-align: top; }
 #zshlpqcclo .gt_row_group_first td { border-top-width: 2px; }
 #zshlpqcclo .gt_row_group_first th { border-top-width: 2px; }
 #zshlpqcclo .gt_striped { color: #333333; background-color: #F4F4F4; }
 #zshlpqcclo .gt_table_body { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #zshlpqcclo .gt_grand_summary_row { color: #333333; background-color: #FFFFFF; text-transform: inherit; padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; }
 #zshlpqcclo .gt_first_grand_summary_row_bottom { border-top-style: double; border-top-width: 6px; border-top-color: #D3D3D3; }
 #zshlpqcclo .gt_last_grand_summary_row_top { border-bottom-style: double; border-bottom-width: 6px; border-bottom-color: #D3D3D3; }
 #zshlpqcclo .gt_sourcenotes { color: #333333; background-color: #FFFFFF; border-bottom-style: none; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; }
 #zshlpqcclo .gt_sourcenote { font-size: 90%; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; text-align: left; }
 #zshlpqcclo .gt_left { text-align: left; }
 #zshlpqcclo .gt_center { text-align: center; }
 #zshlpqcclo .gt_right { text-align: right; font-variant-numeric: tabular-nums; }
 #zshlpqcclo .gt_font_normal { font-weight: normal; }
 #zshlpqcclo .gt_font_bold { font-weight: bold; }
 #zshlpqcclo .gt_font_italic { font-style: italic; }
 #zshlpqcclo .gt_super { font-size: 65%; }
 #zshlpqcclo .gt_footnote_marks { font-size: 75%; vertical-align: 0.4em; position: initial; }
 #zshlpqcclo .gt_asterisk { font-size: 100%; vertical-align: 0; }
 
</style>
<table class="gt_table" data-quarto-disable-processing="false" data-quarto-bootstrap="false">
<thead>

  <tr class="gt_heading">
    <td colspan="4" class="gt_heading gt_title gt_font_normal">Data listing from <strong>exibble</strong></td>
  </tr>
  <tr class="gt_heading">
    <td colspan="4" class="gt_heading gt_subtitle gt_font_normal gt_bottom_border"><code>exibble</code> is a <strong>Great Tables</strong> dataset.</td>
  </tr>
<tr class="gt_col_headings">
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="1" colspan="1" scope="col" id=""></th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="num">num</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="1" colspan="1" scope="col" id="char">char</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="currency">currency</th>
</tr>
</thead>
<tbody class="gt_table_body">
  <tr class="gt_group_heading_row">
    <th class="gt_group_heading" colspan="4">grp_a</th>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">row_1</th>
    <td class="gt_row gt_right">0.11</td>
    <td class="gt_row gt_left">apricot</td>
    <td class="gt_row gt_right">$49.95</td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">row_2</th>
    <td class="gt_row gt_right">2.22</td>
    <td class="gt_row gt_left">banana</td>
    <td class="gt_row gt_right">$17.95</td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">row_3</th>
    <td class="gt_row gt_right">33.33</td>
    <td class="gt_row gt_left">coconut</td>
    <td class="gt_row gt_right">$1.39</td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">row_4</th>
    <td class="gt_row gt_right">444.40</td>
    <td class="gt_row gt_left">durian</td>
    <td class="gt_row gt_right">$65,100.00</td>
  </tr>
  <tr class="gt_group_heading_row">
    <th class="gt_group_heading" colspan="4">grp_b</th>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">row_5</th>
    <td class="gt_row gt_right">5,550.00</td>
    <td class="gt_row gt_left"><na></na></td>
    <td class="gt_row gt_right">$1,325.81</td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">row_6</th>
    <td class="gt_row gt_right"><na></na></td>
    <td class="gt_row gt_left">fig</td>
    <td class="gt_row gt_right">$13.26</td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">row_7</th>
    <td class="gt_row gt_right">777,000.00</td>
    <td class="gt_row gt_left">grapefruit</td>
    <td class="gt_row gt_right"><na></na></td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">row_8</th>
    <td class="gt_row gt_right">8,880,000.00</td>
    <td class="gt_row gt_left">honeydew</td>
    <td class="gt_row gt_right">$0.44</td>
  </tr>
</tbody>
  <tfoot class="gt_sourcenotes">
  
  <tr>
    <td class="gt_sourcenote" colspan="4">This is only a subset of the dataset.</td>
  </tr>

</tfoot>

</table>

</div>
</div>
</div>
<p>This sets nine options you’d otherwise set in <a href="../../reference/GT.tab_options.html#great_tables.GT.tab_options"><code>tab_options()</code></a> all at once, making life generally easier.</p>
<p>Here’s one last example, this time using <a href="../../reference/GT.opt_vertical_padding.html#great_tables.GT.opt_vertical_padding"><code>opt_vertical_padding()</code></a>. You’d use that if you’re dissatisfied with the level of top/bottom padding within cells of all locations (e.g., in the table body, in the column labels, etc.). You can either make a table taller or more ‘compressed’ with a single argument: <code>scale=</code>. Here’s an example where the amount of vertical padding is reduced, resulting in a table taking up less vertical space.</p>
<div id="ce2b434d" class="cell" data-execution_count="7">
<div class="code-copy-outer-scaffold"><div class="sourceCode cell-code" id="cb7" style="background: #f1f3f5;"><pre class="sourceCode python code-with-copy"><code class="sourceCode python"><span id="cb7-1">gt_tbl.opt_vertical_padding(scale<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="fl" style="color: #AD0000;
background-color: null;
font-style: inherit;">0.5</span>)</span></code></pre></div></div>
<div class="cell-output cell-output-display" data-execution_count="7">
<div id="txhunjedyo" style="padding-left:0px;padding-right:0px;padding-top:10px;padding-bottom:10px;overflow-x:auto;overflow-y:auto;width:auto;height:auto;">
<style>
#txhunjedyo table {
          font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Helvetica Neue', 'Fira Sans', 'Droid Sans', Arial, sans-serif;
          -webkit-font-smoothing: antialiased;
          -moz-osx-font-smoothing: grayscale;
        }

#txhunjedyo thead, tbody, tfoot, tr, td, th { border-style: none; }
 tr { background-color: transparent; }
#txhunjedyo p { margin: 0; padding: 0; }
 #txhunjedyo .gt_table { display: table; border-collapse: collapse; line-height: normal; margin-left: auto; margin-right: auto; color: #333333; font-size: 16px; font-weight: normal; font-style: normal; background-color: #FFFFFF; width: auto; border-top-style: solid; border-top-width: 2px; border-top-color: #A8A8A8; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #A8A8A8; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; }
 #txhunjedyo .gt_caption { padding-top: 4px; padding-bottom: 4px; }
 #txhunjedyo .gt_title { color: #333333; font-size: 125%; font-weight: initial; padding-top: 2px; padding-bottom: 2px; padding-left: 5px; padding-right: 5px; border-bottom-color: #FFFFFF; border-bottom-width: 0; }
 #txhunjedyo .gt_subtitle { color: #333333; font-size: 85%; font-weight: initial; padding-top: 1px; padding-bottom: 3px; padding-left: 5px; padding-right: 5px; border-top-color: #FFFFFF; border-top-width: 0; }
 #txhunjedyo .gt_heading { background-color: #FFFFFF; text-align: center; border-bottom-color: #FFFFFF; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #txhunjedyo .gt_bottom_border { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #txhunjedyo .gt_col_headings { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #txhunjedyo .gt_col_heading { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: bottom; padding-top: 2px; padding-bottom: 3px; padding-left: 5px; padding-right: 5px; overflow-x: hidden; }
 #txhunjedyo .gt_column_spanner_outer { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; padding-top: 0; padding-bottom: 0; padding-left: 4px; padding-right: 4px; }
 #txhunjedyo .gt_column_spanner_outer:first-child { padding-left: 0; }
 #txhunjedyo .gt_column_spanner_outer:last-child { padding-right: 0; }
 #txhunjedyo .gt_column_spanner { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: bottom; padding-top: 2px; padding-bottom: 2px; overflow-x: hidden; display: inline-block; width: 100%; }
 #txhunjedyo .gt_spanner_row { border-bottom-style: hidden; }
 #txhunjedyo .gt_group_heading { padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; text-align: left; }
 #txhunjedyo .gt_empty_group_heading { padding: 0.5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: middle; }
 #txhunjedyo .gt_from_md> :first-child { margin-top: 0; }
 #txhunjedyo .gt_from_md> :last-child { margin-bottom: 0; }
 #txhunjedyo .gt_row { padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; margin: 10px; border-top-style: solid; border-top-width: 1px; border-top-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; overflow-x: hidden; }
 #txhunjedyo .gt_stub { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; }
 #txhunjedyo .gt_stub_row_group { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; vertical-align: top; }
 #txhunjedyo .gt_row_group_first td { border-top-width: 2px; }
 #txhunjedyo .gt_row_group_first th { border-top-width: 2px; }
 #txhunjedyo .gt_striped { color: #333333; background-color: #F4F4F4; }
 #txhunjedyo .gt_table_body { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #txhunjedyo .gt_grand_summary_row { color: #333333; background-color: #FFFFFF; text-transform: inherit; padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; }
 #txhunjedyo .gt_first_grand_summary_row_bottom { border-top-style: double; border-top-width: 6px; border-top-color: #D3D3D3; }
 #txhunjedyo .gt_last_grand_summary_row_top { border-bottom-style: double; border-bottom-width: 6px; border-bottom-color: #D3D3D3; }
 #txhunjedyo .gt_sourcenotes { color: #333333; background-color: #FFFFFF; border-bottom-style: none; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; }
 #txhunjedyo .gt_sourcenote { font-size: 90%; padding-top: 2px; padding-bottom: 2px; padding-left: 5px; padding-right: 5px; text-align: left; }
 #txhunjedyo .gt_left { text-align: left; }
 #txhunjedyo .gt_center { text-align: center; }
 #txhunjedyo .gt_right { text-align: right; font-variant-numeric: tabular-nums; }
 #txhunjedyo .gt_font_normal { font-weight: normal; }
 #txhunjedyo .gt_font_bold { font-weight: bold; }
 #txhunjedyo .gt_font_italic { font-style: italic; }
 #txhunjedyo .gt_super { font-size: 65%; }
 #txhunjedyo .gt_footnote_marks { font-size: 75%; vertical-align: 0.4em; position: initial; }
 #txhunjedyo .gt_asterisk { font-size: 100%; vertical-align: 0; }
 
</style>
<table class="gt_table" data-quarto-disable-processing="false" data-quarto-bootstrap="false">
<thead>

  <tr class="gt_heading">
    <td colspan="4" class="gt_heading gt_title gt_font_normal">Data listing from <strong>exibble</strong></td>
  </tr>
  <tr class="gt_heading">
    <td colspan="4" class="gt_heading gt_subtitle gt_font_normal gt_bottom_border"><code>exibble</code> is a <strong>Great Tables</strong> dataset.</td>
  </tr>
<tr class="gt_col_headings">
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="1" colspan="1" scope="col" id=""></th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="num">num</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="1" colspan="1" scope="col" id="char">char</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="currency">currency</th>
</tr>
</thead>
<tbody class="gt_table_body">
  <tr class="gt_group_heading_row">
    <th class="gt_group_heading" colspan="4">grp_a</th>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">row_1</th>
    <td class="gt_row gt_right">0.11</td>
    <td class="gt_row gt_left">apricot</td>
    <td class="gt_row gt_right">$49.95</td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">row_2</th>
    <td class="gt_row gt_right">2.22</td>
    <td class="gt_row gt_left">banana</td>
    <td class="gt_row gt_right">$17.95</td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">row_3</th>
    <td class="gt_row gt_right">33.33</td>
    <td class="gt_row gt_left">coconut</td>
    <td class="gt_row gt_right">$1.39</td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">row_4</th>
    <td class="gt_row gt_right">444.40</td>
    <td class="gt_row gt_left">durian</td>
    <td class="gt_row gt_right">$65,100.00</td>
  </tr>
  <tr class="gt_group_heading_row">
    <th class="gt_group_heading" colspan="4">grp_b</th>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">row_5</th>
    <td class="gt_row gt_right">5,550.00</td>
    <td class="gt_row gt_left"><na></na></td>
    <td class="gt_row gt_right">$1,325.81</td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">row_6</th>
    <td class="gt_row gt_right"><na></na></td>
    <td class="gt_row gt_left">fig</td>
    <td class="gt_row gt_right">$13.26</td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">row_7</th>
    <td class="gt_row gt_right">777,000.00</td>
    <td class="gt_row gt_left">grapefruit</td>
    <td class="gt_row gt_right"><na></na></td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">row_8</th>
    <td class="gt_row gt_right">8,880,000.00</td>
    <td class="gt_row gt_left">honeydew</td>
    <td class="gt_row gt_right">$0.44</td>
  </tr>
</tbody>
  <tfoot class="gt_sourcenotes">
  
  <tr>
    <td class="gt_sourcenote" colspan="4">This is only a subset of the dataset.</td>
  </tr>

</tfoot>

</table>

</div>
</div>
</div>
<p>We have the following methods available in the <code>opt_*()</code> family</p>
<ul>
<li><a href="../../reference/GT.opt_align_table_header.html#great_tables.GT.opt_align_table_header"><code>opt_align_table_header()</code></a></li>
<li><a href="../../reference/GT.opt_all_caps.html#great_tables.GT.opt_all_caps"><code>opt_all_caps()</code></a></li>
<li><a href="../../reference/GT.opt_vertical_padding.html#great_tables.GT.opt_vertical_padding"><code>opt_vertical_padding()</code></a></li>
<li><a href="../../reference/GT.opt_horizontal_padding.html#great_tables.GT.opt_horizontal_padding"><code>opt_horizontal_padding()</code></a></li>
</ul>
<p>and we plan to add more <code>opt_*()</code> methods in future releases.</p>
</section>
<section id="a-new-formatting-method-fmt_image" class="level3">
<h3 class="anchored" data-anchor-id="a-new-formatting-method-fmt_image">A new formatting method: <code>fmt_image()</code></h3>
<p>Wouldn’t it be great to add graphics to your table? The <a href="../../reference/GT.fmt_image.html#great_tables.GT.fmt_image"><code>fmt_image()</code></a> method provides an easy way to add image files on disk into table body cells. The cells need to contain some reference to an image file. The <code>path=</code> and <code>file_pattern=</code> arguments give you some flexibility in defining exactly where the image files live.</p>
<p>Here’s an example using the <code>metro</code> dataset that’s included within <strong>Great Tables</strong>.</p>
<div id="df849486" class="cell" data-execution_count="8">
<div class="code-copy-outer-scaffold"><div class="sourceCode cell-code" id="cb8" style="background: #f1f3f5;"><pre class="sourceCode python code-with-copy"><code class="sourceCode python"><span id="cb8-1"><span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">from</span> great_tables.data <span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">import</span> metro</span>
<span id="cb8-2"><span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">from</span> importlib_resources <span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">import</span> files</span>
<span id="cb8-3"></span>
<span id="cb8-4">img_paths <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> files(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"great_tables"</span>) <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">/</span> <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"data/metro_images"</span></span>
<span id="cb8-5">metro_mini <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> metro[[<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"name"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"lines"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"passengers"</span>]].head(<span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">5</span>)</span>
<span id="cb8-6"></span>
<span id="cb8-7">(</span>
<span id="cb8-8">    GT(metro_mini)</span>
<span id="cb8-9">    .fmt_image(columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"lines"</span>, path<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>img_paths, file_pattern<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"metro_</span><span class="sc" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">{}</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">.svg"</span>)</span>
<span id="cb8-10">    .fmt_integer(columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"passengers"</span>)</span>
<span id="cb8-11">    .cols_label(</span>
<span id="cb8-12">        name<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Station"</span>,</span>
<span id="cb8-13">        lines<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Metro Lines"</span>,</span>
<span id="cb8-14">        passengers<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Passengers per Year (2021)"</span></span>
<span id="cb8-15">    )</span>
<span id="cb8-16">    .tab_options(table_width<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"700px"</span>)</span>
<span id="cb8-17">)</span></code></pre></div></div>
<div class="cell-output cell-output-display" data-execution_count="8">
<div id="nngzfglrqs" style="padding-left:0px;padding-right:0px;padding-top:10px;padding-bottom:10px;overflow-x:auto;overflow-y:auto;width:auto;height:auto;">
<style>
#nngzfglrqs table {
          font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Helvetica Neue', 'Fira Sans', 'Droid Sans', Arial, sans-serif;
          -webkit-font-smoothing: antialiased;
          -moz-osx-font-smoothing: grayscale;
        }

#nngzfglrqs thead, tbody, tfoot, tr, td, th { border-style: none; }
 tr { background-color: transparent; }
#nngzfglrqs p { margin: 0; padding: 0; }
 #nngzfglrqs .gt_table { display: table; border-collapse: collapse; line-height: normal; margin-left: auto; margin-right: auto; color: #333333; font-size: 16px; font-weight: normal; font-style: normal; background-color: #FFFFFF; width: 700px; border-top-style: solid; border-top-width: 2px; border-top-color: #A8A8A8; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #A8A8A8; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; }
 #nngzfglrqs .gt_caption { padding-top: 4px; padding-bottom: 4px; }
 #nngzfglrqs .gt_title { color: #333333; font-size: 125%; font-weight: initial; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; border-bottom-color: #FFFFFF; border-bottom-width: 0; }
 #nngzfglrqs .gt_subtitle { color: #333333; font-size: 85%; font-weight: initial; padding-top: 3px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; border-top-color: #FFFFFF; border-top-width: 0; }
 #nngzfglrqs .gt_heading { background-color: #FFFFFF; text-align: center; border-bottom-color: #FFFFFF; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #nngzfglrqs .gt_bottom_border { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #nngzfglrqs .gt_col_headings { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #nngzfglrqs .gt_col_heading { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; overflow-x: hidden; }
 #nngzfglrqs .gt_column_spanner_outer { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; padding-top: 0; padding-bottom: 0; padding-left: 4px; padding-right: 4px; }
 #nngzfglrqs .gt_column_spanner_outer:first-child { padding-left: 0; }
 #nngzfglrqs .gt_column_spanner_outer:last-child { padding-right: 0; }
 #nngzfglrqs .gt_column_spanner { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; overflow-x: hidden; display: inline-block; width: 100%; }
 #nngzfglrqs .gt_spanner_row { border-bottom-style: hidden; }
 #nngzfglrqs .gt_group_heading { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; text-align: left; }
 #nngzfglrqs .gt_empty_group_heading { padding: 0.5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: middle; }
 #nngzfglrqs .gt_from_md> :first-child { margin-top: 0; }
 #nngzfglrqs .gt_from_md> :last-child { margin-bottom: 0; }
 #nngzfglrqs .gt_row { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; margin: 10px; border-top-style: solid; border-top-width: 1px; border-top-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; overflow-x: hidden; }
 #nngzfglrqs .gt_stub { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; }
 #nngzfglrqs .gt_stub_row_group { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; vertical-align: top; }
 #nngzfglrqs .gt_row_group_first td { border-top-width: 2px; }
 #nngzfglrqs .gt_row_group_first th { border-top-width: 2px; }
 #nngzfglrqs .gt_striped { color: #333333; background-color: #F4F4F4; }
 #nngzfglrqs .gt_table_body { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #nngzfglrqs .gt_grand_summary_row { color: #333333; background-color: #FFFFFF; text-transform: inherit; padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; }
 #nngzfglrqs .gt_first_grand_summary_row_bottom { border-top-style: double; border-top-width: 6px; border-top-color: #D3D3D3; }
 #nngzfglrqs .gt_last_grand_summary_row_top { border-bottom-style: double; border-bottom-width: 6px; border-bottom-color: #D3D3D3; }
 #nngzfglrqs .gt_sourcenotes { color: #333333; background-color: #FFFFFF; border-bottom-style: none; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; }
 #nngzfglrqs .gt_sourcenote { font-size: 90%; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; text-align: left; }
 #nngzfglrqs .gt_left { text-align: left; }
 #nngzfglrqs .gt_center { text-align: center; }
 #nngzfglrqs .gt_right { text-align: right; font-variant-numeric: tabular-nums; }
 #nngzfglrqs .gt_font_normal { font-weight: normal; }
 #nngzfglrqs .gt_font_bold { font-weight: bold; }
 #nngzfglrqs .gt_font_italic { font-style: italic; }
 #nngzfglrqs .gt_super { font-size: 65%; }
 #nngzfglrqs .gt_footnote_marks { font-size: 75%; vertical-align: 0.4em; position: initial; }
 #nngzfglrqs .gt_asterisk { font-size: 100%; vertical-align: 0; }
 
</style>
<table class="gt_table" data-quarto-disable-processing="false" data-quarto-bootstrap="false">
<thead>

<tr class="gt_col_headings">
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="1" colspan="1" scope="col" id="name">Station</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="lines">Metro Lines</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="passengers">Passengers per Year (2021)</th>
</tr>
</thead>
<tbody class="gt_table_body">
  <tr>
    <td class="gt_row gt_left">Argentine</td>
    <td class="gt_row gt_right"><span style="white-space:nowrap;"><img src="https://posit-dev.github.io/great-tables/blog/introduction-0.3.0/data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHJvbGU9ImltZyIgdmlld0JveD0iMCAwIDEwNTAgMTA1MCIgc3R5bGU9ImhlaWdodDoxZW07d2lkdGg6MS4xM2VtO3ZlcnRpY2FsLWFsaWduOi0wLjEyNWVtO21hcmdpbi1sZWZ0OmF1dG87bWFyZ2luLXJpZ2h0OmF1dG87Zm9udC1zaXplOmluaGVyaXQ7b3ZlcmZsb3c6dmlzaWJsZTtwb3NpdGlvbjpyZWxhdGl2ZTsiPjxjaXJjbGUgZmlsbD0iI0ZFQ0UwMCIgY3g9IjUwMCIgY3k9IjUwMCIgcj0iNTAwIi8+PHBhdGggZmlsbD0iIzIyMUUyMCIgZD0iTTU3Ny4wMjYgNzYzLjk4N1YyMzQuMDIyaC05Mi4zNTJjLTIzLjkzOCAxOC43MTQtODEuMDE3IDU0LjAyNi0xNDIuNTY1IDgzLjI2NWwtMzIuMjg3IDE1LjE0NyAzNi4wMTQgODEuMDQyIDI3Ljk0Ni0xNC4zOGMxOS4zNzgtOS42MTEgNzIuNjE3LTM3LjM1NyA5MC42OC01MS43djQxNi41OTFoMTEyLjU2NCIvPjwvc3ZnPg==" style="height: 2em;vertical-align: middle;"></span></td>
    <td class="gt_row gt_right">2,079,212</td>
  </tr>
  <tr>
    <td class="gt_row gt_left">Bastille</td>
    <td class="gt_row gt_right"><span style="white-space:nowrap;"><img src="https://posit-dev.github.io/great-tables/blog/introduction-0.3.0/data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHJvbGU9ImltZyIgdmlld0JveD0iMCAwIDEwNTAgMTA1MCIgc3R5bGU9ImhlaWdodDoxZW07d2lkdGg6MS4xM2VtO3ZlcnRpY2FsLWFsaWduOi0wLjEyNWVtO21hcmdpbi1sZWZ0OmF1dG87bWFyZ2luLXJpZ2h0OmF1dG87Zm9udC1zaXplOmluaGVyaXQ7b3ZlcmZsb3c6dmlzaWJsZTtwb3NpdGlvbjpyZWxhdGl2ZTsiPjxjaXJjbGUgZmlsbD0iI0ZFQ0UwMCIgY3g9IjUwMCIgY3k9IjUwMCIgcj0iNTAwIi8+PHBhdGggZmlsbD0iIzIyMUUyMCIgZD0iTTU3Ny4wMjYgNzYzLjk4N1YyMzQuMDIyaC05Mi4zNTJjLTIzLjkzOCAxOC43MTQtODEuMDE3IDU0LjAyNi0xNDIuNTY1IDgzLjI2NWwtMzIuMjg3IDE1LjE0NyAzNi4wMTQgODEuMDQyIDI3Ljk0Ni0xNC4zOGMxOS4zNzgtOS42MTEgNzIuNjE3LTM3LjM1NyA5MC42OC01MS43djQxNi41OTFoMTEyLjU2NCIvPjwvc3ZnPg==" style="height: 2em;vertical-align: middle;"> <img src="https://posit-dev.github.io/great-tables/blog/introduction-0.3.0/data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHJvbGU9ImltZyIgdmlld0JveD0iMCAwIDEwNTAgMTA1MCIgc3R5bGU9ImhlaWdodDoxZW07d2lkdGg6MS4xM2VtO3ZlcnRpY2FsLWFsaWduOi0wLjEyNWVtO21hcmdpbi1sZWZ0OmF1dG87bWFyZ2luLXJpZ2h0OmF1dG87Zm9udC1zaXplOmluaGVyaXQ7b3ZlcmZsb3c6dmlzaWJsZTtwb3NpdGlvbjpyZWxhdGl2ZTsiPjxjaXJjbGUgZmlsbD0iI0YxOTA0MyIgY3g9IjUwMCIgY3k9IjUwMCIgcj0iNTAwIi8+PHBhdGggZmlsbD0iIzIzMUYyMCIgZD0iTTY3OS43MSA1OTIuNzVjMC03OS40ODYtNTguNDItMTU5LjY4LTIwMy4yNy0xNjcuMjVsLTE1LjEzMy0uNzEyIDcuNDE4LTEwMS4zNTFoMTkwLjc4di04Ny45MTNoLTI3OC41MmwtMjEuMDM2IDI3NS40OSA4Mi41NDIuNzEyYzk3LjYxMy45NzkgMTIyLjk3OSA1My4zMTcgMTIyLjk3OSA5MS42NSAwIDYyLjE2LTUxLjYyNyA4NS42MjktOTIuODY2IDg1LjYyOS00NS4xODggMC03NS4wMzctMTYuNjE1LTEwMC42MS0zMy45MTJsLTM4Ljg5NyA4Mi42OWM0MS4wOTMgMjMuMTcyIDg5LjI3NyAzOC4zMzMgMTQ1LjUgMzguMzMzIDEyMC43NzEtLjA0IDIwMS4xMi04Mi4wOCAyMDEuMTItMTgzLjM3Ii8+PC9zdmc+" style="height: 2em;vertical-align: middle;"> <img src="https://posit-dev.github.io/great-tables/blog/introduction-0.3.0/data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHJvbGU9ImltZyIgdmlld0JveD0iMCAwIDEwNTAgMTA1MCIgc3R5bGU9ImhlaWdodDoxZW07d2lkdGg6MS4xM2VtO3ZlcnRpY2FsLWFsaWduOi0wLjEyNWVtO21hcmdpbi1sZWZ0OmF1dG87bWFyZ2luLXJpZ2h0OmF1dG87Zm9udC1zaXplOmluaGVyaXQ7b3ZlcmZsb3c6dmlzaWJsZTtwb3NpdGlvbjpyZWxhdGl2ZTsiPjxjaXJjbGUgZmlsbD0iI0NEQUNDRiIgY3g9IjUwMCIgY3k9IjUwMCIgcj0iNTAwIi8+PHBhdGggZmlsbD0iIzIzMUYyMCIgZD0iTTY4OS4yMSA2MTQuOTJjMC02OS42MTctNDIuNzQyLTExMS44MS05MS41NzMtMTM0Ljg1IDQ5LjU2OC0zMC4xNzUgNzUuMjA2LTY4LjQ1NCA3NS4yMDYtMTE3LjkgMC05MC45ODYtNzcuMzc4LTEzNi44My0xNzAuNDYtMTM2LjgzLTkwLjg3NyAwLTE3MC40MSA2MC45My0xNzAuNDEgMTQ4LjY2IDAgNTQuODAxIDI4LjU0NSA4Ny4wMzEgNzQuMjM1IDExNS41NC01MS4wMjMgMjYuMjk2LTkwLjc3OSA2Ny43MTYtOTAuNzc5IDEzOC4xNSAwIDgwLjM5NyA2Ni42OTMgMTUwLjkwOSAxODQuNTggMTUwLjkwOSAxMDguODYtLjAyIDE4OS4xOS02Mi45NiAxODkuMTktMTYzLjY4TTU3MS40MDkgMzY4LjgzYzAgMzMuMTItMzAuMDIxIDYzLjY4Mi01Ny44MTIgNzYuNTU5LTMzLjcwNS0xNC4yNzItNzcuMzAyLTM3LjYyLTc3LjMwMi04MS4wNTkgMC0zNi42ODkgMjYuMjIxLTYyLjI4NiA2Ny41MjctNjIuMjg2IDQzLjUyOS4wMSA2Ny41OCAyOS45MSA2Ny41OCA2Ni43OWwuMDA3LS4wMDR6bTguMjIgMjU0LjQyYzAgNDIuMDQyLTI3Ljc3IDc3LjM3My03OC4wOTUgNzcuMzczLTUxLjEwMyAwLTc5LjU1LTQxLjQ1OS03OS41NS04NC44OTYgMC00MS4xODggMzQuNTM5LTc1LjcwNSA2OS4wNTgtODkuMzE4IDQ0Ljk5IDIyLjU0IDg4LjU5IDQ4LjggODguNTkgOTYuODVsLS4wMDMtLjAwOXoiLz48L3N2Zz4=" style="height: 2em;vertical-align: middle;"></span></td>
    <td class="gt_row gt_right">8,069,243</td>
  </tr>
  <tr>
    <td class="gt_row gt_left">Bérault</td>
    <td class="gt_row gt_right"><span style="white-space:nowrap;"><img src="https://posit-dev.github.io/great-tables/blog/introduction-0.3.0/data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHJvbGU9ImltZyIgdmlld0JveD0iMCAwIDEwNTAgMTA1MCIgc3R5bGU9ImhlaWdodDoxZW07d2lkdGg6MS4xM2VtO3ZlcnRpY2FsLWFsaWduOi0wLjEyNWVtO21hcmdpbi1sZWZ0OmF1dG87bWFyZ2luLXJpZ2h0OmF1dG87Zm9udC1zaXplOmluaGVyaXQ7b3ZlcmZsb3c6dmlzaWJsZTtwb3NpdGlvbjpyZWxhdGl2ZTsiPjxjaXJjbGUgZmlsbD0iI0ZFQ0UwMCIgY3g9IjUwMCIgY3k9IjUwMCIgcj0iNTAwIi8+PHBhdGggZmlsbD0iIzIyMUUyMCIgZD0iTTU3Ny4wMjYgNzYzLjk4N1YyMzQuMDIyaC05Mi4zNTJjLTIzLjkzOCAxOC43MTQtODEuMDE3IDU0LjAyNi0xNDIuNTY1IDgzLjI2NWwtMzIuMjg3IDE1LjE0NyAzNi4wMTQgODEuMDQyIDI3Ljk0Ni0xNC4zOGMxOS4zNzgtOS42MTEgNzIuNjE3LTM3LjM1NyA5MC42OC01MS43djQxNi41OTFoMTEyLjU2NCIvPjwvc3ZnPg==" style="height: 2em;vertical-align: middle;"></span></td>
    <td class="gt_row gt_right">2,106,827</td>
  </tr>
  <tr>
    <td class="gt_row gt_left">Champs-Élysées—Clemenceau</td>
    <td class="gt_row gt_right"><span style="white-space:nowrap;"><img src="https://posit-dev.github.io/great-tables/blog/introduction-0.3.0/data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHJvbGU9ImltZyIgdmlld0JveD0iMCAwIDEwNTAgMTA1MCIgc3R5bGU9ImhlaWdodDoxZW07d2lkdGg6MS4xM2VtO3ZlcnRpY2FsLWFsaWduOi0wLjEyNWVtO21hcmdpbi1sZWZ0OmF1dG87bWFyZ2luLXJpZ2h0OmF1dG87Zm9udC1zaXplOmluaGVyaXQ7b3ZlcmZsb3c6dmlzaWJsZTtwb3NpdGlvbjpyZWxhdGl2ZTsiPjxjaXJjbGUgZmlsbD0iI0ZFQ0UwMCIgY3g9IjUwMCIgY3k9IjUwMCIgcj0iNTAwIi8+PHBhdGggZmlsbD0iIzIyMUUyMCIgZD0iTTU3Ny4wMjYgNzYzLjk4N1YyMzQuMDIyaC05Mi4zNTJjLTIzLjkzOCAxOC43MTQtODEuMDE3IDU0LjAyNi0xNDIuNTY1IDgzLjI2NWwtMzIuMjg3IDE1LjE0NyAzNi4wMTQgODEuMDQyIDI3Ljk0Ni0xNC4zOGMxOS4zNzgtOS42MTEgNzIuNjE3LTM3LjM1NyA5MC42OC01MS43djQxNi41OTFoMTEyLjU2NCIvPjwvc3ZnPg==" style="height: 2em;vertical-align: middle;"> <img src="https://posit-dev.github.io/great-tables/blog/introduction-0.3.0/data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHJvbGU9ImltZyIgdmlld0JveD0iMCAwIDEwNTAgMTA1MCIgc3R5bGU9ImhlaWdodDoxZW07d2lkdGg6MS4xM2VtO3ZlcnRpY2FsLWFsaWduOi0wLjEyNWVtO21hcmdpbi1sZWZ0OmF1dG87bWFyZ2luLXJpZ2h0OmF1dG87Zm9udC1zaXplOmluaGVyaXQ7b3ZlcmZsb3c6dmlzaWJsZTtwb3NpdGlvbjpyZWxhdGl2ZTsiPjxjaXJjbGUgZmlsbD0iIzk5RDRERSIgY3g9IjUwMCIgY3k9IjUwMCIgcj0iNTAwIi8+PHBhdGggZmlsbD0iIzIzMUYyMCIgZD0iTTM4Ny41IDc2NC4xMVYyMzQuMDNoLTkyLjM2MWMtMjQuMDkyIDE4LjY5NS04MS4xODkgNTMuODcxLTE0Mi43MyA4My4xMDVsLTMyLjI5MiAxNC45NzQgMzYuMDk2IDgxLjYgMjcuNzc2LTE0LjI2YzE5LjQ1Ni05Ljc0NSA3Mi44MjgtMzcuNDM1IDkwLjc3Ny01MS42MTN2NDE2LjI4aDExMi43Mk04MjEuMjIgNjA2LjkzYzAtNzQuMTUxLTQ0LjI5Ny0xMTcuNTY5LTEwMi44NTktMTI4Ljg1OXYtMS40NjVjNTYuMjY2LTIwLjk5NCA4NS40MjgtNjIuODYzIDg1LjQyOC0xMTcuNTcgMC03MS4xNDMtNjEuNDk1LTEzNC4wNC0xNjkuNTEtMTM0LjA0LTYyLjQ0NyAwLTExMy4zOCAxNy4yNy0xNTkuMTUgNDcuMjE3bDM2LjcxMSA3Ny44NzdjMTcuMjM2LTE0LjIyMSA0OS40NS0zOC4xODYgOTguMzQ2LTM4LjE4NiA1NS41OTMgMCA4MS4wMjkgMjkuOTg1IDgxLjAyOSA2My42OTQgMCA0MC4zMjQtMzIuMjEzIDY1Ljg3NS04NC4xMjEgNjUuODc1SDU1MS41OHY4Ny41OGg1NC44MDFjNTQuMjAzIDAgMTAwLjY0IDE5LjQ0OSAxMDAuNjQgODAuMDk3IDAgNDQuOTItMzguMTk3IDc4LjY3LTk5LjkzMiA3OC42Ny00NC43NzQgMC04MS42MDQtMTcuMjcxLTEwNC4xNy0zNC40NjRsLTQwLjU5NiA4MS42MDFjNDIuNzk0IDIzLjkyNiA4NC4wNjIgMzkuNjEzIDE1Mi4zNyAzOS42MTMgMTIzLjE0OS0uMDExIDIwNi41Mi03NC44ODEgMjA2LjUyLTE2Ny42NWwuMDA3LjAxeiIvPjwvc3ZnPg==" style="height: 2em;vertical-align: middle;"></span></td>
    <td class="gt_row gt_right">1,909,005</td>
  </tr>
  <tr>
    <td class="gt_row gt_left">Charles de Gaulle—Étoile</td>
    <td class="gt_row gt_right"><span style="white-space:nowrap;"><img src="https://posit-dev.github.io/great-tables/blog/introduction-0.3.0/data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHJvbGU9ImltZyIgdmlld0JveD0iMCAwIDEwNTAgMTA1MCIgc3R5bGU9ImhlaWdodDoxZW07d2lkdGg6MS4xM2VtO3ZlcnRpY2FsLWFsaWduOi0wLjEyNWVtO21hcmdpbi1sZWZ0OmF1dG87bWFyZ2luLXJpZ2h0OmF1dG87Zm9udC1zaXplOmluaGVyaXQ7b3ZlcmZsb3c6dmlzaWJsZTtwb3NpdGlvbjpyZWxhdGl2ZTsiPjxjaXJjbGUgZmlsbD0iI0ZFQ0UwMCIgY3g9IjUwMCIgY3k9IjUwMCIgcj0iNTAwIi8+PHBhdGggZmlsbD0iIzIyMUUyMCIgZD0iTTU3Ny4wMjYgNzYzLjk4N1YyMzQuMDIyaC05Mi4zNTJjLTIzLjkzOCAxOC43MTQtODEuMDE3IDU0LjAyNi0xNDIuNTY1IDgzLjI2NWwtMzIuMjg3IDE1LjE0NyAzNi4wMTQgODEuMDQyIDI3Ljk0Ni0xNC4zOGMxOS4zNzgtOS42MTEgNzIuNjE3LTM3LjM1NyA5MC42OC01MS43djQxNi41OTFoMTEyLjU2NCIvPjwvc3ZnPg==" style="height: 2em;vertical-align: middle;"> <img src="https://posit-dev.github.io/great-tables/blog/introduction-0.3.0/data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHJvbGU9ImltZyIgdmlld0JveD0iMCAwIDEwNTAgMTA1MCIgc3R5bGU9ImhlaWdodDoxZW07d2lkdGg6MS4xM2VtO3ZlcnRpY2FsLWFsaWduOi0wLjEyNWVtO21hcmdpbi1sZWZ0OmF1dG87bWFyZ2luLXJpZ2h0OmF1dG87Zm9udC1zaXplOmluaGVyaXQ7b3ZlcmZsb3c6dmlzaWJsZTtwb3NpdGlvbjpyZWxhdGl2ZTsiPjxjaXJjbGUgZmlsbD0iIzAwNjVBRSIgY3g9IjUwMCIgY3k9IjUwMCIgcj0iNTAwIi8+PHBhdGggZmlsbD0iI2ZmZiIgZD0iTTY3Ni40NCA3NDAuOTV2LTg4LjcwOUg0NTcuNzZjNi44ODgtMzAuNzEzIDYwLjEzMy03NS4wMzUgODcuMDg0LTk5Ljc1IDYzLjg1NS01Ny45OTcgMTIxLjYyLTk5LjE4OCAxMjEuNjItMTkwLjAxIDAtMTA4LjA1LTg3LjY3OC0xNjAuNjEtMTgwLjc2LTE2MC42MS03MS4zNjYgMC0xMTguNjIgMjAuOTkxLTE2OS43MiA2NS4zNzlsNTUuNzE3IDczLjU4NWMxMi42NTItMTQuMzM1IDQ0Ljk3NS00OC4xMTIgOTEuNDM0LTQ4LjExMiA1Ny43NiAwIDg3Ljc0MiAzNi43NzYgODcuNzQyIDgyLjQ4MiAwIDUxLjIwOS0zOC4wMjMgODcuODU0LTczLjM0NCAxMTguNjMtNzAuNzA5IDYxLjU5LTEzMS40NyAxMTUuNTctMTQ0Ljk0IDE3Ny4yOXY2OS44NjFoMzQzLjg1MSIvPjwvc3ZnPg==" style="height: 2em;vertical-align: middle;"> <img src="https://posit-dev.github.io/great-tables/blog/introduction-0.3.0/data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHJvbGU9ImltZyIgdmlld0JveD0iMCAwIDEwNTAgMTA1MCIgc3R5bGU9ImhlaWdodDoxZW07d2lkdGg6MS4xM2VtO3ZlcnRpY2FsLWFsaWduOi0wLjEyNWVtO21hcmdpbi1sZWZ0OmF1dG87bWFyZ2luLXJpZ2h0OmF1dG87Zm9udC1zaXplOmluaGVyaXQ7b3ZlcmZsb3c6dmlzaWJsZTtwb3NpdGlvbjpyZWxhdGl2ZTsiPjxjaXJjbGUgZmlsbD0iIzg0QzI4RSIgY3g9IjUwMCIgY3k9IjUwMCIgcj0iNTAwIi8+PHBhdGggZmlsbD0iIzIzMUYyMCIgZD0iTTY3Mi4xNiA1NzAuNTZjMC05OS4zMDUtNzAuNTE5LTE1Ny4wMS0xNTcuMTEtMTU3LjAxLTU1Ljk0NyAwLTg5Ljg4NyAyMC4yODctMTA3Ljc5IDM2LjA2OCA2LjY5OS0xMDYuNTIxIDYxLjQzOC0xNTkuODcgMTM0LjQxLTE1OS44NyAyOS43NjggMCA1Ni45NzMgNi43MDEgNzEuMDMxIDEyLjg5MWwxNi42Ni05MC4xMTVjLTIxLjcxMy01LjQxNy00OC45MTYtOC45MzQtNzguODMtOC45MzQtMTY2LjU5IDAtMjUxLjM2IDEyNS44OTEtMjUxLjM2IDMwOS44OTEgMCAxNDAuMzUgNTAuODk1IDI0MC4zMSAxOTMuNTggMjQwLjMxIDEwOC44OS0uMDAxIDE3OS40MS03Ny41NjEgMTc5LjQwOS0xODMuMjMxbS0xMDUuODA5IDExLjI4YzAgNDUuNjI1LTI2LjI1NCA4OC40My03Ny40MDEgODguNDMtNTIuNTc4IDAtODAuOTUzLTQ4Ljc3Mi04MC45NTMtOTkuMTIgMC0xNS42MzggMC0zNS45NTkgNi4wMDQtNDQuOTY4IDEwLjQ3MS0xNi41ODYgMzYuNzk3LTI5LjE4NCA2OS4wNTUtMjkuMTg0IDUwLjkyIDAgODMuMjkgMzUuMTkgODMuMjkgODQuODRsLjAwNS4wMDJ6Ii8+PC9zdmc+" style="height: 2em;vertical-align: middle;"></span></td>
    <td class="gt_row gt_right">4,291,663</td>
  </tr>
</tbody>


</table>

</div>
</div>
</div>
<p>Notice that <code>path=img_paths</code> specified the folder the images live in, and <code>file_pattern="metro_{}.svg"</code> provided a template for converting each value in the <code>lines</code> column to an SVG file name.</p>
<p>The <a href="../../reference/GT.fmt_image.html#great_tables.GT.fmt_image"><code>fmt_image()</code></a> method supports three kinds of files as inputs, either: (1) complete http/https or local paths to the files; (2) the file names, where a common path can be provided via the <code>path=</code> arg; or (3) a fragment of the file name, as shown in the example above.</p>
<p>The package has some graphics stored in the <code>data/metro_images</code> directory. They are SVGs and they look <em>very</em> nice in the example table!</p>
<p>See the <a href="../../reference/GT.fmt_image.html#great_tables.GT.fmt_image"><code>fmt_image()</code></a> reference page for more information on this new method.</p>
</section>
<section id="wrapping-up" class="level3">
<h3 class="anchored" data-anchor-id="wrapping-up">Wrapping up</h3>
<p>This <code>v0.3.0</code> release has some great new methods that add value to most any table-making endeavor. We also fixed a few bugs along the way so that you’ll have a overall smoother experience when building beautiful tables. As ever, we’ll work toward more and more improvements to give you more creative possibilities!</p>


</section>

 ]]></description>
  <guid>https://posit-dev.github.io/great-tables/blog/introduction-0.3.0/</guid>
  <pubDate>Fri, 16 Feb 2024 00:00:00 GMT</pubDate>
</item>
<item>
  <title>Using Polars to Win at Super Bowl Squares</title>
  <dc:creator>Michael Chow</dc:creator>
  <link>https://posit-dev.github.io/great-tables/blog/superbowl-squares/</link>
  <description><![CDATA[ 




<p>The Super Bowl is upon us, and with it the glittering squares of chance. Maybe you’ve seen Super Bowl Squares at your work. Maybe you’ve played it with your pals. Or maybe you have no idea what it is.</p>
<p>Whether you’re a Squares-head or not, this post will help you win with data.</p>
<section id="what-is-super-bowl-squares" class="level2">
<h2 class="anchored" data-anchor-id="what-is-super-bowl-squares">What is Super Bowl Squares?</h2>
<p>Super Bowl Squares is a betting game, where you bet on the final digits of each team in a game.</p>
<p>For example, here are some scores with the final digit bolded:</p>
<ul>
<li>Home team score: 1<strong>4</strong></li>
<li>Away team score: <strong>7</strong></li>
</ul>
<p>So the final digits would be:</p>
<ul>
<li>Home team digit: 4</li>
<li>Away team digit: 7</li>
</ul>
<p>Let’s say you choose the digits above, and write this as 4/7—meaning a final digit of 4 for home and 7 for away. You would mark yourself on this square:</p>
<div id="4ee5d6ba" class="cell" data-execution_count="2">
<details class="code-fold">
<summary>Code</summary>
<div class="code-copy-outer-scaffold"><div class="sourceCode cell-code" id="cb1" style="background: #f1f3f5;"><pre class="sourceCode python code-with-copy"><code class="sourceCode python"><span id="cb1-1">df <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> (</span>
<span id="cb1-2">    pl.DataFrame({<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"x"</span>: <span class="bu" style="color: null;
background-color: null;
font-style: inherit;">list</span>(<span class="bu" style="color: null;
background-color: null;
font-style: inherit;">range</span>(<span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">10</span>))})</span>
<span id="cb1-3">    .join(pl.DataFrame({<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"y"</span>: <span class="bu" style="color: null;
background-color: null;
font-style: inherit;">list</span>(<span class="bu" style="color: null;
background-color: null;
font-style: inherit;">range</span>(<span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">10</span>)), <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"z"</span>: <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"_._"</span>}), how<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"cross"</span>)</span>
<span id="cb1-4">    .with_columns(</span>
<span id="cb1-5">        z<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>pl.when((pl.col(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"x"</span>) <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">==</span> <span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">7</span>) <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">&amp;</span> (pl.col(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"y"</span>) <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">==</span> <span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">4</span>)).then(pl.lit(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"4/7"</span>)).otherwise(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"z"</span>)</span>
<span id="cb1-6">    )</span>
<span id="cb1-7">    .pivot(index<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"x"</span>, values<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"z"</span>, on<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"y"</span>)</span>
<span id="cb1-8">    .with_row_index()</span>
<span id="cb1-9">)</span>
<span id="cb1-10"></span>
<span id="cb1-11">(</span>
<span id="cb1-12">    GT(df, rowname_col<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"x"</span>)</span>
<span id="cb1-13">    .tab_header(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Example Superbowl Square"</span>)</span>
<span id="cb1-14">    .tab_spanner(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Home"</span>, cs.<span class="bu" style="color: null;
background-color: null;
font-style: inherit;">all</span>())</span>
<span id="cb1-15">    .tab_style(style.fill(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"green"</span>), loc.body(columns<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"4"</span>, rows<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>pl.col(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"index"</span>) <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">==</span> <span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">7</span>))</span>
<span id="cb1-16">    .tab_style(style.text(color<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"#FFFFFF"</span>, weight<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"bold"</span>), loc.body())</span>
<span id="cb1-17">    .cols_hide(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"index"</span>)</span>
<span id="cb1-18">    .tab_stubhead(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Away"</span>)</span>
<span id="cb1-19">)</span></code></pre></div></div>
</details>
<div class="cell-output cell-output-display" data-execution_count="2">
<div id="nxtgthqufk" style="padding-left:0px;padding-right:0px;padding-top:10px;padding-bottom:10px;overflow-x:auto;overflow-y:auto;width:auto;height:auto;">
<style>
#nxtgthqufk table {
          font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Helvetica Neue', 'Fira Sans', 'Droid Sans', Arial, sans-serif;
          -webkit-font-smoothing: antialiased;
          -moz-osx-font-smoothing: grayscale;
        }

#nxtgthqufk thead, tbody, tfoot, tr, td, th { border-style: none; }
 tr { background-color: transparent; }
#nxtgthqufk p { margin: 0; padding: 0; }
 #nxtgthqufk .gt_table { display: table; border-collapse: collapse; line-height: normal; margin-left: auto; margin-right: auto; color: #333333; font-size: 16px; font-weight: normal; font-style: normal; background-color: #FFFFFF; width: auto; border-top-style: solid; border-top-width: 2px; border-top-color: #A8A8A8; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #A8A8A8; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; }
 #nxtgthqufk .gt_caption { padding-top: 4px; padding-bottom: 4px; }
 #nxtgthqufk .gt_title { color: #333333; font-size: 125%; font-weight: initial; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; border-bottom-color: #FFFFFF; border-bottom-width: 0; }
 #nxtgthqufk .gt_subtitle { color: #333333; font-size: 85%; font-weight: initial; padding-top: 3px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; border-top-color: #FFFFFF; border-top-width: 0; }
 #nxtgthqufk .gt_heading { background-color: #FFFFFF; text-align: center; border-bottom-color: #FFFFFF; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #nxtgthqufk .gt_bottom_border { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #nxtgthqufk .gt_col_headings { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #nxtgthqufk .gt_col_heading { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; overflow-x: hidden; }
 #nxtgthqufk .gt_column_spanner_outer { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; padding-top: 0; padding-bottom: 0; padding-left: 4px; padding-right: 4px; }
 #nxtgthqufk .gt_column_spanner_outer:first-child { padding-left: 0; }
 #nxtgthqufk .gt_column_spanner_outer:last-child { padding-right: 0; }
 #nxtgthqufk .gt_column_spanner { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; overflow-x: hidden; display: inline-block; width: 100%; }
 #nxtgthqufk .gt_spanner_row { border-bottom-style: hidden; }
 #nxtgthqufk .gt_group_heading { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; text-align: left; }
 #nxtgthqufk .gt_empty_group_heading { padding: 0.5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: middle; }
 #nxtgthqufk .gt_from_md> :first-child { margin-top: 0; }
 #nxtgthqufk .gt_from_md> :last-child { margin-bottom: 0; }
 #nxtgthqufk .gt_row { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; margin: 10px; border-top-style: solid; border-top-width: 1px; border-top-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; overflow-x: hidden; }
 #nxtgthqufk .gt_stub { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; }
 #nxtgthqufk .gt_stub_row_group { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; vertical-align: top; }
 #nxtgthqufk .gt_row_group_first td { border-top-width: 2px; }
 #nxtgthqufk .gt_row_group_first th { border-top-width: 2px; }
 #nxtgthqufk .gt_striped { color: #333333; background-color: #F4F4F4; }
 #nxtgthqufk .gt_table_body { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #nxtgthqufk .gt_grand_summary_row { color: #333333; background-color: #FFFFFF; text-transform: inherit; padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; }
 #nxtgthqufk .gt_first_grand_summary_row_bottom { border-top-style: double; border-top-width: 6px; border-top-color: #D3D3D3; }
 #nxtgthqufk .gt_last_grand_summary_row_top { border-bottom-style: double; border-bottom-width: 6px; border-bottom-color: #D3D3D3; }
 #nxtgthqufk .gt_sourcenotes { color: #333333; background-color: #FFFFFF; border-bottom-style: none; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; }
 #nxtgthqufk .gt_sourcenote { font-size: 90%; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; text-align: left; }
 #nxtgthqufk .gt_left { text-align: left; }
 #nxtgthqufk .gt_center { text-align: center; }
 #nxtgthqufk .gt_right { text-align: right; font-variant-numeric: tabular-nums; }
 #nxtgthqufk .gt_font_normal { font-weight: normal; }
 #nxtgthqufk .gt_font_bold { font-weight: bold; }
 #nxtgthqufk .gt_font_italic { font-style: italic; }
 #nxtgthqufk .gt_super { font-size: 65%; }
 #nxtgthqufk .gt_footnote_marks { font-size: 75%; vertical-align: 0.4em; position: initial; }
 #nxtgthqufk .gt_asterisk { font-size: 100%; vertical-align: 0; }
 
</style>
<table class="gt_table" data-quarto-disable-processing="false" data-quarto-bootstrap="false">
<thead>

  <tr class="gt_heading">
    <td colspan="11" class="gt_heading gt_title gt_font_normal">Example Superbowl Square</td>
  </tr>
<tr class="gt_col_headings gt_spanner_row">
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="2" colspan="1" scope="col" id="Away">Away</th>
  <th class="gt_center gt_columns_top_border gt_column_spanner_outer" rowspan="1" colspan="10" scope="colgroup" id="Home">
    <span class="gt_column_spanner">Home</span>
  </th>
</tr>
<tr class="gt_col_headings">
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="1" colspan="1" scope="col" id="0">0</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="1" colspan="1" scope="col" id="1">1</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="1" colspan="1" scope="col" id="2">2</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="1" colspan="1" scope="col" id="3">3</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="1" colspan="1" scope="col" id="4">4</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="1" colspan="1" scope="col" id="5">5</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="1" colspan="1" scope="col" id="6">6</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="1" colspan="1" scope="col" id="7">7</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="1" colspan="1" scope="col" id="8">8</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="1" colspan="1" scope="col" id="9">9</th>
</tr>
</thead>
<tbody class="gt_table_body">
  <tr>
    <th class="gt_row gt_left gt_stub">0</th>
    <td style="color: #FFFFFF;font-weight: bold;" class="gt_row gt_left">_._</td>
    <td style="color: #FFFFFF;font-weight: bold;" class="gt_row gt_left">_._</td>
    <td style="color: #FFFFFF;font-weight: bold;" class="gt_row gt_left">_._</td>
    <td style="color: #FFFFFF;font-weight: bold;" class="gt_row gt_left">_._</td>
    <td style="color: #FFFFFF;font-weight: bold;" class="gt_row gt_left">_._</td>
    <td style="color: #FFFFFF;font-weight: bold;" class="gt_row gt_left">_._</td>
    <td style="color: #FFFFFF;font-weight: bold;" class="gt_row gt_left">_._</td>
    <td style="color: #FFFFFF;font-weight: bold;" class="gt_row gt_left">_._</td>
    <td style="color: #FFFFFF;font-weight: bold;" class="gt_row gt_left">_._</td>
    <td style="color: #FFFFFF;font-weight: bold;" class="gt_row gt_left">_._</td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">1</th>
    <td style="color: #FFFFFF;font-weight: bold;" class="gt_row gt_left">_._</td>
    <td style="color: #FFFFFF;font-weight: bold;" class="gt_row gt_left">_._</td>
    <td style="color: #FFFFFF;font-weight: bold;" class="gt_row gt_left">_._</td>
    <td style="color: #FFFFFF;font-weight: bold;" class="gt_row gt_left">_._</td>
    <td style="color: #FFFFFF;font-weight: bold;" class="gt_row gt_left">_._</td>
    <td style="color: #FFFFFF;font-weight: bold;" class="gt_row gt_left">_._</td>
    <td style="color: #FFFFFF;font-weight: bold;" class="gt_row gt_left">_._</td>
    <td style="color: #FFFFFF;font-weight: bold;" class="gt_row gt_left">_._</td>
    <td style="color: #FFFFFF;font-weight: bold;" class="gt_row gt_left">_._</td>
    <td style="color: #FFFFFF;font-weight: bold;" class="gt_row gt_left">_._</td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">2</th>
    <td style="color: #FFFFFF;font-weight: bold;" class="gt_row gt_left">_._</td>
    <td style="color: #FFFFFF;font-weight: bold;" class="gt_row gt_left">_._</td>
    <td style="color: #FFFFFF;font-weight: bold;" class="gt_row gt_left">_._</td>
    <td style="color: #FFFFFF;font-weight: bold;" class="gt_row gt_left">_._</td>
    <td style="color: #FFFFFF;font-weight: bold;" class="gt_row gt_left">_._</td>
    <td style="color: #FFFFFF;font-weight: bold;" class="gt_row gt_left">_._</td>
    <td style="color: #FFFFFF;font-weight: bold;" class="gt_row gt_left">_._</td>
    <td style="color: #FFFFFF;font-weight: bold;" class="gt_row gt_left">_._</td>
    <td style="color: #FFFFFF;font-weight: bold;" class="gt_row gt_left">_._</td>
    <td style="color: #FFFFFF;font-weight: bold;" class="gt_row gt_left">_._</td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">3</th>
    <td style="color: #FFFFFF;font-weight: bold;" class="gt_row gt_left">_._</td>
    <td style="color: #FFFFFF;font-weight: bold;" class="gt_row gt_left">_._</td>
    <td style="color: #FFFFFF;font-weight: bold;" class="gt_row gt_left">_._</td>
    <td style="color: #FFFFFF;font-weight: bold;" class="gt_row gt_left">_._</td>
    <td style="color: #FFFFFF;font-weight: bold;" class="gt_row gt_left">_._</td>
    <td style="color: #FFFFFF;font-weight: bold;" class="gt_row gt_left">_._</td>
    <td style="color: #FFFFFF;font-weight: bold;" class="gt_row gt_left">_._</td>
    <td style="color: #FFFFFF;font-weight: bold;" class="gt_row gt_left">_._</td>
    <td style="color: #FFFFFF;font-weight: bold;" class="gt_row gt_left">_._</td>
    <td style="color: #FFFFFF;font-weight: bold;" class="gt_row gt_left">_._</td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">4</th>
    <td style="color: #FFFFFF;font-weight: bold;" class="gt_row gt_left">_._</td>
    <td style="color: #FFFFFF;font-weight: bold;" class="gt_row gt_left">_._</td>
    <td style="color: #FFFFFF;font-weight: bold;" class="gt_row gt_left">_._</td>
    <td style="color: #FFFFFF;font-weight: bold;" class="gt_row gt_left">_._</td>
    <td style="color: #FFFFFF;font-weight: bold;" class="gt_row gt_left">_._</td>
    <td style="color: #FFFFFF;font-weight: bold;" class="gt_row gt_left">_._</td>
    <td style="color: #FFFFFF;font-weight: bold;" class="gt_row gt_left">_._</td>
    <td style="color: #FFFFFF;font-weight: bold;" class="gt_row gt_left">_._</td>
    <td style="color: #FFFFFF;font-weight: bold;" class="gt_row gt_left">_._</td>
    <td style="color: #FFFFFF;font-weight: bold;" class="gt_row gt_left">_._</td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">5</th>
    <td style="color: #FFFFFF;font-weight: bold;" class="gt_row gt_left">_._</td>
    <td style="color: #FFFFFF;font-weight: bold;" class="gt_row gt_left">_._</td>
    <td style="color: #FFFFFF;font-weight: bold;" class="gt_row gt_left">_._</td>
    <td style="color: #FFFFFF;font-weight: bold;" class="gt_row gt_left">_._</td>
    <td style="color: #FFFFFF;font-weight: bold;" class="gt_row gt_left">_._</td>
    <td style="color: #FFFFFF;font-weight: bold;" class="gt_row gt_left">_._</td>
    <td style="color: #FFFFFF;font-weight: bold;" class="gt_row gt_left">_._</td>
    <td style="color: #FFFFFF;font-weight: bold;" class="gt_row gt_left">_._</td>
    <td style="color: #FFFFFF;font-weight: bold;" class="gt_row gt_left">_._</td>
    <td style="color: #FFFFFF;font-weight: bold;" class="gt_row gt_left">_._</td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">6</th>
    <td style="color: #FFFFFF;font-weight: bold;" class="gt_row gt_left">_._</td>
    <td style="color: #FFFFFF;font-weight: bold;" class="gt_row gt_left">_._</td>
    <td style="color: #FFFFFF;font-weight: bold;" class="gt_row gt_left">_._</td>
    <td style="color: #FFFFFF;font-weight: bold;" class="gt_row gt_left">_._</td>
    <td style="color: #FFFFFF;font-weight: bold;" class="gt_row gt_left">_._</td>
    <td style="color: #FFFFFF;font-weight: bold;" class="gt_row gt_left">_._</td>
    <td style="color: #FFFFFF;font-weight: bold;" class="gt_row gt_left">_._</td>
    <td style="color: #FFFFFF;font-weight: bold;" class="gt_row gt_left">_._</td>
    <td style="color: #FFFFFF;font-weight: bold;" class="gt_row gt_left">_._</td>
    <td style="color: #FFFFFF;font-weight: bold;" class="gt_row gt_left">_._</td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">7</th>
    <td style="color: #FFFFFF;font-weight: bold;" class="gt_row gt_left">_._</td>
    <td style="color: #FFFFFF;font-weight: bold;" class="gt_row gt_left">_._</td>
    <td style="color: #FFFFFF;font-weight: bold;" class="gt_row gt_left">_._</td>
    <td style="color: #FFFFFF;font-weight: bold;" class="gt_row gt_left">_._</td>
    <td style="background-color: green; color: #FFFFFF;font-weight: bold;" class="gt_row gt_left">4/7</td>
    <td style="color: #FFFFFF;font-weight: bold;" class="gt_row gt_left">_._</td>
    <td style="color: #FFFFFF;font-weight: bold;" class="gt_row gt_left">_._</td>
    <td style="color: #FFFFFF;font-weight: bold;" class="gt_row gt_left">_._</td>
    <td style="color: #FFFFFF;font-weight: bold;" class="gt_row gt_left">_._</td>
    <td style="color: #FFFFFF;font-weight: bold;" class="gt_row gt_left">_._</td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">8</th>
    <td style="color: #FFFFFF;font-weight: bold;" class="gt_row gt_left">_._</td>
    <td style="color: #FFFFFF;font-weight: bold;" class="gt_row gt_left">_._</td>
    <td style="color: #FFFFFF;font-weight: bold;" class="gt_row gt_left">_._</td>
    <td style="color: #FFFFFF;font-weight: bold;" class="gt_row gt_left">_._</td>
    <td style="color: #FFFFFF;font-weight: bold;" class="gt_row gt_left">_._</td>
    <td style="color: #FFFFFF;font-weight: bold;" class="gt_row gt_left">_._</td>
    <td style="color: #FFFFFF;font-weight: bold;" class="gt_row gt_left">_._</td>
    <td style="color: #FFFFFF;font-weight: bold;" class="gt_row gt_left">_._</td>
    <td style="color: #FFFFFF;font-weight: bold;" class="gt_row gt_left">_._</td>
    <td style="color: #FFFFFF;font-weight: bold;" class="gt_row gt_left">_._</td>
  </tr>
  <tr>
    <th class="gt_row gt_left gt_stub">9</th>
    <td style="color: #FFFFFF;font-weight: bold;" class="gt_row gt_left">_._</td>
    <td style="color: #FFFFFF;font-weight: bold;" class="gt_row gt_left">_._</td>
    <td style="color: #FFFFFF;font-weight: bold;" class="gt_row gt_left">_._</td>
    <td style="color: #FFFFFF;font-weight: bold;" class="gt_row gt_left">_._</td>
    <td style="color: #FFFFFF;font-weight: bold;" class="gt_row gt_left">_._</td>
    <td style="color: #FFFFFF;font-weight: bold;" class="gt_row gt_left">_._</td>
    <td style="color: #FFFFFF;font-weight: bold;" class="gt_row gt_left">_._</td>
    <td style="color: #FFFFFF;font-weight: bold;" class="gt_row gt_left">_._</td>
    <td style="color: #FFFFFF;font-weight: bold;" class="gt_row gt_left">_._</td>
    <td style="color: #FFFFFF;font-weight: bold;" class="gt_row gt_left">_._</td>
  </tr>
</tbody>


</table>

</div>
</div>
</div>
<p>If the final score ends up being Home 4, Away 7—ding ding ding, big winner—you win the pool, and hopefully take home some combination of money and glory. For more details on playing, see <a href="https://www.wikihow.com/Play-Football-Squares">this WikiHow article</a>.</p>
</section>
<section id="why-analyze-squares" class="level2">
<h2 class="anchored" data-anchor-id="why-analyze-squares">Why analyze squares?</h2>
<p>Not all options in a Super Bowl Squares are created equal. This is because there are specific point values you can add to your score. For example, touchdowns often to result in 7 points, and its common to score 3 points via a field goal. This means that ending up with a final digit of 5 is uncommon.</p>
<p>Analyzing the chance of each square winning let’s you pick the best ones. (In some versions of Super Bowl Squares, the squares get randomly assigned to people. In that case, knowing the chance of winning tells you whether you got a bum deal or not ;).</p>
</section>
<section id="what-squares-are-most-likely-to-win" class="level2">
<h2 class="anchored" data-anchor-id="what-squares-are-most-likely-to-win">What squares are most likely to win?</h2>
<p>We looked back at games for the KC Chiefs (away), and games for the San Francisco 49ers (home), and calculated the proportion of the time each team ended with a specific digit. Putting this together for the two teams, here is the chance of winning on a given square:</p>
<div id="eba26a0f" class="cell" data-execution_count="3">
<details class="code-fold">
<summary>Code</summary>
<div class="code-copy-outer-scaffold"><div class="sourceCode cell-code" id="cb2" style="background: #f1f3f5;"><pre class="sourceCode python code-with-copy"><code class="sourceCode python"><span id="cb2-1"><span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">import</span> polars <span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">as</span> pl</span>
<span id="cb2-2"><span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">import</span> polars.selectors <span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">as</span> cs</span>
<span id="cb2-3"><span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">from</span> great_tables <span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">import</span> GT, md</span>
<span id="cb2-4"></span>
<span id="cb2-5"></span>
<span id="cb2-6"><span class="co" style="color: #5E5E5E;
background-color: null;
font-style: inherit;"># Utilities -----</span></span>
<span id="cb2-7"></span>
<span id="cb2-8"></span>
<span id="cb2-9"><span class="kw" style="color: #003B4F;
background-color: null;
font-weight: bold;
font-style: inherit;">def</span> calc_n(df: pl.DataFrame, colname: <span class="bu" style="color: null;
background-color: null;
font-style: inherit;">str</span>):</span>
<span id="cb2-10">    <span class="co" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">"""Count the number of final digits observed across games."""</span></span>
<span id="cb2-11"></span>
<span id="cb2-12">    <span class="cf" style="color: #003B4F;
background-color: null;
font-weight: bold;
font-style: inherit;">return</span> df.select(final_digit<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>pl.col(colname).mod(<span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">10</span>)).group_by(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"final_digit"</span>).agg(n<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>pl.<span class="bu" style="color: null;
background-color: null;
font-style: inherit;">len</span>())</span>
<span id="cb2-13"></span>
<span id="cb2-14"></span>
<span id="cb2-15"><span class="kw" style="color: #003B4F;
background-color: null;
font-weight: bold;
font-style: inherit;">def</span> team_final_digits(game: pl.DataFrame, team_code: <span class="bu" style="color: null;
background-color: null;
font-style: inherit;">str</span>) <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">-&gt;</span> pl.DataFrame:</span>
<span id="cb2-16">    <span class="co" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">"""Calculate a team's proportion of digits across games (both home and away)."""</span></span>
<span id="cb2-17"></span>
<span id="cb2-18">    home_n <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> calc_n(game.<span class="bu" style="color: null;
background-color: null;
font-style: inherit;">filter</span>(pl.col(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"home_team"</span>) <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">==</span> team_code), <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"home_score"</span>)</span>
<span id="cb2-19">    away_n <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> calc_n(game.<span class="bu" style="color: null;
background-color: null;
font-style: inherit;">filter</span>(pl.col(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"away_team"</span>) <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">==</span> team_code), <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"away_score"</span>)</span>
<span id="cb2-20"></span>
<span id="cb2-21">    joined <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> (</span>
<span id="cb2-22">        home_n.join(away_n, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"final_digit"</span>)</span>
<span id="cb2-23">        .select(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"final_digit"</span>, n<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>pl.col(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"n"</span>) <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">+</span> pl.col(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"n_right"</span>))</span>
<span id="cb2-24">        .with_columns(prop<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>pl.col(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"n"</span>) <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">/</span> pl.col(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"n"</span>).<span class="bu" style="color: null;
background-color: null;
font-style: inherit;">sum</span>())</span>
<span id="cb2-25">    )</span>
<span id="cb2-26"></span>
<span id="cb2-27">    <span class="cf" style="color: #003B4F;
background-color: null;
font-weight: bold;
font-style: inherit;">return</span> joined</span>
<span id="cb2-28"></span>
<span id="cb2-29"></span>
<span id="cb2-30"><span class="co" style="color: #5E5E5E;
background-color: null;
font-style: inherit;"># Analysis -----</span></span>
<span id="cb2-31"></span>
<span id="cb2-32">games <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> pl.read_csv(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"./games.csv"</span>).<span class="bu" style="color: null;
background-color: null;
font-style: inherit;">filter</span>(</span>
<span id="cb2-33">    pl.col(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"game_id"</span>) <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">!=</span> <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"2023_22_SF_KC"</span>,</span>
<span id="cb2-34">    pl.col(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"season"</span>) <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">&gt;=</span> <span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">2015</span>,</span>
<span id="cb2-35">)</span>
<span id="cb2-36"></span>
<span id="cb2-37"><span class="co" style="color: #5E5E5E;
background-color: null;
font-style: inherit;"># Individual probabilities of final digits per team</span></span>
<span id="cb2-38">home <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> team_final_digits(games, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"KC"</span>)</span>
<span id="cb2-39">away <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> team_final_digits(games, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"SF"</span>)</span>
<span id="cb2-40"></span>
<span id="cb2-41"><span class="co" style="color: #5E5E5E;
background-color: null;
font-style: inherit;"># Cross and multiply p(digit | team=KC)p(digit | team=SF) to get</span></span>
<span id="cb2-42"><span class="co" style="color: #5E5E5E;
background-color: null;
font-style: inherit;"># the joint probability p(digit_KC, digit_SF | KC, SF)</span></span>
<span id="cb2-43">joint <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> (</span>
<span id="cb2-44">    home.join(away, how<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"cross"</span>)</span>
<span id="cb2-45">    .with_columns(joint<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>pl.col(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"prop"</span>) <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">*</span> pl.col(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"prop_right"</span>))</span>
<span id="cb2-46">    .sort(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"final_digit"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"final_digit_right"</span>)</span>
<span id="cb2-47">    .pivot(values<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"joint"</span>, on<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"final_digit_right"</span>, index<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"final_digit"</span>)</span>
<span id="cb2-48">    .with_columns((cs.exclude(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"final_digit"</span>) <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">*</span> <span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">100</span>).<span class="bu" style="color: null;
background-color: null;
font-style: inherit;">round</span>(<span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">1</span>))</span>
<span id="cb2-49">)</span>
<span id="cb2-50"></span>
<span id="cb2-51"><span class="co" style="color: #5E5E5E;
background-color: null;
font-style: inherit;"># Display -----</span></span>
<span id="cb2-52"></span>
<span id="cb2-53">(</span>
<span id="cb2-54">    GT(joint, rowname_col<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"final_digit"</span>)</span>
<span id="cb2-55">    .data_color(domain<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>[<span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">0</span>, <span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">4</span>], palette<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>[<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"red"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"grey"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"blue"</span>])</span>
<span id="cb2-56">    .tab_header(</span>
<span id="cb2-57">        <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Super Bowl Squares | Final Score Probabilities"</span>,</span>
<span id="cb2-58">        <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Based on all NFL regular season and playoff games (2015-2023)"</span>,</span>
<span id="cb2-59">    )</span>
<span id="cb2-60">    .tab_stubhead(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">""</span>)</span>
<span id="cb2-61">    .tab_spanner(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"San Francisco 49ers"</span>, cs.<span class="bu" style="color: null;
background-color: null;
font-style: inherit;">all</span>())</span>
<span id="cb2-62">    .tab_stubhead(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"KC Chiefs"</span>)</span>
<span id="cb2-63">    .tab_source_note(</span>
<span id="cb2-64">        md(</span>
<span id="cb2-65">            <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">'&lt;span style="float: right;"&gt;Source data: [Lee Sharpe, nflverse](https://github.com/nflverse/nfldata)&lt;/span&gt;'</span></span>
<span id="cb2-66">        )</span>
<span id="cb2-67">    )</span>
<span id="cb2-68">)</span></code></pre></div></div>
</details>
<div class="cell-output cell-output-display" data-execution_count="3">
<div id="vsfidzrwgx" style="padding-left:0px;padding-right:0px;padding-top:10px;padding-bottom:10px;overflow-x:auto;overflow-y:auto;width:auto;height:auto;">
<style>
#vsfidzrwgx table {
          font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Helvetica Neue', 'Fira Sans', 'Droid Sans', Arial, sans-serif;
          -webkit-font-smoothing: antialiased;
          -moz-osx-font-smoothing: grayscale;
        }

#vsfidzrwgx thead, tbody, tfoot, tr, td, th { border-style: none; }
 tr { background-color: transparent; }
#vsfidzrwgx p { margin: 0; padding: 0; }
 #vsfidzrwgx .gt_table { display: table; border-collapse: collapse; line-height: normal; margin-left: auto; margin-right: auto; color: #333333; font-size: 16px; font-weight: normal; font-style: normal; background-color: #FFFFFF; width: auto; border-top-style: solid; border-top-width: 2px; border-top-color: #A8A8A8; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #A8A8A8; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; }
 #vsfidzrwgx .gt_caption { padding-top: 4px; padding-bottom: 4px; }
 #vsfidzrwgx .gt_title { color: #333333; font-size: 125%; font-weight: initial; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; border-bottom-color: #FFFFFF; border-bottom-width: 0; }
 #vsfidzrwgx .gt_subtitle { color: #333333; font-size: 85%; font-weight: initial; padding-top: 3px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; border-top-color: #FFFFFF; border-top-width: 0; }
 #vsfidzrwgx .gt_heading { background-color: #FFFFFF; text-align: center; border-bottom-color: #FFFFFF; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #vsfidzrwgx .gt_bottom_border { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #vsfidzrwgx .gt_col_headings { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #vsfidzrwgx .gt_col_heading { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; overflow-x: hidden; }
 #vsfidzrwgx .gt_column_spanner_outer { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; padding-top: 0; padding-bottom: 0; padding-left: 4px; padding-right: 4px; }
 #vsfidzrwgx .gt_column_spanner_outer:first-child { padding-left: 0; }
 #vsfidzrwgx .gt_column_spanner_outer:last-child { padding-right: 0; }
 #vsfidzrwgx .gt_column_spanner { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; overflow-x: hidden; display: inline-block; width: 100%; }
 #vsfidzrwgx .gt_spanner_row { border-bottom-style: hidden; }
 #vsfidzrwgx .gt_group_heading { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; text-align: left; }
 #vsfidzrwgx .gt_empty_group_heading { padding: 0.5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: middle; }
 #vsfidzrwgx .gt_from_md> :first-child { margin-top: 0; }
 #vsfidzrwgx .gt_from_md> :last-child { margin-bottom: 0; }
 #vsfidzrwgx .gt_row { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; margin: 10px; border-top-style: solid; border-top-width: 1px; border-top-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; overflow-x: hidden; }
 #vsfidzrwgx .gt_stub { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; }
 #vsfidzrwgx .gt_stub_row_group { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; vertical-align: top; }
 #vsfidzrwgx .gt_row_group_first td { border-top-width: 2px; }
 #vsfidzrwgx .gt_row_group_first th { border-top-width: 2px; }
 #vsfidzrwgx .gt_striped { color: #333333; background-color: #F4F4F4; }
 #vsfidzrwgx .gt_table_body { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #vsfidzrwgx .gt_grand_summary_row { color: #333333; background-color: #FFFFFF; text-transform: inherit; padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; }
 #vsfidzrwgx .gt_first_grand_summary_row_bottom { border-top-style: double; border-top-width: 6px; border-top-color: #D3D3D3; }
 #vsfidzrwgx .gt_last_grand_summary_row_top { border-bottom-style: double; border-bottom-width: 6px; border-bottom-color: #D3D3D3; }
 #vsfidzrwgx .gt_sourcenotes { color: #333333; background-color: #FFFFFF; border-bottom-style: none; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; }
 #vsfidzrwgx .gt_sourcenote { font-size: 90%; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; text-align: left; }
 #vsfidzrwgx .gt_left { text-align: left; }
 #vsfidzrwgx .gt_center { text-align: center; }
 #vsfidzrwgx .gt_right { text-align: right; font-variant-numeric: tabular-nums; }
 #vsfidzrwgx .gt_font_normal { font-weight: normal; }
 #vsfidzrwgx .gt_font_bold { font-weight: bold; }
 #vsfidzrwgx .gt_font_italic { font-style: italic; }
 #vsfidzrwgx .gt_super { font-size: 65%; }
 #vsfidzrwgx .gt_footnote_marks { font-size: 75%; vertical-align: 0.4em; position: initial; }
 #vsfidzrwgx .gt_asterisk { font-size: 100%; vertical-align: 0; }
 
</style>
<table class="gt_table" data-quarto-disable-processing="false" data-quarto-bootstrap="false">
<thead>

  <tr class="gt_heading">
    <td colspan="11" class="gt_heading gt_title gt_font_normal">Super Bowl Squares | Final Score Probabilities</td>
  </tr>
  <tr class="gt_heading">
    <td colspan="11" class="gt_heading gt_subtitle gt_font_normal gt_bottom_border">Based on all NFL regular season and playoff games (2015-2023)</td>
  </tr>
<tr class="gt_col_headings gt_spanner_row">
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="2" colspan="1" scope="col" id="KC-Chiefs">KC Chiefs</th>
  <th class="gt_center gt_columns_top_border gt_column_spanner_outer" rowspan="1" colspan="10" scope="colgroup" id="San-Francisco-49ers">
    <span class="gt_column_spanner">San Francisco 49ers</span>
  </th>
</tr>
<tr class="gt_col_headings">
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="0">0</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="1">1</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="2">2</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="3">3</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="4">4</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="5">5</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="6">6</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="7">7</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="8">8</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="9">9</th>
</tr>
</thead>
<tbody class="gt_table_body">
  <tr>
    <th style="color: #000000; background-color: #ff0000;" class="gt_row gt_left gt_stub">0</th>
    <td style="color: #000000; background-color: #a2a2c8;" class="gt_row gt_right">2.3</td>
    <td style="color: #000000; background-color: #ce8e8e;" class="gt_row gt_right">1.5</td>
    <td style="color: #000000; background-color: #ec3939;" class="gt_row gt_right">0.6</td>
    <td style="color: #000000; background-color: #9898cb;" class="gt_row gt_right">2.4</td>
    <td style="color: #000000; background-color: #c8a2a2;" class="gt_row gt_right">1.7</td>
    <td style="color: #000000; background-color: #e25656;" class="gt_row gt_right">0.9</td>
    <td style="color: #000000; background-color: #d87272;" class="gt_row gt_right">1.2</td>
    <td style="color: #FFFFFF; background-color: #4c4ce5;" class="gt_row gt_right">3.2</td>
    <td style="color: #000000; background-color: #db6969;" class="gt_row gt_right">1.1</td>
    <td style="color: #000000; background-color: #e54c4c;" class="gt_row gt_right">0.8</td>
  </tr>
  <tr>
    <th style="color: #000000; background-color: #de5f5f;" class="gt_row gt_left gt_stub">1</th>
    <td style="color: #000000; background-color: #c4abab;" class="gt_row gt_right">1.8</td>
    <td style="color: #000000; background-color: #d87272;" class="gt_row gt_right">1.2</td>
    <td style="color: #000000; background-color: #ef3030;" class="gt_row gt_right">0.5</td>
    <td style="color: #000000; background-color: #c1b4b4;" class="gt_row gt_right">1.9</td>
    <td style="color: #000000; background-color: #d57c7c;" class="gt_row gt_right">1.3</td>
    <td style="color: #000000; background-color: #e84242;" class="gt_row gt_right">0.7</td>
    <td style="color: #000000; background-color: #e25656;" class="gt_row gt_right">0.9</td>
    <td style="color: #000000; background-color: #8585d2;" class="gt_row gt_right">2.6</td>
    <td style="color: #000000; background-color: #e25656;" class="gt_row gt_right">0.9</td>
    <td style="color: #000000; background-color: #ec3939;" class="gt_row gt_right">0.6</td>
  </tr>
  <tr>
    <th style="color: #000000; background-color: #bebebe;" class="gt_row gt_left gt_stub">2</th>
    <td style="color: #000000; background-color: #db6969;" class="gt_row gt_right">1.1</td>
    <td style="color: #000000; background-color: #e84242;" class="gt_row gt_right">0.7</td>
    <td style="color: #000000; background-color: #f51c1c;" class="gt_row gt_right">0.3</td>
    <td style="color: #000000; background-color: #d87272;" class="gt_row gt_right">1.2</td>
    <td style="color: #000000; background-color: #e54c4c;" class="gt_row gt_right">0.8</td>
    <td style="color: #000000; background-color: #f22626;" class="gt_row gt_right">0.4</td>
    <td style="color: #000000; background-color: #ec3939;" class="gt_row gt_right">0.6</td>
    <td style="color: #000000; background-color: #cb9898;" class="gt_row gt_right">1.6</td>
    <td style="color: #000000; background-color: #ef3030;" class="gt_row gt_right">0.5</td>
    <td style="color: #000000; background-color: #f22626;" class="gt_row gt_right">0.4</td>
  </tr>
  <tr>
    <th style="color: #FFFFFF; background-color: #5f5fde;" class="gt_row gt_left gt_stub">3</th>
    <td style="color: #000000; background-color: #c8a2a2;" class="gt_row gt_right">1.7</td>
    <td style="color: #000000; background-color: #db6969;" class="gt_row gt_right">1.1</td>
    <td style="color: #000000; background-color: #ef3030;" class="gt_row gt_right">0.5</td>
    <td style="color: #000000; background-color: #c4abab;" class="gt_row gt_right">1.8</td>
    <td style="color: #000000; background-color: #d57c7c;" class="gt_row gt_right">1.3</td>
    <td style="color: #000000; background-color: #e84242;" class="gt_row gt_right">0.7</td>
    <td style="color: #000000; background-color: #e25656;" class="gt_row gt_right">0.9</td>
    <td style="color: #000000; background-color: #8e8ece;" class="gt_row gt_right">2.5</td>
    <td style="color: #000000; background-color: #e54c4c;" class="gt_row gt_right">0.8</td>
    <td style="color: #000000; background-color: #ec3939;" class="gt_row gt_right">0.6</td>
  </tr>
  <tr>
    <th style="color: #FFFFFF; background-color: #0000ff;" class="gt_row gt_left gt_stub">4</th>
    <td style="color: #000000; background-color: #c4abab;" class="gt_row gt_right">1.8</td>
    <td style="color: #000000; background-color: #d87272;" class="gt_row gt_right">1.2</td>
    <td style="color: #000000; background-color: #ef3030;" class="gt_row gt_right">0.5</td>
    <td style="color: #000000; background-color: #c1b4b4;" class="gt_row gt_right">1.9</td>
    <td style="color: #000000; background-color: #d57c7c;" class="gt_row gt_right">1.3</td>
    <td style="color: #000000; background-color: #e84242;" class="gt_row gt_right">0.7</td>
    <td style="color: #000000; background-color: #e25656;" class="gt_row gt_right">0.9</td>
    <td style="color: #000000; background-color: #8585d2;" class="gt_row gt_right">2.6</td>
    <td style="color: #000000; background-color: #e25656;" class="gt_row gt_right">0.9</td>
    <td style="color: #000000; background-color: #ec3939;" class="gt_row gt_right">0.6</td>
  </tr>
  <tr>
    <th style="color: #000000; background-color: #808080;" class="gt_row gt_left gt_stub">5</th>
    <td style="color: #000000; background-color: #e84242;" class="gt_row gt_right">0.7</td>
    <td style="color: #000000; background-color: #ef3030;" class="gt_row gt_right">0.5</td>
    <td style="color: #000000; background-color: #f81313;" class="gt_row gt_right">0.2</td>
    <td style="color: #000000; background-color: #e84242;" class="gt_row gt_right">0.7</td>
    <td style="color: #000000; background-color: #ef3030;" class="gt_row gt_right">0.5</td>
    <td style="color: #000000; background-color: #f51c1c;" class="gt_row gt_right">0.3</td>
    <td style="color: #000000; background-color: #f22626;" class="gt_row gt_right">0.4</td>
    <td style="color: #000000; background-color: #de5f5f;" class="gt_row gt_right">1.0</td>
    <td style="color: #000000; background-color: #f51c1c;" class="gt_row gt_right">0.3</td>
    <td style="color: #000000; background-color: #f81313;" class="gt_row gt_right">0.2</td>
  </tr>
  <tr>
    <th style="color: #000000; background-color: #808080;" class="gt_row gt_left gt_stub">6</th>
    <td style="color: #000000; background-color: #de5f5f;" class="gt_row gt_right">1.0</td>
    <td style="color: #000000; background-color: #ec3939;" class="gt_row gt_right">0.6</td>
    <td style="color: #000000; background-color: #f81313;" class="gt_row gt_right">0.2</td>
    <td style="color: #000000; background-color: #de5f5f;" class="gt_row gt_right">1.0</td>
    <td style="color: #000000; background-color: #e84242;" class="gt_row gt_right">0.7</td>
    <td style="color: #000000; background-color: #f22626;" class="gt_row gt_right">0.4</td>
    <td style="color: #000000; background-color: #ef3030;" class="gt_row gt_right">0.5</td>
    <td style="color: #000000; background-color: #d28585;" class="gt_row gt_right">1.4</td>
    <td style="color: #000000; background-color: #ef3030;" class="gt_row gt_right">0.5</td>
    <td style="color: #000000; background-color: #f51c1c;" class="gt_row gt_right">0.3</td>
  </tr>
  <tr>
    <th style="color: #000000; background-color: #808080;" class="gt_row gt_left gt_stub">7</th>
    <td style="color: #000000; background-color: #a2a2c8;" class="gt_row gt_right">2.3</td>
    <td style="color: #000000; background-color: #ce8e8e;" class="gt_row gt_right">1.5</td>
    <td style="color: #000000; background-color: #ec3939;" class="gt_row gt_right">0.6</td>
    <td style="color: #000000; background-color: #9898cb;" class="gt_row gt_right">2.4</td>
    <td style="color: #000000; background-color: #c8a2a2;" class="gt_row gt_right">1.7</td>
    <td style="color: #000000; background-color: #e25656;" class="gt_row gt_right">0.9</td>
    <td style="color: #000000; background-color: #d87272;" class="gt_row gt_right">1.2</td>
    <td style="color: #FFFFFF; background-color: #3939ec;" class="gt_row gt_right">3.4</td>
    <td style="color: #000000; background-color: #db6969;" class="gt_row gt_right">1.1</td>
    <td style="color: #000000; background-color: #e54c4c;" class="gt_row gt_right">0.8</td>
  </tr>
  <tr>
    <th style="color: #000000; background-color: #808080;" class="gt_row gt_left gt_stub">8</th>
    <td style="color: #000000; background-color: #e54c4c;" class="gt_row gt_right">0.8</td>
    <td style="color: #000000; background-color: #ef3030;" class="gt_row gt_right">0.5</td>
    <td style="color: #000000; background-color: #f81313;" class="gt_row gt_right">0.2</td>
    <td style="color: #000000; background-color: #e54c4c;" class="gt_row gt_right">0.8</td>
    <td style="color: #000000; background-color: #ec3939;" class="gt_row gt_right">0.6</td>
    <td style="color: #000000; background-color: #f51c1c;" class="gt_row gt_right">0.3</td>
    <td style="color: #000000; background-color: #f22626;" class="gt_row gt_right">0.4</td>
    <td style="color: #000000; background-color: #db6969;" class="gt_row gt_right">1.1</td>
    <td style="color: #000000; background-color: #f22626;" class="gt_row gt_right">0.4</td>
    <td style="color: #000000; background-color: #f51c1c;" class="gt_row gt_right">0.3</td>
  </tr>
  <tr>
    <th style="color: #000000; background-color: #808080;" class="gt_row gt_left gt_stub">9</th>
    <td style="color: #000000; background-color: #de5f5f;" class="gt_row gt_right">1.0</td>
    <td style="color: #000000; background-color: #e84242;" class="gt_row gt_right">0.7</td>
    <td style="color: #000000; background-color: #f51c1c;" class="gt_row gt_right">0.3</td>
    <td style="color: #000000; background-color: #db6969;" class="gt_row gt_right">1.1</td>
    <td style="color: #000000; background-color: #e54c4c;" class="gt_row gt_right">0.8</td>
    <td style="color: #000000; background-color: #f22626;" class="gt_row gt_right">0.4</td>
    <td style="color: #000000; background-color: #ef3030;" class="gt_row gt_right">0.5</td>
    <td style="color: #000000; background-color: #ce8e8e;" class="gt_row gt_right">1.5</td>
    <td style="color: #000000; background-color: #ef3030;" class="gt_row gt_right">0.5</td>
    <td style="color: #000000; background-color: #f22626;" class="gt_row gt_right">0.4</td>
  </tr>
</tbody>
  <tfoot class="gt_sourcenotes">
  
  <tr>
    <td class="gt_sourcenote" colspan="11"><span style="float: right;">Source data: <a href="https://github.com/nflverse/nfldata">Lee Sharpe, nflverse</a></span></td>
  </tr>

</tfoot>

</table>

</div>
</div>
</div>
<p>Notice how much higher the chance of winning on any score involving 7 is. This shows up in two places on the table:</p>
<ul>
<li>Across the 7 row (i.e.&nbsp;KC Chiefs end with a 7)</li>
<li>Down the 7 column (i.e.&nbsp;S.F. 49ers ends with a 7)</li>
</ul>
<p>Moreover, the 7/7 square has the highest chance (3.4%). Some other good squares are 7/0 (or 0/7), and 0/0.</p>
</section>
<section id="go-forth-and-win-the-respect-of-your-coworkers" class="level2">
<h2 class="anchored" data-anchor-id="go-forth-and-win-the-respect-of-your-coworkers">Go forth and win the respect of your coworkers</h2>
<p>We hope this square will make you the envy of your coworkers. Here at Great Tables, we’re not just interested in the beautiful display of tables, but your success in defeating the person in the cubicle next to you.</p>
<p>As a final shout out, we used the python data analysis tool Polars for all the data analysis. Using Polars with Great Tables was a total delight. To learn more about how we analyzed the data, along with the code, see the appendix below!</p>
<div class="callout callout-style-default callout-note callout-titled" title="Appendix: analysis and code">
<div class="callout-header d-flex align-content-center collapsed" data-bs-toggle="collapse" data-bs-target=".callout-1-contents" aria-controls="callout-1" aria-expanded="false" aria-label="Toggle callout">
<div class="callout-icon-container">
<i class="callout-icon"></i>
</div>
<div class="callout-title-container flex-fill">
<span class="screen-reader-only">Note</span>Appendix: analysis and code
</div>
<div class="callout-btn-toggle d-inline-block border-0 py-1 ps-1 pe-0 float-end"><i class="callout-toggle"></i></div>
</div>
<div id="callout-1" class="callout-1-contents callout-collapse collapse">
<section id="appendix-analysis-and-code" class="level2 callout-body-container callout-body">
<h2 class="anchored" data-anchor-id="appendix-analysis-and-code">Appendix: analysis and code</h2>
<section id="method" class="level3">
<h3 class="anchored" data-anchor-id="method">Method</h3>
<p>In order to calculate the probability of a given square winning, we focused on the joint probability of observing a final digit for the home team AND a final digit for the away team.</p>
<p>This can be expressed as <code>p(home_digit, away_digit | home="SF", away="KC")</code>. Note that the probability is conditioned on the teams playing in the Super Bowl. In order to estimate this, we <code>p(digit | team="SF")*p(digit | team="KC")</code>.</p>
<p>This essentially makes two assumptions:</p>
<ol type="1">
<li>That the final digit does not depend on whether a team is home or away (though it may depend on the team playing).</li>
<li>That the final digit for a given team is independent of the team they are playing.</li>
</ol>
<p>Another way to think about this is that digit is being modeled as if each team is drawing a ball numbered 0-9 from their own urn. We are modelling the chance of observing a pair of numbers, corresponding to a draw from each team’s urns.</p>
<p>The code for this analysis is in <a href="https://github.com/posit-dev/great-tables/blob/main/docs/blog/superbowl-squares/_code.py">this python script on github</a>, and is included below:</p>
</section>
<section id="code" class="level3">
<h3 class="anchored" data-anchor-id="code">Code</h3>
<div id="e9a8c7cb" class="cell" data-execution_count="4">
<div class="code-copy-outer-scaffold"><div class="sourceCode cell-code" id="cb3" style="background: #f1f3f5;"><pre class="sourceCode python code-with-copy"><code class="sourceCode python"><span id="cb3-1"><span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">import</span> polars <span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">as</span> pl</span>
<span id="cb3-2"><span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">import</span> polars.selectors <span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">as</span> cs</span>
<span id="cb3-3"><span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">from</span> great_tables <span class="im" style="color: #00769E;
background-color: null;
font-style: inherit;">import</span> GT, md</span>
<span id="cb3-4"></span>
<span id="cb3-5"></span>
<span id="cb3-6"><span class="co" style="color: #5E5E5E;
background-color: null;
font-style: inherit;"># Utilities -----</span></span>
<span id="cb3-7"></span>
<span id="cb3-8"></span>
<span id="cb3-9"><span class="kw" style="color: #003B4F;
background-color: null;
font-weight: bold;
font-style: inherit;">def</span> calc_n(df: pl.DataFrame, colname: <span class="bu" style="color: null;
background-color: null;
font-style: inherit;">str</span>):</span>
<span id="cb3-10">    <span class="co" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">"""Count the number of final digits observed across games."""</span></span>
<span id="cb3-11"></span>
<span id="cb3-12">    <span class="cf" style="color: #003B4F;
background-color: null;
font-weight: bold;
font-style: inherit;">return</span> df.select(final_digit<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>pl.col(colname).mod(<span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">10</span>)).group_by(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"final_digit"</span>).agg(n<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>pl.<span class="bu" style="color: null;
background-color: null;
font-style: inherit;">len</span>())</span>
<span id="cb3-13"></span>
<span id="cb3-14"></span>
<span id="cb3-15"><span class="kw" style="color: #003B4F;
background-color: null;
font-weight: bold;
font-style: inherit;">def</span> team_final_digits(game: pl.DataFrame, team_code: <span class="bu" style="color: null;
background-color: null;
font-style: inherit;">str</span>) <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">-&gt;</span> pl.DataFrame:</span>
<span id="cb3-16">    <span class="co" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">"""Calculate a team's proportion of digits across games (both home and away)."""</span></span>
<span id="cb3-17"></span>
<span id="cb3-18">    home_n <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> calc_n(game.<span class="bu" style="color: null;
background-color: null;
font-style: inherit;">filter</span>(pl.col(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"home_team"</span>) <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">==</span> team_code), <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"home_score"</span>)</span>
<span id="cb3-19">    away_n <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> calc_n(game.<span class="bu" style="color: null;
background-color: null;
font-style: inherit;">filter</span>(pl.col(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"away_team"</span>) <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">==</span> team_code), <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"away_score"</span>)</span>
<span id="cb3-20"></span>
<span id="cb3-21">    joined <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> (</span>
<span id="cb3-22">        home_n.join(away_n, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"final_digit"</span>)</span>
<span id="cb3-23">        .select(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"final_digit"</span>, n<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>pl.col(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"n"</span>) <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">+</span> pl.col(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"n_right"</span>))</span>
<span id="cb3-24">        .with_columns(prop<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>pl.col(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"n"</span>) <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">/</span> pl.col(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"n"</span>).<span class="bu" style="color: null;
background-color: null;
font-style: inherit;">sum</span>())</span>
<span id="cb3-25">    )</span>
<span id="cb3-26"></span>
<span id="cb3-27">    <span class="cf" style="color: #003B4F;
background-color: null;
font-weight: bold;
font-style: inherit;">return</span> joined</span>
<span id="cb3-28"></span>
<span id="cb3-29"></span>
<span id="cb3-30"><span class="co" style="color: #5E5E5E;
background-color: null;
font-style: inherit;"># Analysis -----</span></span>
<span id="cb3-31"></span>
<span id="cb3-32">games <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> pl.read_csv(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"./games.csv"</span>).<span class="bu" style="color: null;
background-color: null;
font-style: inherit;">filter</span>(</span>
<span id="cb3-33">    pl.col(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"game_id"</span>) <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">!=</span> <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"2023_22_SF_KC"</span>,</span>
<span id="cb3-34">    pl.col(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"season"</span>) <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">&gt;=</span> <span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">2015</span>,</span>
<span id="cb3-35">)</span>
<span id="cb3-36"></span>
<span id="cb3-37"><span class="co" style="color: #5E5E5E;
background-color: null;
font-style: inherit;"># Individual probabilities of final digits per team</span></span>
<span id="cb3-38">home <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> team_final_digits(games, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"KC"</span>)</span>
<span id="cb3-39">away <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> team_final_digits(games, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"SF"</span>)</span>
<span id="cb3-40"></span>
<span id="cb3-41"><span class="co" style="color: #5E5E5E;
background-color: null;
font-style: inherit;"># Cross and multiply p(digit | team=KC)p(digit | team=SF) to get</span></span>
<span id="cb3-42"><span class="co" style="color: #5E5E5E;
background-color: null;
font-style: inherit;"># the joint probability p(digit_KC, digit_SF | KC, SF)</span></span>
<span id="cb3-43">joint <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span> (</span>
<span id="cb3-44">    home.join(away, how<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"cross"</span>)</span>
<span id="cb3-45">    .with_columns(joint<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>pl.col(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"prop"</span>) <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">*</span> pl.col(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"prop_right"</span>))</span>
<span id="cb3-46">    .sort(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"final_digit"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"final_digit_right"</span>)</span>
<span id="cb3-47">    .pivot(values<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"joint"</span>, on<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"final_digit_right"</span>, index<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"final_digit"</span>)</span>
<span id="cb3-48">    .with_columns((cs.exclude(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"final_digit"</span>) <span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">*</span> <span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">100</span>).<span class="bu" style="color: null;
background-color: null;
font-style: inherit;">round</span>(<span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">1</span>))</span>
<span id="cb3-49">)</span>
<span id="cb3-50"></span>
<span id="cb3-51"><span class="co" style="color: #5E5E5E;
background-color: null;
font-style: inherit;"># Display -----</span></span>
<span id="cb3-52"></span>
<span id="cb3-53">(</span>
<span id="cb3-54">    GT(joint, rowname_col<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span><span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"final_digit"</span>)</span>
<span id="cb3-55">    .data_color(domain<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>[<span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">0</span>, <span class="dv" style="color: #AD0000;
background-color: null;
font-style: inherit;">4</span>], palette<span class="op" style="color: #5E5E5E;
background-color: null;
font-style: inherit;">=</span>[<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"red"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"grey"</span>, <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"blue"</span>])</span>
<span id="cb3-56">    .tab_header(</span>
<span id="cb3-57">        <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Super Bowl Squares | Final Score Probabilities"</span>,</span>
<span id="cb3-58">        <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"Based on all NFL regular season and playoff games (2015-2023)"</span>,</span>
<span id="cb3-59">    )</span>
<span id="cb3-60">    .tab_stubhead(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">""</span>)</span>
<span id="cb3-61">    .tab_spanner(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"San Francisco 49ers"</span>, cs.<span class="bu" style="color: null;
background-color: null;
font-style: inherit;">all</span>())</span>
<span id="cb3-62">    .tab_stubhead(<span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">"KC Chiefs"</span>)</span>
<span id="cb3-63">    .tab_source_note(</span>
<span id="cb3-64">        md(</span>
<span id="cb3-65">            <span class="st" style="color: #20794D;
background-color: null;
font-style: inherit;">'&lt;span style="float: right;"&gt;Source data: [Lee Sharpe, nflverse](https://github.com/nflverse/nfldata)&lt;/span&gt;'</span></span>
<span id="cb3-66">        )</span>
<span id="cb3-67">    )</span>
<span id="cb3-68">)</span></code></pre></div></div>
<div class="cell-output cell-output-display" data-execution_count="4">
<div id="uiozfqayig" style="padding-left:0px;padding-right:0px;padding-top:10px;padding-bottom:10px;overflow-x:auto;overflow-y:auto;width:auto;height:auto;">
<style>
#uiozfqayig table {
          font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Helvetica Neue', 'Fira Sans', 'Droid Sans', Arial, sans-serif;
          -webkit-font-smoothing: antialiased;
          -moz-osx-font-smoothing: grayscale;
        }

#uiozfqayig thead, tbody, tfoot, tr, td, th { border-style: none; }
 tr { background-color: transparent; }
#uiozfqayig p { margin: 0; padding: 0; }
 #uiozfqayig .gt_table { display: table; border-collapse: collapse; line-height: normal; margin-left: auto; margin-right: auto; color: #333333; font-size: 16px; font-weight: normal; font-style: normal; background-color: #FFFFFF; width: auto; border-top-style: solid; border-top-width: 2px; border-top-color: #A8A8A8; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #A8A8A8; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; }
 #uiozfqayig .gt_caption { padding-top: 4px; padding-bottom: 4px; }
 #uiozfqayig .gt_title { color: #333333; font-size: 125%; font-weight: initial; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; border-bottom-color: #FFFFFF; border-bottom-width: 0; }
 #uiozfqayig .gt_subtitle { color: #333333; font-size: 85%; font-weight: initial; padding-top: 3px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; border-top-color: #FFFFFF; border-top-width: 0; }
 #uiozfqayig .gt_heading { background-color: #FFFFFF; text-align: center; border-bottom-color: #FFFFFF; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #uiozfqayig .gt_bottom_border { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #uiozfqayig .gt_col_headings { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; }
 #uiozfqayig .gt_col_heading { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; overflow-x: hidden; }
 #uiozfqayig .gt_column_spanner_outer { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: normal; text-transform: inherit; padding-top: 0; padding-bottom: 0; padding-left: 4px; padding-right: 4px; }
 #uiozfqayig .gt_column_spanner_outer:first-child { padding-left: 0; }
 #uiozfqayig .gt_column_spanner_outer:last-child { padding-right: 0; }
 #uiozfqayig .gt_column_spanner { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: bottom; padding-top: 5px; padding-bottom: 5px; overflow-x: hidden; display: inline-block; width: 100%; }
 #uiozfqayig .gt_spanner_row { border-bottom-style: hidden; }
 #uiozfqayig .gt_group_heading { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; text-align: left; }
 #uiozfqayig .gt_empty_group_heading { padding: 0.5px; color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; vertical-align: middle; }
 #uiozfqayig .gt_from_md> :first-child { margin-top: 0; }
 #uiozfqayig .gt_from_md> :last-child { margin-bottom: 0; }
 #uiozfqayig .gt_row { padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; margin: 10px; border-top-style: solid; border-top-width: 1px; border-top-color: #D3D3D3; border-left-style: none; border-left-width: 1px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 1px; border-right-color: #D3D3D3; vertical-align: middle; overflow-x: hidden; }
 #uiozfqayig .gt_stub { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; }
 #uiozfqayig .gt_stub_row_group { color: #333333; background-color: #FFFFFF; font-size: 100%; font-weight: initial; text-transform: inherit; border-right-style: solid; border-right-width: 2px; border-right-color: #D3D3D3; padding-left: 5px; padding-right: 5px; vertical-align: top; }
 #uiozfqayig .gt_row_group_first td { border-top-width: 2px; }
 #uiozfqayig .gt_row_group_first th { border-top-width: 2px; }
 #uiozfqayig .gt_striped { color: #333333; background-color: #F4F4F4; }
 #uiozfqayig .gt_table_body { border-top-style: solid; border-top-width: 2px; border-top-color: #D3D3D3; border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #D3D3D3; }
 #uiozfqayig .gt_grand_summary_row { color: #333333; background-color: #FFFFFF; text-transform: inherit; padding-top: 8px; padding-bottom: 8px; padding-left: 5px; padding-right: 5px; }
 #uiozfqayig .gt_first_grand_summary_row_bottom { border-top-style: double; border-top-width: 6px; border-top-color: #D3D3D3; }
 #uiozfqayig .gt_last_grand_summary_row_top { border-bottom-style: double; border-bottom-width: 6px; border-bottom-color: #D3D3D3; }
 #uiozfqayig .gt_sourcenotes { color: #333333; background-color: #FFFFFF; border-bottom-style: none; border-bottom-width: 2px; border-bottom-color: #D3D3D3; border-left-style: none; border-left-width: 2px; border-left-color: #D3D3D3; border-right-style: none; border-right-width: 2px; border-right-color: #D3D3D3; }
 #uiozfqayig .gt_sourcenote { font-size: 90%; padding-top: 4px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; text-align: left; }
 #uiozfqayig .gt_left { text-align: left; }
 #uiozfqayig .gt_center { text-align: center; }
 #uiozfqayig .gt_right { text-align: right; font-variant-numeric: tabular-nums; }
 #uiozfqayig .gt_font_normal { font-weight: normal; }
 #uiozfqayig .gt_font_bold { font-weight: bold; }
 #uiozfqayig .gt_font_italic { font-style: italic; }
 #uiozfqayig .gt_super { font-size: 65%; }
 #uiozfqayig .gt_footnote_marks { font-size: 75%; vertical-align: 0.4em; position: initial; }
 #uiozfqayig .gt_asterisk { font-size: 100%; vertical-align: 0; }
 
</style>
<table class="gt_table" data-quarto-disable-processing="false" data-quarto-bootstrap="false">
<thead>

  <tr class="gt_heading">
    <td colspan="11" class="gt_heading gt_title gt_font_normal">Super Bowl Squares | Final Score Probabilities</td>
  </tr>
  <tr class="gt_heading">
    <td colspan="11" class="gt_heading gt_subtitle gt_font_normal gt_bottom_border">Based on all NFL regular season and playoff games (2015-2023)</td>
  </tr>
<tr class="gt_col_headings gt_spanner_row">
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="2" colspan="1" scope="col" id="KC-Chiefs">KC Chiefs</th>
  <th class="gt_center gt_columns_top_border gt_column_spanner_outer" rowspan="1" colspan="10" scope="colgroup" id="San-Francisco-49ers">
    <span class="gt_column_spanner">San Francisco 49ers</span>
  </th>
</tr>
<tr class="gt_col_headings">
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="0">0</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="1">1</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="2">2</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="3">3</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="4">4</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="5">5</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="6">6</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="7">7</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="8">8</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="9">9</th>
</tr>
</thead>
<tbody class="gt_table_body">
  <tr>
    <th style="color: #000000; background-color: #ff0000;" class="gt_row gt_left gt_stub">0</th>
    <td style="color: #000000; background-color: #a2a2c8;" class="gt_row gt_right">2.3</td>
    <td style="color: #000000; background-color: #ce8e8e;" class="gt_row gt_right">1.5</td>
    <td style="color: #000000; background-color: #ec3939;" class="gt_row gt_right">0.6</td>
    <td style="color: #000000; background-color: #9898cb;" class="gt_row gt_right">2.4</td>
    <td style="color: #000000; background-color: #c8a2a2;" class="gt_row gt_right">1.7</td>
    <td style="color: #000000; background-color: #e25656;" class="gt_row gt_right">0.9</td>
    <td style="color: #000000; background-color: #d87272;" class="gt_row gt_right">1.2</td>
    <td style="color: #FFFFFF; background-color: #4c4ce5;" class="gt_row gt_right">3.2</td>
    <td style="color: #000000; background-color: #db6969;" class="gt_row gt_right">1.1</td>
    <td style="color: #000000; background-color: #e54c4c;" class="gt_row gt_right">0.8</td>
  </tr>
  <tr>
    <th style="color: #000000; background-color: #de5f5f;" class="gt_row gt_left gt_stub">1</th>
    <td style="color: #000000; background-color: #c4abab;" class="gt_row gt_right">1.8</td>
    <td style="color: #000000; background-color: #d87272;" class="gt_row gt_right">1.2</td>
    <td style="color: #000000; background-color: #ef3030;" class="gt_row gt_right">0.5</td>
    <td style="color: #000000; background-color: #c1b4b4;" class="gt_row gt_right">1.9</td>
    <td style="color: #000000; background-color: #d57c7c;" class="gt_row gt_right">1.3</td>
    <td style="color: #000000; background-color: #e84242;" class="gt_row gt_right">0.7</td>
    <td style="color: #000000; background-color: #e25656;" class="gt_row gt_right">0.9</td>
    <td style="color: #000000; background-color: #8585d2;" class="gt_row gt_right">2.6</td>
    <td style="color: #000000; background-color: #e25656;" class="gt_row gt_right">0.9</td>
    <td style="color: #000000; background-color: #ec3939;" class="gt_row gt_right">0.6</td>
  </tr>
  <tr>
    <th style="color: #000000; background-color: #bebebe;" class="gt_row gt_left gt_stub">2</th>
    <td style="color: #000000; background-color: #db6969;" class="gt_row gt_right">1.1</td>
    <td style="color: #000000; background-color: #e84242;" class="gt_row gt_right">0.7</td>
    <td style="color: #000000; background-color: #f51c1c;" class="gt_row gt_right">0.3</td>
    <td style="color: #000000; background-color: #d87272;" class="gt_row gt_right">1.2</td>
    <td style="color: #000000; background-color: #e54c4c;" class="gt_row gt_right">0.8</td>
    <td style="color: #000000; background-color: #f22626;" class="gt_row gt_right">0.4</td>
    <td style="color: #000000; background-color: #ec3939;" class="gt_row gt_right">0.6</td>
    <td style="color: #000000; background-color: #cb9898;" class="gt_row gt_right">1.6</td>
    <td style="color: #000000; background-color: #ef3030;" class="gt_row gt_right">0.5</td>
    <td style="color: #000000; background-color: #f22626;" class="gt_row gt_right">0.4</td>
  </tr>
  <tr>
    <th style="color: #FFFFFF; background-color: #5f5fde;" class="gt_row gt_left gt_stub">3</th>
    <td style="color: #000000; background-color: #c8a2a2;" class="gt_row gt_right">1.7</td>
    <td style="color: #000000; background-color: #db6969;" class="gt_row gt_right">1.1</td>
    <td style="color: #000000; background-color: #ef3030;" class="gt_row gt_right">0.5</td>
    <td style="color: #000000; background-color: #c4abab;" class="gt_row gt_right">1.8</td>
    <td style="color: #000000; background-color: #d57c7c;" class="gt_row gt_right">1.3</td>
    <td style="color: #000000; background-color: #e84242;" class="gt_row gt_right">0.7</td>
    <td style="color: #000000; background-color: #e25656;" class="gt_row gt_right">0.9</td>
    <td style="color: #000000; background-color: #8e8ece;" class="gt_row gt_right">2.5</td>
    <td style="color: #000000; background-color: #e54c4c;" class="gt_row gt_right">0.8</td>
    <td style="color: #000000; background-color: #ec3939;" class="gt_row gt_right">0.6</td>
  </tr>
  <tr>
    <th style="color: #FFFFFF; background-color: #0000ff;" class="gt_row gt_left gt_stub">4</th>
    <td style="color: #000000; background-color: #c4abab;" class="gt_row gt_right">1.8</td>
    <td style="color: #000000; background-color: #d87272;" class="gt_row gt_right">1.2</td>
    <td style="color: #000000; background-color: #ef3030;" class="gt_row gt_right">0.5</td>
    <td style="color: #000000; background-color: #c1b4b4;" class="gt_row gt_right">1.9</td>
    <td style="color: #000000; background-color: #d57c7c;" class="gt_row gt_right">1.3</td>
    <td style="color: #000000; background-color: #e84242;" class="gt_row gt_right">0.7</td>
    <td style="color: #000000; background-color: #e25656;" class="gt_row gt_right">0.9</td>
    <td style="color: #000000; background-color: #8585d2;" class="gt_row gt_right">2.6</td>
    <td style="color: #000000; background-color: #e25656;" class="gt_row gt_right">0.9</td>
    <td style="color: #000000; background-color: #ec3939;" class="gt_row gt_right">0.6</td>
  </tr>
  <tr>
    <th style="color: #000000; background-color: #808080;" class="gt_row gt_left gt_stub">5</th>
    <td style="color: #000000; background-color: #e84242;" class="gt_row gt_right">0.7</td>
    <td style="color: #000000; background-color: #ef3030;" class="gt_row gt_right">0.5</td>
    <td style="color: #000000; background-color: #f81313;" class="gt_row gt_right">0.2</td>
    <td style="color: #000000; background-color: #e84242;" class="gt_row gt_right">0.7</td>
    <td style="color: #000000; background-color: #ef3030;" class="gt_row gt_right">0.5</td>
    <td style="color: #000000; background-color: #f51c1c;" class="gt_row gt_right">0.3</td>
    <td style="color: #000000; background-color: #f22626;" class="gt_row gt_right">0.4</td>
    <td style="color: #000000; background-color: #de5f5f;" class="gt_row gt_right">1.0</td>
    <td style="color: #000000; background-color: #f51c1c;" class="gt_row gt_right">0.3</td>
    <td style="color: #000000; background-color: #f81313;" class="gt_row gt_right">0.2</td>
  </tr>
  <tr>
    <th style="color: #000000; background-color: #808080;" class="gt_row gt_left gt_stub">6</th>
    <td style="color: #000000; background-color: #de5f5f;" class="gt_row gt_right">1.0</td>
    <td style="color: #000000; background-color: #ec3939;" class="gt_row gt_right">0.6</td>
    <td style="color: #000000; background-color: #f81313;" class="gt_row gt_right">0.2</td>
    <td style="color: #000000; background-color: #de5f5f;" class="gt_row gt_right">1.0</td>
    <td style="color: #000000; background-color: #e84242;" class="gt_row gt_right">0.7</td>
    <td style="color: #000000; background-color: #f22626;" class="gt_row gt_right">0.4</td>
    <td style="color: #000000; background-color: #ef3030;" class="gt_row gt_right">0.5</td>
    <td style="color: #000000; background-color: #d28585;" class="gt_row gt_right">1.4</td>
    <td style="color: #000000; background-color: #ef3030;" class="gt_row gt_right">0.5</td>
    <td style="color: #000000; background-color: #f51c1c;" class="gt_row gt_right">0.3</td>
  </tr>
  <tr>
    <th style="color: #000000; background-color: #808080;" class="gt_row gt_left gt_stub">7</th>
    <td style="color: #000000; background-color: #a2a2c8;" class="gt_row gt_right">2.3</td>
    <td style="color: #000000; background-color: #ce8e8e;" class="gt_row gt_right">1.5</td>
    <td style="color: #000000; background-color: #ec3939;" class="gt_row gt_right">0.6</td>
    <td style="color: #000000; background-color: #9898cb;" class="gt_row gt_right">2.4</td>
    <td style="color: #000000; background-color: #c8a2a2;" class="gt_row gt_right">1.7</td>
    <td style="color: #000000; background-color: #e25656;" class="gt_row gt_right">0.9</td>
    <td style="color: #000000; background-color: #d87272;" class="gt_row gt_right">1.2</td>
    <td style="color: #FFFFFF; background-color: #3939ec;" class="gt_row gt_right">3.4</td>
    <td style="color: #000000; background-color: #db6969;" class="gt_row gt_right">1.1</td>
    <td style="color: #000000; background-color: #e54c4c;" class="gt_row gt_right">0.8</td>
  </tr>
  <tr>
    <th style="color: #000000; background-color: #808080;" class="gt_row gt_left gt_stub">8</th>
    <td style="color: #000000; background-color: #e54c4c;" class="gt_row gt_right">0.8</td>
    <td style="color: #000000; background-color: #ef3030;" class="gt_row gt_right">0.5</td>
    <td style="color: #000000; background-color: #f81313;" class="gt_row gt_right">0.2</td>
    <td style="color: #000000; background-color: #e54c4c;" class="gt_row gt_right">0.8</td>
    <td style="color: #000000; background-color: #ec3939;" class="gt_row gt_right">0.6</td>
    <td style="color: #000000; background-color: #f51c1c;" class="gt_row gt_right">0.3</td>
    <td style="color: #000000; background-color: #f22626;" class="gt_row gt_right">0.4</td>
    <td style="color: #000000; background-color: #db6969;" class="gt_row gt_right">1.1</td>
    <td style="color: #000000; background-color: #f22626;" class="gt_row gt_right">0.4</td>
    <td style="color: #000000; background-color: #f51c1c;" class="gt_row gt_right">0.3</td>
  </tr>
  <tr>
    <th style="color: #000000; background-color: #808080;" class="gt_row gt_left gt_stub">9</th>
    <td style="color: #000000; background-color: #de5f5f;" class="gt_row gt_right">1.0</td>
    <td style="color: #000000; background-color: #e84242;" class="gt_row gt_right">0.7</td>
    <td style="color: #000000; background-color: #f51c1c;" class="gt_row gt_right">0.3</td>
    <td style="color: #000000; background-color: #db6969;" class="gt_row gt_right">1.1</td>
    <td style="color: #000000; background-color: #e54c4c;" class="gt_row gt_right">0.8</td>
    <td style="color: #000000; background-color: #f22626;" class="gt_row gt_right">0.4</td>
    <td style="color: #000000; background-color: #ef3030;" class="gt_row gt_right">0.5</td>
    <td style="color: #000000; background-color: #ce8e8e;" class="gt_row gt_right">1.5</td>
    <td style="color: #000000; background-color: #ef3030;" class="gt_row gt_right">0.5</td>
    <td style="color: #000000; background-color: #f22626;" class="gt_row gt_right">0.4</td>
  </tr>
</tbody>
  <tfoot class="gt_sourcenotes">
  
  <tr>
    <td class="gt_sourcenote" colspan="11"><span style="float: right;">Source data: <a href="https://github.com/nflverse/nfldata">Lee Sharpe, nflverse</a></span></td>
  </tr>

</tfoot>

</table>

</div>
</div>
</div>
</section>
</section>
</div>
</div>


</section>

 ]]></description>
  <guid>https://posit-dev.github.io/great-tables/blog/superbowl-squares/</guid>
  <pubDate>Thu, 08 Feb 2024 00:00:00 GMT</pubDate>
</item>
</channel>
</rss>
