UVM Arboretum Explorer

An interactive map of the University of Vermont's campus plant collection, modelled on the Purdue Arboretum Explorer.

Search and filter every mapped tree, shrub and vine on campus; tap a plant for its full record; scan a QR code on a physical label to land straight on that plant's page.

2,060 plants are on the map, almost all of them from UVM's ArcGIS tree layer, surveyed by Erin Camire in 2023–24 and used with her permission — see docs/ARCGIS-IMPORT.md. What they do not have is measurements: the layer records a position, a species and a health rating, and nothing about trunk diameter or height. Those arrive one tree at a time, from the field app, and a re-survey adds to a tree's record rather than replacing it. data/taxa.csv carries 257 species, so the species list still runs ahead of what has been mapped. Two more records are kept but hidden by default — one tree removed, one a survey could not find — for 2,062 in all.

Quick start

npm install
npm run dev          # http://localhost:5173

What it does

Map — clustered plant markers over three keyless basemaps (OpenStreetMap, Esri satellite, Esri topographic) — no API key, no account. Markers scale with trunk diameter, and can be coloured by plant type, origin, condition or campus area, with a matching legend.

Search — free text across common name, scientific name, family, cultivar, campus area and accession number. Every term must match, so extra words narrow the result. A word you have finished typing matches whole words only, so "red maple" finds red maples and not every maple on Redstone Campus; the word still being typed can match part of one, so results keep up as you type.

Filters — faceted and combinable, in this order: campus area, plant type (seven categories, trees split deciduous/evergreen), family, origin including Vermont-invasive, condition, minimum trunk diameter, flowering month, and whether the plant has a dedication plaque. Each option shows a live count, computed with its own facet relaxed so the alternatives stay clickable. Removed and missing plants are left off the map; one opens only from its old QR label or link. Show all on a record narrows the map to exactly that species — the same number the record gives as mapped on campus — and says so under the search box, with a × to lift it. Typing a new search lifts it too. Every filter applies to the Burlington street trees as well, when they are shown.

Plant records — accession, species description, DBH, height, spread, condition, planting year, age, last survey date, coordinates, notes, gift and memorial dedications, photo, and species-level facts (foliage, flower and fruit color and season, fall color, mature height, hardiness zones). Plus walking directions, a "see all N of this species" jump, and a share button beside the close button: on a phone it opens the phone's own share screen, and on a desktop a menu to copy the link or share it to WhatsApp, LinkedIn, Facebook or X. The link opens the map on that tree. The service logos are from Simple Icons (CC0).

Species pages — a page of its own for every species in taxa.csv, at /species/<taxon-id>/, with an index at /species/. Static HTML generated by npm run data: readable by a search engine without JavaScript, and quick on a phone outdoors. Each page shows the description and fun fact, a characteristics table listing only what is actually recorded, and how many are mapped and where, with photos of that species taken on campus. A plant record links out to its species page; the species page links back to the map filtered to that species. The one script, species/search.js, is the species search in the green bar: a box after "All species" on a wide screen, a magnifier that opens it on a phone. It suggests species by common name, scientific name or any alias, ranked as the survey app ranks them, and fetches the species list only once the search is used.

Burlington street trees — 364 of the city's street trees stand inside the campus boundary, on Main Street, College Street, Colchester Avenue and the rest. They are on the map behind Show Burlington street trees, off by default, folded under City trees in the panel's Layers, in Burlington's flag blue and white against UVM's green and gold. Above it, Campus boundaries shows or hides the whole-campus outline and each campus area one by one, or all together. The map opens with the outline alone, which carries every campus's name; an area switched on shows its own name, and never a second copy of it. The map's own layers control switches only the outline (Campus outline). They are kept structurally separate from the collection — their own file, their own BTV- ids, their own array in the payload — because they are the city's trees, not the university's. See docs/CITY-TREES.md.

QR labels — npm run labels generates a printable label sheet and individual QR SVGs. Each code encodes ?plant=<accession>, so scanning a sign on a tree opens that record. Removed plants still resolve from their old labels.

Campus areas — UVM's six campuses, as an optional overlay drawing the boundary and its five named campuses (Central, Trinity, Centennial, Redstone, Athletic), toggled from the same layers control as the basemaps. The shapes shipped today are hand-drawn estimates, marked as such on the map; /tracer/ replaces them with traced ones. See docs/CAMPUS-AREAS.md.

Walking trails — self-guided tours drawn from data/trails.geojson, each with a stop list.

Near me — sorts results by distance from the visitor's location, for "what am I standing under?"

Export — the current result set as CSV, for staff working in a spreadsheet.

Field survey app — an installable offline web app at /field/ for recording trees on a phone. It opens on a map of the mapped trees around you and one question — update a mapped tree, or add a new one — then asks only what that kind of visit needs: tag or nearby-tree lookup, GPS with an accuracy gate, tap-to-place pin on satellite imagery, camera, and CSV export that feeds the importer. See docs/FIELD-APP.md.

Boundary tracer — an internal tool at /tracer/ for drawing the campus areas over satellite imagery. Split carves the sub-campuses out of the traced boundary with boolean clipping, so rough shapes snap to the real campus edge and only the lines between campuses are ever drawn by hand; Edit moves land between areas that already have owners, labelling pieces too small to find; Trace clicks out an outline from scratch. It saves nothing; it hands you a GeoJSON file to commit. See docs/CAMPUS-AREAS.md.

