← All examples

Darklight

Digital Tolkien "Little Delving #0018" — a DIVERGING bar chart, in the reusable rust-on-cream house frame.

Charts 728 × 577 <column><data><define><delving-rust><diverging><record><slot><style><text>

Result

Source examples/darklight.svgn

<diagram padding="34">
  <!-- Digital Tolkien "Little Delving #0018" — a DIVERGING bar chart, in the
       reusable rust-on-cream house frame. -->
  <style>
    svg { --sv-bg: #faf3e3; --sv-font: Georgia, "Times New Roman", serif;
          --sv-text: #1a1a1a; --sv-edge: #222; }
  </style>

  <!-- the recurring "versus" template: rust title/subtitle + mono footer -->
  <define name="delving-rust">
    <column gap="6" align="center">
      <text color="#c1553b" font-size="44" label="${title}"/>
      <text color="#c1553b" font-size="27" label="${subtitle}"/>
      <slot/>
      <text color="#6e6e6e" font-size="18" font-family="monospace" label="Little Delving #${num}"/>
      <text color="#6e6e6e" font-size="18" font-family="monospace" label="digitaltolkien.com"/>
    </column>
  </define>

  <delving-rust title="“dark” versus “light”" subtitle="frequency per 10k tokens" num="0018">
    <diverging data="dl" row="book" left="dark" right="light"
               left-label="dark" right-label="light"
               width="660" height="330" colors="#e08a7a #94ce9e"/>
  </delving-rust>

  <data name="dl">
    <record book="The Hobbit"            dark="14.77" light="12.25"/>
    <record book="The Lord of the Rings" dark="15.35" light="11.4"/>
    <record book="The Silmarillion"      dark="12.45" light="11.61"/>
  </data>
</diagram>

Open the SVG →