Separate the chart from the host
An iframe keeps the chart’s styles and runtime isolated. The same product can appear on sites built with different platforms without requiring each owner to install a frontend package.
Data visualization · Web / Case study
Buggin Charts.
River data, ready for any website.
A configurable charting product that makes USGS river conditions easy to explore and embed in fishing reports and other websites.
- My role
- Software engineer & interface designer
- Status
- Live web product
A real capture of the chart product. To explore current measurements, open Buggin Charts .
01 / The problem
The problem
River information is useful well beyond a dedicated fishing app. A fishing report or guide’s website needs a reliable, readable way to show current conditions without building its own data integration.
02 / My solution
Build once. Embed anywhere.
I developed a reusable chart system with a visual configuration workflow. Website owners choose a USGS station, measurements, time range, and appearance, then copy an embed into their own site.
03 / System overview
System overview
- 01
USGS data
Server-side requests retrieve station metadata and observations, with validated responses, normalized time series, and caching.
- 02
Interactive visualization
React and uPlot render responsive charts. Controls expose measurement types and time ranges alongside timestamps and data-quality information.
- 03
Portable distribution
Validated URL parameters configure an isolated iframe. A companion resize script lets the embed fit its content on the host page.
04 / Engineering decisions
Engineering decisions
Treat upstream data as imperfect
The data layer validates responses and handles timeouts and upstream errors. Measurement timestamps, provisional-data labels, and missing-data states keep the interface honest about what is available.
Make configuration shareable
The station and validated display options are represented in the embed URL. That makes a configuration portable and reproducible without requiring an account or a custom integration.
05 / Where it stands
Current status
Buggin Charts is available as a working web product with a chart builder, live examples, and an embedding guide. It extends the Buggin ecosystem into a reusable tool for other websites.
Next project
Buggin
Contact
Get in touch
I’m open to software engineering opportunities and technical collaborations.