Position editor — an internal tool at /positions/ for correcting where trees sit, at a desk: every mapped tree on satellite imagery, drag a dot onto its crown, dozens or hundreds in a session, saved in the browser as you go. Trees with nothing there can be marked one by one or by dragging a rectangle or circle; they become not-found records, history kept. Export changes hands you a file that npm run positions applies. A correction is not a survey visit and the public map does not show it as one. See docs/POSITIONS.md.

Survey intake — npm run import merges a field export into the dataset: assigns accession numbers, resolves species from common or scientific names, normalises EXC/Very Good/g onto the condition vocabulary, reads whatever coordinate format your GPS app emitted, applies re-surveys in place, and refuses to write anything if a row has a problem. Dry run by default. See docs/FIELD-SURVEY.md.

Mobile-first throughout, since most visitors arrive by scanning a label outdoors. Keyboard accessible; / focuses search, Escape closes a record.

Submitting a search gets out of the way. Enter — the magnifying glass on a phone keyboard — closes the search drawer, lowers the keyboard and moves the map to what was found. Zoom to results closes the drawer too, and so does touching the map beside it, which is lightly shaded while the drawer is open: that touch only closes the drawer, so it cannot select a tree by accident. A tree's record on a phone is a sheet over the lower map, and a tap on the map above it puts it away as its × does; a tap on another tree opens that one instead, and dragging the map leaves it be. A bare tag number goes straight to that tree and opens its record: typing 772 lists both UVM-0772 and UVM-2772, but the map flies to the one whose tag actually reads 772 and shows it, because somebody typing a number is usually standing under it. Typing a different tag reloads the record on that tree; searching for anything else closes it, since a record left open from the last search describes none of what is now on screen.

How it is put together

data/*.csv          the source of truth — humans edit these
                    (except city-trees.csv, which is clipped from the city's)
  ↓ npm run data    validates every row, fails loudly on bad data
public/data/*.json  compact generated files the site loads
public/species/     a static page per species, generated at the same time
  ↓ npm run build
dist/               a static site — no server, no database

Editing the collection means editing a CSV and opening a pull request. CI validates the data on every push, so a mistyped coordinate or an unknown species never reaches the live site.

Data model & validation rules	docs/DATA-MODEL.md
Campus boundaries & the tracer	docs/CAMPUS-AREAS.md
Surveying and mapping trees	docs/FIELD-SURVEY.md
The ArcGIS import	docs/ARCGIS-IMPORT.md
Burlington's street trees	docs/CITY-TREES.md
Where the two inventories disagree	docs/INVENTORY-CROSSCHECK.md
What became of the 2014 tags	docs/TAG-COVERAGE.md
Data sources, citations and licences	data/SOURCES.md
The field survey app	docs/FIELD-APP.md
Correcting positions at a desk	docs/POSITIONS.md

Commands

Command	What it does
npm run dev	Rebuild data, start the dev server
npm run data	Validate data/*.csv and regenerate public/data/, public/field/ and public/species/
npm run build	Validate, typecheck and build to dist/
npm run import -- <file.csv>	Merge a field-survey export into data/plants.csv and data/observations.csv (dry run by default)
npm run positions -- <positions.csv>	Apply position corrections exported from /positions/ to data/plants.csv, and trees marked not there to data/observations.csv (dry run by default)
npm run import:arcgis -- <layer.geojson>	Load UVM's ArcGIS tree layer (dry run by default)
npm run import:city -- <file.csv>	Clip Burlington's street-tree inventory to campus (dry run by default)
npm run areas	File each plant under the campus area its coordinates fall in (dry run by default)
npm run check:species -- <file>	Report how a source file's species names resolve against taxa.csv
npm run check:inventories	Compare the 2014 inventory against the map, tree by tree, and list every disagreement
npm run check:coverage	Account for the 2014 tags that are not on the map, and rank the gaps worth walking
npm run check:prose	Report any taxon whose fun fact merely restates its description
python3 scripts/lidar/crown_peaks.py	Find crown peaks in the 2023 LiDAR for /positions/ (Python; see docs/LIDAR.md)
npm run photos	Check every photo is WebP ≤ 1200 px; -- --write converts any that are not
npm run itree:export	Write the i-Tree Eco inventory file for the city's campus trees (see docs/ITREE.md)

npm run labels takes optional flags:

npm run labels -- --collection university-green
npm run labels -- --ids UVM-0763,UVM-4704
npm run labels -- --base https://arboretum.uvm.edu/

Configuration

data/config.json holds the site name, tagline, contact address, public URL (what QR codes encode), and the map's centre, zoom and campus bounds. Coordinates outside those bounds produce a build warning — a cheap catch for a transposed sign or a dropped minus.

Stack

Vite, TypeScript, Leaflet and Leaflet.markercluster. Two runtime dependencies, no API keys, no accounts. Chosen so that a student worker can pick this up in an afternoon and so it still builds in five years.

Getting started for real

1. Survey an area with the field app — start with the University Green.
2. Add any species not already in data/taxa.csv.
3. npm run import -- your-export.csv to see what it makes of the field data, then again with --write.
4. npm run data until it is clean, then commit.
5. npm run labels, print, and install signs.

Repeat area by area. Each one is a real improvement to a live site.