Legend, then selective labels

Show a legend for two or more series, and label only the end or extreme.

From dataviz (references/marks-and-anatomy.md, references/anti-patterns.md).

Which numbers earn a label

Drag Series from 1 to 6.

Every pointBad

Revenue by region

Jan–Aug, $
    Selective Good

    Revenue by region

    Jan–Aug, $
      legend.hidden = series.length < 2;
      labels = series.length <= 4 ? series.map(endOf) : [endOf(focus)];
      if (mode === "extreme") labels.push(peakOf(series));

      When end labels collide

      Push Convergence up, then try Small multiples.

      Stacked, nudgedBad

      Active accounts by plan

      Jan–Aug
        Wired or faceted Good

        Active accounts by plan

        Jan–Aug
          for (const p of spreadApart(ends, 14)) leader(p.ideal, p.y), label(p);
          if (series.length > 4 && converging) layout = "small-multiples";

          Move a label, never crop it

          Shrink Add-ons or Services, or pick a longer label.

          ClippedBad

          Q3 revenue by line

          $
            overflow: hidden; text-overflow: clip
            MeasuredGood

            Q3 revenue by line

            $
              if (w + 16 <= seg.width) return "inside";
              if (isLast && seg.right + 6 + w <= room) return "end";
              return "tooltip";

              Why it matters, pros and cons

              Why it matters

              The legend always carries identity, so color never has to. Labels get read because they are rare.

              Pros

              • The headline number sits on the mark
              • Identity survives color blindness and print
              • Tooltips carry everything unlabeled

              Cons

              • End labels need 70 to 100px of right margin
              • Collision handling is real code
              • Small multiples cost vertical space