An atlas of San Francisco, drawn in SVGv5.0.0 · on npm
SF MapSVG
GitHub

Example 2 · California propositions · November 5, 2024

How San Francisco voted on California’s propositions.

Ten statewide measures, eleven supervisorial districts. Teal leans Yes, vermilion leans No, and the deeper the color, the wider the margin.

Certified San Francisco resultsVotes cast in SF onlySource and method

At a glance

Ten ballots, one city.

Each map is one proposition. Choose one to see it in full, district by district.

    Proposition

    Loading…

    Loading the map…

    Yes share by district. Select a district with a pointer, or Tab to it and press Enter.

    Every district on one line

    Districts, highest Yes first

    Source and method

    Reading the numbers

    Yes share is Yes votes divided by Yes plus No. Undervotes and overvotes are excluded. District totals were checked against San Francisco’s certified citywide totals. These are votes cast in each supervisorial district, not a portrait of the people who live there, and they do not show statewide outcomes.

    Certified district workbookCertification letterStatewide results

    Download results JSON
    How this page draws its maps 
    import { renderMap } from '@kahwee/sf-map-svg/static';
import { staticMapData } from '@kahwee/sf-map-svg/data/static';

// Rendered once at build time; the page only repaints fills.
const { svg } = renderMap(staticMapData, {
  year: 2022,
  districtStyle: (district) => ({
    fill: diverging(yesShare(prop.districts[district.id - 1])),
  }),
});