Quadrant

A quadrant chart is a scatter plus a crosshair plus names. <rule> draws the two dividers in DATA coordinates, so they stay on the 0.5 lines whatever the plot is sized to, and labels names each point - without which the dots say nothing about which thing they stand for.

Charts 492 × 412 <data><plot><points><record><rule>

Result

Source examples/quadrant.svgn

<diagram padding="26">
  <!-- A quadrant chart is a scatter plus a crosshair plus names. <rule> draws
       the two dividers in DATA coordinates, so they stay on the 0.5 lines
       whatever the plot is sized to, and `labels` names each point - without
       which the dots say nothing about which thing they stand for. -->
  <data name="features">
    <record effort="0.22" value="0.82" name="Dark mode"/>
    <record effort="0.78" value="0.88" name="Offline sync"/>
    <record effort="0.35" value="0.30" name="Emoji picker"/>
    <record effort="0.85" value="0.25" name="Custom themes"/>
    <record effort="0.15" value="0.62" name="Keyboard nav"/>
  </data>

  <plot data="features" width="440" height="360"
        x-min="0" x-max="1" y-max="1"
        x-title="Effort" y-title="Value">
    <rule x1="0" y1="0.5" x2="1" y2="0.5"/>
    <rule x1="0.5" y1="0" x2="0.5" y2="1"/>
    <points x="effort" y="value" labels="name" r="6"/>
  </plot>
</diagram>

Open the SVG →