v5.0.0 · on npm
SF MapSVG

Example 1 · Local ballot measures · 2002–2026

San Francisco’s local measures, district by district.

Forty-four measures across four elections, drawn on the district map each election used. Choose a measure, compare it with another, and download what you see.

Certified resultsPassage is decided citywideSources and method

Election

    Measure

    Loading…

    Map shows

    Loading the map…

    Districts, highest Yes first

    The count

    Every district, every vote.

    Official counts for the selected measure. Undervotes and overvotes are shown where the source reports them.

    AreaYesNoYes shareComparedUndervotesOvervotes

    Sources and method

    Where these numbers come from

    Yes share is Yes divided by Yes plus No; blank and over-marked ballots are excluded. District rows are summed and checked against the certified citywide totals. A measure passes on the citywide vote, using a simple majority or two thirds as the ballot requires, so a district’s share never decides the outcome.

    Painting a measure onto the districts
    import { renderMap } from '@kahwee/sf-map-svg/static';
    import { staticMapData } from '@kahwee/sf-map-svg/data/static';
    
    // Each election uses the district map of its day: 2002, 2012 or 2022.
    const { svg } = renderMap(staticMapData, {
      year: election.districtYear,
      districtStyle: (district) => {
        const row = measure.districts.find((d) => d.district === district.id);
        return { fill: sequential(row.yes / (row.yes + row.no)) };
      },
    });