Cell
Auto Mark Heatmap Explorer
Visualizes deterministic seeded athlete records with weight on the x-axis and height on the y-axis, using color to represent local density as a heatmap. The app mirrors the Observable auto-mark heatmap pattern by letting users switch between Plot.auto (automatic heatmap mark selection) and an explicit Plot.rect + Plot.bin implementation. Users can adjust color scheme (YlGnBu, Turbo, Viridis), filter the population by athlete group (All, Female, Male), and tune bin count with a slider to control heatmap granularity. Hover interaction is implemented with Plot.tip and Plot.pointer so users can inspect nearest athlete details (name, sport, group, weight, height) while exploring dense regions.
Auto Mark Heatmap by Weight and Sex
Recreates the Observable Plot auto-mark heatmap 2 pattern by plotting athlete weight on the x-axis and sex on the y-axis, with color encoding binned count density. The chart is backed by deterministic seeded athlete records stored in a bf-managed table and loaded into the app on startup. Users can filter the dataset by sport group (All, Artistic, Endurance, Mixed, Power), switch between color schemes (YlGnBu, Viridis, Turbo), and toggle layout between a combined heatmap and faceted small multiples by sport group. Hover exploration is supported with Plot.tip + Plot.pointer, showing athlete-level details (name, sex, weight, group) near the cursor to make dense bins easier to inspect.
Calendar Activity Heatmap
Recreates the Observable Plot calendar example as a faceted year-by-year calendar heatmap where x is week-of-year and y is weekday, with each cell encoding a deterministic daily activity value. The app is backed by a bf-managed table seeded with static daily records from 2024 through 2025, including date, activity, and quarter fields. Users can filter the view to all years or a single year, switch between absolute daily activity and day-over-day change metrics, and toggle whether weekends are included in the grid. Users can also change the color scheme (YlGnBu, Turbo, RdYlBu), while pointer-based tooltips reveal exact date, month/weekday context, activity, and change values for interactive exploration.
Correlation Heatmap Explorer
Displays a pairwise correlation matrix across six deterministic seeded numeric fields (Demand, Temperature, Humidity, Wind, Solar, Price), with variables shown on both axes and color encoding Pearson correlation from -1 to 1. The chart follows the Observable correlation-heatmap pattern by rendering cell marks for each pair and optional in-cell text labels showing rounded correlation values. Users can switch color palettes (Red-Yellow-Blue, Red-Blue, Spectral), toggle matrix coverage between full matrix and upper/lower triangle views, and control label precision with a decimals slider. Hover interaction uses a pointer tip to reveal the exact variable pair and correlation value for the nearest cell, enabling precise inspection beyond color perception.
Continuous Dimensions Heatmap
Recreates the Observable Plot continuous dimensions heatmap style by binning two quantitative dimensions: carat on the x-axis and price on the y-axis. The app uses deterministic seeded gem records in a bf-managed table and renders a dense rectangular heatmap with Plot.rect + Plot.bin where color represents count per bin. Users can filter records by market segment (All, Value, Standard, Premium), change the color palette (BuPu, Viridis, Turbo), and switch color scale type (SymLog, Linear, Sqrt) to emphasize sparse versus dense regions. A bin-threshold slider controls heatmap granularity, and pointer-based tooltips reveal nearest data-point details (segment, carat, price) for interactive exploration.
Seattle Temperature Temporal Heatmap
Recreates the Observable Plot Seattle temperature heatmap pattern using a calendar-like grid where day-of-month is on the x-axis and month is on the y-axis. The chart uses deterministic seeded daily temperature highs for 2023 and 2024 in a bf-managed table, and renders with Plot.cell + Plot.group so each cell encodes an aggregated temperature value. Users can filter between all years, 2023, and 2024, change aggregation mode (maximum, average, minimum), and switch the color palette (Red-Yellow-Blue, Turbo, Viridis) to compare seasonal temperature structure. Hover interaction is implemented with Plot.tip and Plot.pointer to inspect exact date-level highs while exploring each month/day region.
Simplified Dow Jones Calendar
Recreates the Observable Plot Dow Jones simplified calendar by faceting each year into horizontal calendar strips, encoding week-of-year on x and weekday on y with cell color representing daily percentage change in close. The app seeds a bf-managed table with deterministic trading-day records from 2018 through 2025, including static ISO date strings and close values generated from repeatable trend and seasonal components. Users can switch the visible time scope (all years, most recent three years, latest year), adjust diverging color range sensitivity with a percentage slider, and change the color scheme (PiYG, RdBu, Turbo). Hover interaction is implemented with Plot.tip and Plot.pointer so each cell reveals exact date, close value, and day-over-day percentage change for precise exploration.
Simpsons IMDb Ratings Heatmap
Recreates the Observable Plot Simpsons ratings example as a season-by-episode heatmap with season on the top x-axis, episode index on the y-axis, and cell color encoding IMDb rating. The app is backed by deterministic seeded episode records in a bf-managed table, including season number, episode number, synthetic episode code title, static air date, and rating values shaped to show stronger early seasons and weaker later seasons. Users can switch the visible season window (all, classic, middle, modern eras), adjust a minimum-rating slider to filter out lower-rated episodes, and change the color scheme (PiYG, RdYlGn, Turbo) to compare contrast and trend visibility. Users can also toggle in-cell numeric labels on or off, and hover interaction is provided via Plot.tip + Plot.pointer to inspect exact episode details (title, season, episode, rating, air date) for the nearest cell.
Sorted Heatmap of Traffic by Hour
Shows a heatmap of traffic volume by hour (x-axis) and location (y-axis), where each cell color encodes an aggregated traffic metric. The chart starts from deterministic seeded records in a bf-backed table with repeated hourly measurements per location. Users can switch the aggregation metric between median, mean, and maximum using a dropdown, and the row order updates to stay sorted by the chosen metric as in the Observable sorted heatmap pattern. Users can also change the color scheme (Blues, Viridis, Turbo) to explore contrast and visual emphasis. Hovering over a cell displays a pointer-based tooltip with location, hour, aggregated value, and sample count.