Skip to main content
Log in
B

BBischof

@BBischof·65 public vizzes

Loading thumbnail…

MindAgents model errors

This visualization captures a log from a terminal session running the MindAgents game, showing three large language models—LLAMA_3.3_70B, GEMINI_1_5_FLASH, and GPT35_TURBO—attempting to play a cooperative card game. The ASCII-art interface displays the game state with hearts for lives, stars for points, and per-player card numbers, while concurrently revealing an error log. The example demonstrates how a Python CLI using `asyncio` orchestrates model interactions, with a 404 `model_not_found` error halting play when the specified Llama model is inaccessible. The rendering relies on box-drawing characters and emoji from the terminal output, sourced from a gist by BBischof.

Feb 14, 2025
Loading thumbnail…

Gist 2bba23d8eda3ce767e87a6a491773372

The visualization is a scatterplot-style mosaic representing a 1000x1000 grid, plotting the positions and sizes of 234 rectangular claims from an Advent of Code puzzle. Overlapping rectangles accumulate, creating a dense heatmap-like field of colored blocks on a dark background. Built with Processing, the sketch loads the claim data from `aoc3_1.txt` and renders each rectangle using `rect()`, varying color intensity based on overlap count. The code uses `loadStrings()` to parse the input file and calls `noLoop()` to draw the static result once.

Dec 5, 2018
Loading thumbnail…

Gist 5f7cb9e8d72f30e59d6434c1c4255ebb

A force-directed network layout displays the editorial decisions of an automated process, examining a list of strings from `aoc2_1.txt` to identify near-identical entries. Each line becomes a node, and edges connect strings differing by a single character, revealing clusters of typographical variations. The visualization uses `d3.forceSimulation` to position nodes and calculate the layout, with the text data serving as the primary source. The resulting graph shows the distribution of these one-off mutations across the dataset, highlighting regions of high and low similarity.

Dec 3, 2018
Loading thumbnail…

Gist ee5686347047ba8685a25aaa85169791

This visualization tracks the cumulative frequency of a list of integer adjustments, showing the running total as it evolves through the sequence. It uses D3.js to render a line chart on an SVG canvas, with the x-axis representing the step number and the y-axis the accumulated sum. The data comes from a plain-text file of frequency changes, reminiscent of the Advent of Code challenge. The implementation likely employs `d3.scaleLinear` and `d3.line` to map the data points and draw the path, with axes generated via `d3.axisBottom` and `d3.axisLeft`.

Dec 1, 2018
Loading thumbnail…

holds simulation metrics data to speed up notebook computations

Streaming convergence metrics from a lightswitch simulation are plotted as progressively smoothed curves, with separate traces for mean, median, and mode across multiple simulation runs. The JSON file stores per-run arrays of values and their convergence steps, which are then rendered in a notebook using D3’s `d3.forceSimulation` layout to keep overlapping lines readable. Data comes from a gist by BBischof, and the chart highlights how quickly each statistic stabilizes toward 1.0 as iterations increase.

Dec 1, 2018
Loading thumbnail…

probabilities for the mle estimate accuracies

Simulation results show how often maximum likelihood estimation recovers the true parameter under varying light-switch conditions. Each curve tracks accuracy across repeated trials, with probabilities rising toward certainty as sample sizes increase. The data is stored as nested JSON arrays, grouped by simulation dimension. d3.forceSimulation likely powers the layout, while d3.scale maps accuracy values to visual encodings. Multiple simulation runs per configuration reveal variance in estimator performance, highlighting how reliably the MLE converges for different problem sizes.

Nov 25, 2018
Loading thumbnail…

convergence rates for the lightswitch simulations

The chart shows convergence rates for lightswitch simulations across different room sizes, plotting the number of steps required for the mean, median, and mode to converge to a stable value against the number of switches flipped. The visualization uses a multi-line chart, with each line representing a specific convergence metric. The data comes from a JSON file containing simulation results for room sizes from 4 to 11. The code employs D3.js to parse the data and render the chart, likely using `d3.json` for loading and `d3.line` or similar APIs for plotting the series.

Nov 22, 2018
Loading thumbnail…

probabilities data for a xor simulation

This visualization displays probability distributions for a light-switch simulation, showing how the number of remaining illuminated lights changes based on an initial state across four, five, and six lights. The data, sourced from a gist by BBischof, is rendered using JavaScript and JSON arrays. The visualization likely uses a matrix or heatmap layout to compare probabilities, with both axes representing light counts, and color or size encoding the probability values computed through a binomial-like process, although the exact rendering library is not specified in the provided files.

Nov 22, 2018
Loading thumbnail…

Bay Area Climb Effort Explorer

This visualization lets users explore Strava rider rankings on famous Bay Area climbs through parallel coordinates. It compares various ranking metrics, including performance sums and Fiets-weighted scores, to see how they relate across riders. The interface supports brushing to filter data, reordering axes, and inverting axes to analyze correlations. Built with D3.js, it renders data lines onto multiple Canvas layers and uses an SVG overlay for axes and labels, with data loaded from a CSV file.

Nov 9, 2018
Loading thumbnail…

Tableau Magic to cast Date_Id to a convenient date format, assumed YYYYMMDD

This example shows how to convert a numeric `date_id` field in the assumed `YYYYMMDD` format into a proper Tableau date type. The calculation uses nested `DATEADD` functions to reconstruct the date by extracting the day, month, and year from the integer—the day from `[date_id] % 100`, the month from the middle two digits, and the year from the first four digits—then offsets from a fixed `#1900-01-01#` reference. It relies on Tableau’s `DATE` and `DATEADD` functions, with `INT` for integer division, to perform the transformation. The approach is tailored for data sources where date identifiers are stored as compact numeric codes rather than native date fields.

Aug 22, 2018
Loading thumbnail…

Parallel Coordinates

This parallel coordinates visualization displays multivariate data from a cars dataset recorded in CSV format, with each row represented as a path crossing multiple vertical axes. Users can drag axes to reorder dimensions and brush along them to filter highlighted foreground lines, while gray background lines provide context. Built with D3 v3, the example uses SVG rendering, ordinal and linear scales, `d3.svg.axis`, `d3.svg.line`, `d3.behavior.drag`, and `d3.svg.brush`. Axes reorder smoothly with transitions, and brushing toggles focus based on selected extents.

Jun 14, 2018
Loading thumbnail…

Gist eaa120aff028cbbf43c79b2d085ff771

The visualization tracks daily sales of baked goods across multiple locations in Northern and Southern California and New York City, comparing item-specific counts before and after a promotional period. It uses small multiples to display time-series data for each item-location pair, with columns representing pre- and post-promotion values side-by-side. The chart is built with d3.js, using its data parsing and SVG rendering capabilities to encode the longitudinal counts for each categorical product type, such as cookies, scones, and pound cakes. The data comes from three CSV files containing date-stamped sales figures.

May 14, 2018
Loading thumbnail…

Coffee ISO Code Location Lookup

A map displays coffee export locations by International Coffee Organization member country. The visualization plots points from a CSV file containing port names and coordinates, encoding each location’s exporting country through color. It uses d3.forceSimulation to spread overlapping labels and d3.geoPath to project the geographic data onto a world map. The interface includes a country selector that filters the displayed points, with port names shown as labels adjacent to their markers.

Apr 12, 2018
Loading thumbnail…

four variations of isprime for the first thousand integers, shuffled and rotated counts don't include original in their counts, but require it

Four variations of the `isprime` function for the first thousand integers are compared, showing how primality changes under digit shuffling, rotation, and reversal. The visualization plots each integer along the x-axis, with rows for the original prime status, the count of shuffled permutations that are prime, the count of rotated permutations that are prime, and whether the reversed digits are prime. The data comes from a CSV file processed with d3.js, using SVG elements to render the scatter-style chart. It highlights which primes remain prime under these digit transformations and which do not.

Jan 14, 2018
Loading thumbnail…

create a kernel from a pip_reqs

This example shows how to convert a pip requirements file into a runnable Jupyter kernel for a specified experiment name. It creates a dedicated virtual environment, installs the listed dependencies, and registers the kernel with ipykernel. The script uses the Bash command-line tools `virtualenv`, `pip install`, and `python -m ipykernel install`, copying the requirements file into a new directory before activating the environment. The process is split across two shell scripts, `create_kernel.sh` and `venv_to_kernel.sh`, with the latter reusing the same installation commands for existing environments.

Jan 1, 2018
Loading thumbnail…

Finally a clean way to update dictionaries in python if you're unsure all keys exist

This example demonstrates a manual approach to updating dictionary values in Python when keys may or may not already exist, using conditional logic to check membership with `if i not in your_dict`. The code iterates over an iterator and assigns either a new value or the existing value plus an increment, handling both direct assignments from iterators and values sourced from a separate dictionary. It includes a concrete frequency-counting scenario with a `letters` list, producing a tally like `{'a': 3, 'b': 2, 'c': 1}`. The example

Dec 18, 2017
Loading thumbnail…

Work-at-home Challenge for Blue Bottle Coffee Engineering Manager

This example demonstrates a scheduling algorithm that assigns coffee demand, divided into subsets, to roasting batches with fixed capacities. The visualization maps the result of a bin-packing problem where subsets may be split across roasts, but such splits are minimized. The code shows an interactive interface, using a custom JavaScript layout and API calls to process JSON requests and responses, mirroring the logic from the provided challenge. The chart renders the final allocation for each roast, with any unfulfilled demand clearly separated.

Dec 13, 2017
Loading thumbnail…

Work-at-home Challenge for Blue Bottle Coffee DevOps Engineer

This example visualizes the DevOps challenge workflow for a Blue Bottle Coffee engineering role, showing the sequential stages of S3 bucket manipulation, directory-tree microservice generation, monitoring, containerization, and deployment. The code uses the AWS SDK for JavaScript to interact with S3 buckets and Redis for key-value storage, while the visualization maps the tree command output and JSON file handling steps. It highlights the integration of SNS/SQS for upload monitoring and Terraform for infrastructure provisioning, with Docker and ECS for virtualized state persistence. The rendering approach relies on d3.js to illustrate the branching logic and data flow across the pipeline.

Oct 30, 2017
Loading thumbnail…

writing the numbers 1-100 in order and seeing the middle letter

This example examines the letters at the center of the concatenated text formed by writing the numbers 1 through 100 as words, with and without hyphens. It uses Python’s built-in string methods to join the number list, remove hyphens, and index the middle character by calculating half the total length. The visualization shows the resulting middle letter for four variations: with and without hyphen removal, and with spaces versus no spaces between numbers. The code relies solely on Python’s `list`, `join`, `replace`, and `len` functions, with no external libraries or graphical output.

Sep 15, 2017
Loading thumbnail…

A `.split()` function for excel—assumes 0 index, "-" delimiter, and reference cell "A2" but are all customizable. Outputs a string representation of the formula

This example generates spreadsheet formulas that split text from a reference cell into separate parts. It shows a Python function that recursively builds nested Excel-style `SEARCH`, `LEFT`, and `MID` calls. The code defines `build(i, delimiter='"-"', reference_cell="A2")`, which assumes a zero-based index and a hyphen delimiter, but all parameters are customizable. The output is a string representation of the formula, constructed through the helper `recurse` to incrementally locate delimiter positions. It does not execute or render the formula; it only produces the textual formula string.

Sep 13, 2017
Loading thumbnail…

Arithmetic Billiards Racks

This visualization shows the exhaustive search for arithmetic billiards racks, where each rack is a triangular arrangement of numbered balls where adjacent pairs combine via addition or absolute difference to produce the ball below. The code enumerates all possible starting configurations and recursively fills each row, displaying complete racks with remaining balls listed. It uses Python’s `copy.deepcopy` and custom `rack` and `row` classes to track and print valid arrangements, with the final output summarizing counts of racks by size.

May 22, 2017
Loading thumbnail…

All the i's, j's, and k's from Finnegan's Wake

This piece visualizes the product of all the letters i, j, and k extracted from the text of *Finnegan's Wake*. It shows the step-by-step result of repeatedly applying Hamilton's quaternion multiplication rules to the sequence of letters. The computation uses a custom Python script that reduces the entire letter sequence via the `mult` function, which implements the quaternion multiplication table. The final result of reducing this long string of letters is displayed as a single quaternion value.

May 18, 2017
Loading thumbnail…

Horsey Race

This animated SVG race simulation uses a Monte Carlo random walk to model 20 horses over a race, drawing their changing rankings as colored, labeled paths across a time axis. Each horse moves forward or backward based on assigned probabilities, and its position is computed from cumulative steps, then converted to ordinal ranks. The visualization, built with D3.v3, uses `d3.scale.ordinal` with `rangeRoundBands` for vertical placement, `d3.svg.line` for path generation, and SVG clipping to reveal the race as it progresses, recreating the FiveThirtyEight Lucky Derby analysis.

May 7, 2017
Loading thumbnail…

A nice python coding question

This example demonstrates Python exception matching through a class hierarchy, showing how the interpreter selects the first matching `except` clause. The code defines three exception classes—`B`, `C` inheriting from `B`, and `D` inheriting from `C`—then iterates over them, raising each in turn. For each raised exception, a chain of `except` handlers (catching `D`, then `C`, then `B`) prints the corresponding class name. The output reveals that a raised `D` is caught by the first handler, a raised `C` by the second, and a raised `B` by the third, illustrating that more specific exceptions are matched before their base classes.

Apr 27, 2017
Loading thumbnail…

ternary applied to fix a np.column with some nulls based on index

This example repairs missing values in a pandas DataFrame column by applying a ternary logic based on the DataFrame’s index. The code defines a function `f` that takes an index value `i` and returns a replacement, then constructs a pandas Series `s` by calling `f(i)` for every index entry via a list comprehension. Using `np.where` from NumPy, it checks whether each original value in column `'A'` is not null; if true, it keeps the original value, otherwise it substitutes the corresponding value from the generated Series `s`. The visualization demonstrates a data-cleaning pattern where null entries are filled programmatically rather than through interpolation or dropna, highlighting the interplay between pandas Series operations and NumPy’s conditional array selection.

Feb 22, 2017
Loading thumbnail…

Multi-Line Voronoi.find() w/ speech data

This example visualizes the sentiment trajectory of political speech transcripts as a multi-line chart, with each line representing a different speech and the x-axis showing progress through the text while the y-axis plots sentiment values. A Voronoi tessellation computed via `d3.voronoi()` enables interactive highlighting; the code uses the `voronoi.find()` method to identify the nearest line to the mouse cursor, though the mouseover handler is currently commented out. The visualization renders with SVG, uses Vue as its framework, and reads speech data from a CSV file. A checkbox toggles visibility of the Voronoi diagram overlay.

Nov 10, 2016
Loading thumbnail…

sentiment time-series mouseover

This example displays a time-series line chart of sentiment values loaded from a CSV file, with a mouseover interaction that reveals the exact sentiment value at the nearest data point. A transparent overlay rectangle captures mouse events, and a bisector function finds the closest time value to the cursor position. The chart uses D3 v3 with SVG rendering, including axes, a steelblue line path, and a focus circle with text label that updates dynamically on mousemove. The code relies on d3.csv, d3.svg.line, d3.svg.axis, and d3.bisector.

Sep 28, 2016
Loading thumbnail…

Beeswarm (With Flying Bees)

A beeswarm chart plots the Flare data set's hierarchical node values on a logarithmic x-axis. The visualization uses `d3.forceSimulation` with `d3.forceX`, `d3.forceY`, and `d3.forceCollide` to arrange individual points. Each point is rendered as a bee emoji via an SVG `image` element, and after a delay, the bees animate to a new position. A Voronoi overlay, created with `d3.voronoi`, improves hover interaction by expanding the clickable area for tooltips that show the node's ID and value.

Sep 17, 2016
Loading thumbnail…

Beeswarm (Most Broken)

A beeswarm plot visualizes the date each bumblebee was spotted in a dataset from BeeSpotter, with each bee represented as a small emoji icon. The icons are positioned along a time axis, using d3.forceSimulation with forceX and forceCollide to arrange points without overlap. A Voronoi overlay, generated via d3.voronoi, improves hover interaction by expanding the clickable area around each icon, displaying identifying information in a tooltip. The visualization is rendered as SVG with D3 v4.

Sep 17, 2016
Loading thumbnail…

Beeswarm (Broken)

This example visualizes the hierarchical structure of the Flare data set as a beeswarm plot. It uses a custom emoji, a honeybee, to represent each data point, with a voronoi overlay that highlights the nearest bee in red when hovered. The visualization is built with D3 v4, employing `d3.forceSimulation` with `d3.forceX`, `d3.forceY`, and `d3.forceCollide` to position the points, and `d3.voronoi` to generate the interactive cells. The x-axis uses a log scale to display the data values from the provided CSV file.

Sep 11, 2016
Loading thumbnail…

another iteration on the path-like dictionary access. This makes it into a class and uses getters and setters, a much more elegant solution

This example demonstrates a Python class that provides path-like access to nested dictionaries, using lists of keys as paths to retrieve or set values. It defines a `path_lookup` class with `__getitem__` and `__setitem__` methods that rely on `reduce` to traverse dictionary levels, handling both lookups and assignments, including error messages for invalid paths. The code includes a sample nested dictionary and several test paths, showing how to access values like `d[P1.split(":")]`, and it uses standard Python libraries only (`sys`, `json`).

Aug 29, 2016
Loading thumbnail…

A simple model of how to make a op controller in Python; convenient for data processing scripts with multiple functions.

This example demonstrates a Python operation controller that routes data-processing tasks based on an integer op code, keeping multiple functions organized in a single script. The controller maps codes 1–8 to lambda expressions that call methods like method1, method2, and method3, some of which load a secondary JSON file via json.load and apply a dedup_assist_types filter. The main function opens a data file with open and creates data through create_data, then passes it to the controller along with the op code and auxiliary file path. The script reads three command-line arguments via sys.argv and invokes controller, though the actual method implementations are omitted.

Aug 29, 2016
Loading thumbnail…

A convenient path-lookup script for python dictionaries

This example demonstrates a Python utility for accessing and modifying nested dictionary structures using colon-delimited string paths. The script defines a test dictionary with multi-level nesting and uses the `path_get` and `path_set` functions to retrieve and assign values at specified locations. The `path_get` function splits the path string on the delimiter and applies `reduce` to traverse the nested keys, while `path_set` uses `rsplit` to separate the final key and recursively updates the target. The code validates its behavior through a `main` function with assertions, including error handling for inappropriate paths.

Aug 26, 2016
Loading thumbnail…

Swimlane using d3.js

This swimlane chart displays multiple lanes of time-based work items, with a main interactive chart linked to a mini overview for brushing and navigation. Items are color-coded by whether they are in the past or future relative to the current date. The visualization is built with D3.js v2 and uses `d3.time.scale`, `d3.svg.axis`, and `d3.svg.brush` to handle time axes and selection. Data is randomly generated by a helper script, producing lane assignments and start/end dates.

Aug 18, 2016
Loading thumbnail…

Categorized Timeline Using Dates

This example shows US military conflicts from 1776 to 1876, divided into separate horizontal lanes by category: colonial, Native, European, Latin American, and internal wars. Each event is drawn as a rectangle positioned along a shared date scale, with overlapping events automatically stacked within each lane. The visualization uses the d3.layout.timeline plugin to compute lane assignments and band positions, while d3.scale.ordinal maps conflict categories to a fixed color palette. Data comes from a CSV file listing each war’s start and end dates and its sphere of influence.

Aug 17, 2016
Loading thumbnail…

Sankey Particles

This example visualizes the UK energy system as an interactive Sankey diagram, where animated particles travel along the links to represent energy flow between sources and consumers. Nodes can be dragged to reposition, which updates the link paths and particle trajectories. The visualization combines D3.js for the SVG-based Sankey layout and drag behavior with a Canvas overlay for rendering the moving particles. Particle frequency scales with link value, and each particle’s color interpolates from the source node’s color to the target node’s color. The code uses the sankey.layout and sankey.relayout functions to compute node positions and a d3.timer to drive the animation.

Aug 17, 2016
Loading thumbnail…

Sequences sunburst

The Sequences sunburst visualizes the paths of assistance sought by recidivists in an SCC homelessness project, with sequences reversed to show where individuals end up rather than where they start. It displays counts from a CSV file as a rectangular tree map, where each sequence is a series of colored segments representing service types. Users hover over a segment to highlight its full ancestry path in the breadcrumb trail and see the percentage of total cases it represents. The code uses d3.layout.partition with d3.text and d3.csv.parseRows to build the hierarchy, along with mouseover and mouseleave event handlers for interaction.

Aug 17, 2016
Loading thumbnail…

Sequences sunburst

This interactive visualization displays sequences of assistance sought by recidivists in the SCC homelessness project as an icicle plot. The chart uses D3 v3’s `d3.layout.partition` to render hierarchical data from a CSV file, with each rectangle colored by service type. Hovering over a segment fades all other nodes to 30% opacity while highlighting the ancestors, and updates a breadcrumb trail showing the path and percentage of the total. A legend can be toggled on and off, and transitions animate full opacity restoration when the mouse leaves.

Aug 17, 2016
Loading thumbnail…

Collaborations between MCU Avengers

A chord diagram visualizes transitions between service types for recidivists in the Santa Clara County Homeless System. Chords connect one assistance type to the next, with mouseover revealing the direction of each transition. The code uses a custom `customChordLayout` function, based on D3’s `d3.layout.chord`, to reduce chord overlap, and applies linear gradients to show source and target colors. Data comes from a hardcoded matrix of transition counts; the rendering uses SVG with Bootstrap tooltips. The visualization omits same-service returns and is noted as ineffective at showing transition order.

Aug 17, 2016
Loading thumbnail…

Housing Violations Data - 2012 (d3 dropdown)

A beeswarm plot shows the temporal distribution of 2012 housing violations, with each point representing a single violation. A dropdown menu filters the dataset by violation type, such as "Refuse Accumulation" or "Lead Hazard," and hovering reveals details. The x-axis maps violation dates using a time scale, while a force-directed simulation (`d3.forceSimulation`, `d3.forceX`, `d3.forceY`, `d3.forceCollide`) arranges overlapping points. The visualization uses SVG rendering, loads data from a CSV, and displays summary statistics like the number and earliest/latest violation dates.

Jul 31, 2016
Loading thumbnail…

Violations 2012 calendar view (d3 dropdown)

A calendar view shows housing violation data for 2012, with each day represented by a colored rectangle. Users select a violation type from a dropdown menu, and the color of each cell reflects the count of that violation on that date. Hovering reveals details via a tooltip. Built with D3 v4, the visualization uses `d3.timeDays` and `d3.timeMonths` to structure the calendar layout and `d3.scaleQuantize` for color encoding. SVG rectangles and text labels are animated when the selection changes, drawing from the provided CSV dataset.

Jul 31, 2016
Loading thumbnail…

A matrix of grouped bar charts

This matrix of grouped bar charts visualizes network throughput data, organized by two variables (part size and HTTP threads), with each cell showing upload and download speeds for multiple tests. The matrix layout allows quick comparison across these parameters, while aggregate charts summarizing rows and columns appear along the edges. The visualization is built using D3 v4, rendering SVG graphics, and uses scales for positioning, axes for reference, and a tooltip library for interactivity.

Jul 31, 2016
Loading thumbnail…

A matrix of grouped bar charts

This matrix of grouped bar charts displays upload and download speeds across two experimental variables, with each cell representing a unique combination of part size and HTTP thread count. The rows and columns conclude with aggregate charts summarizing data for each variable, while individual bars compare UP and DOWN throughput within each test. The visualization is rendered as SVG using D3 v3, employing ordinal scales for bar positioning, linear scales for axes, and d3-tip for tooltips. The underlying JSON data is loaded via `d3.json` and processed into a structured matrix.

Jul 31, 2016
Loading thumbnail…

Emoji Timeline for Cultural References in Murakami v4 update

This visualization maps cultural references found in Haruki Murakami's *The Elephant Vanishes* onto a timeline of page numbers using emoji icons. The x-axis corresponds to the book's page range, from 1 to 285, with rectangular emoji symbols placed at the page locations where each reference occurs. Different categories—such as books, music, movies, cars, alcohol, and cigarettes—are distinguished by unique symbols, and clicking a symbol reveals a tooltip with the specific reference name. The data, compiled from a Reddit discussion, is loaded from a JSON file and rendered using d3.v4, with an x-axis created via `d3.axisBottom` and page coordinates computed using `d3.scaleLinear`. A separate table on the page summarizes the counts of references per category.

Jul 30, 2016
Loading thumbnail…

navigate to the directory returned by a previous `which XXX`

This example demonstrates a terminal workflow for jumping directly into a source directory after locating an executable with `which`. The visualization, authored by BBischof as a gist, is a static diagram of the command sequence `cd $(dirname $(!!))`. It shows how the shell expands the `!!` history reference into the full `which` command, pipes that output through `dirname` via a command substitution, and feeds the resulting directory path to `cd`. Rendered as a text-based flow chart, it uses no external graphics libraries, relying solely on ASCII characters and shell syntax annotations to depict the process.

Jul 26, 2016
Loading thumbnail…

Violations 2012 calendar view

This calendar view visualizes 2012 housing violations, using a color-coded grid of days to show the frequency of selected violation types throughout the year. Users choose a violation category from a dropdown menu, and each day’s rectangle is shaded by a linear color scale from red to green based on the count. The visualization uses D3.js (v4) to render SVG elements, with a tooltip on hover revealing details. The data comes from a CSV file containing inspection records, and the interface uses Bootstrap for the menu styling.

Jul 25, 2016
Loading thumbnail…

Housing Violations Data - 2012

This beeswarm plot shows the timing of housing violations in 2012, with each point representing a single violation. A drop-down menu filters the visualization by violation type, such as "Overgrown Vegetation" or "Refuse Accumulation." Hovering over a point reveals details about the specific violation. Built with d3.v4, the plot uses the `forceSimulation` API to arrange points along a horizontal time axis, avoiding overlap while preserving the density distribution of the data. The dataset comes from a CSV file containing violation dates, categories, and inspection IDs.

Jul 24, 2016
Loading thumbnail…

Calendar Alternate Orientation v4 update

This calendar visualization displays daily fact counts for 2016 as an exploded month grid, with each day colored on a red-to-green scale based on value intensity using a d3.scaleQuantize and a polylinear color gradient. The code uses d3.timeDays, d3.timeMonths, and d3.timeYears to structure the layout, while d3.timeFormat handles date parsing and week/month calculations. A hover tooltip appears via d3.csv-loaded data, and the animation-ready SVG layout arranges months in rows with white grid lines separating cells.

Jul 24, 2016
Loading thumbnail…

Calendar View v4

A calendar view displays the daily opening-to-closing price change of the Dow Jones Industrial Average as a heatmap, with each day’s percentage change mapped to an eleven-class RdYlGn color scale from Cynthia Brewer. Data from a CSV file is processed using `d3.nest` and `d3.rollup` to compute the daily change, which then colors each cell. The layout arranges days into weeks, months, and years, with SVG rectangles and paths rendered via D3 v4 APIs like `d3.timeDays`, `d3.timeWeek`, and `d3.scaleQuantize`.

Jul 24, 2016
Loading thumbnail…

Calendar View

A calendar heatmap displays the frequency of food inspection violations per day, using a diverging color scale from red to green across a year. The visualization loads CSV data via `d3.csv`, quantizes values, and renders SVG rectangles positioned by week and month. It uses D3 v4 APIs including `d3.timeParse`, `d3.scaleQuantize`, and `d3.timeDays` to build the calendar grid, with a tooltip showing details on hover. The layout and Brewer color scheme follow examples from stat-computing and ColorBrewer.

Jul 23, 2016
Loading thumbnail…

Housing Violations Data - 2012

A beeswarm plot visualizes 2012 housing violations, with each point representing a single violation. The plot displays the distribution of violations over time, colored by violation category, and a dropdown menu filters the view by specific violation type, such as "Overgrown Vegetation" or "Refuse Accumulation." Hovering over a point reveals additional details about that violation. The visualization uses D3.js v4, rendering as SVG. The data comes from a CSV file containing violation records with dates and types. The dropdown menu is built with Bootstrap, and the interactive filtering and hover effects are implemented using D3's selection and event-handling methods.

Jul 16, 2016
Loading thumbnail…

Visualizing Distributions

This example compares four chart types for visualizing one-dimensional distributions. It first displays a swarm plot and a pile plot, which use a force-directed layout to position individual data points without overlap, in this case 700 values generated from a log-normal distribution. The example then shows a histogram, constructed using the `d3.layout.histogram()` function to bin the data, and a boxplot, which uses `d3.scale.quantile()` to compute summary statistics. The swarm and pile plots are built using the `d3.forceChart()` plugin from the `force-chart.js` library.

Jul 15, 2016
Loading thumbnail…

Orthographic Clipping

An orthographic projection of Earth’s graticule rotates slowly, with a circle marking the visible hemisphere’s boundary. The graticule lines, drawn at 10º latitude and longitude intervals, are clipped at the projection’s 90° limit, while a world map outline from a GeoJSON file is also clipped in the same way. Both the graticule and the map path animate via a timer, using `d3.geo.orthographic()`, `d3.geo.path()`, and `d3.timer` within d3.v3’s SVG rendering.

Jun 26, 2016
Loading thumbnail…

This is the result of JODA not being serializable in scala, resorting to utter bullshit, assumes year is 2016.

This visualization charts time-series data using a custom timestamp conversion workaround. The chart maps dates and times to Unix epoch integers through a Scala function that hardcodes the year as 2016, manually calculating day-of-year offsets and time-of-day seconds. The function parses month abbreviations via string indexing, converts day strings to integers, and splits time strings into hours, minutes, and seconds. This approach bypasses JODA datetime serialization limitations, producing numeric x-axis values for plotting. The rendered graphic likely uses a standard plotting library, though the code excerpt only shows the formatter.

May 12, 2016
Loading thumbnail…

deleting a specific git commit

This example shows a shell-script workflow for removing a specific commit from a Git history, using `git log` to locate the offending commit’s ID and then `git rebase --onto` with the commit’s parent and the commit ID to drop it from the current branch. The code relies on Git’s command-line interface, specifically the `rebase` and `log` commands, and is written as a Bash script with inline comments. It does not include any data visualization or graphical output; instead, the “visualization” is the textual commit graph visible through `git log`. The script is minimal, demonstrating the exact sequence of commands needed to delete a chosen commit without merging or reverting.

May 12, 2016
Loading thumbnail…

I like this example of grabbing elements from a List until you reach your desired sum.

This example demonstrates a functional approach to accumulating values from a numeric sequence, stopping once the running total exceeds 100. The code constructs a range of integers from 1 to 10,000 using Scala’s `1 to 10000` collection, then applies `takeWhile` with a closure that mutates an external `var sum`. The predicate adds each element to `sum` and tests the condition `sum <= 100`, effectively yielding the shortest prefix whose cumulative sum is just under the target. The visualization likely shows the resulting list and the final sum, highlighting how `takeWhile` short-circuits iteration without materializing the full sequence.

Apr 12, 2016
Loading thumbnail…

Computing the amount of beans for the hopper

The visualization computes the number of beans required to fill a hopper based on the desired number of espresso shots, displaying the result as a textual output. It defines a Scala function `bean_counter` that calculates bean amounts using a simple formula: for even shot counts, it multiplies by 20, and for odd counts, it adds an extra 16 beans. The code uses Scala’s integer arithmetic and exception handling to reject negative inputs. No external libraries or rendering APIs are used; the example relies solely on the Scala standard library to produce the computed bean count.

Apr 1, 2016
Loading thumbnail…

A solution to a codefights daily puzzle that was amusing and might be useful to reference

This example demonstrates a Python solution to a Codefights puzzle that decompresses a run-length encoded string, sorts its letters, and returns the kth character. The visualization shows how the algorithm groups identical letters using `itertools.groupby` and `sorted`, then aggregates their counts with `sum`. It uses `re.findall` to parse letter-number pairs and a pairwise iteration to handle adjacent matches. The code returns -1 for invalid inputs or when k exceeds the total character count, illustrating a compact approach to string compression challenges.

Mar 22, 2016
Loading thumbnail…

Makes a little histogram in bash from your data. Uses = for bars

This example renders a simple histogram directly in the terminal from a two-column data file. It displays each data point’s label alongside a bar of equals signs whose length corresponds to the numeric value, followed by the raw count. The script uses standard shell tools: a `while read` loop parses `data.txt`, and `printf` with a field width expands the equals sign to the desired bar length. The `tr` command then converts any space padding into additional equals signs, producing a compact, text-based visualization without external graphing libraries.

Mar 9, 2016
Loading thumbnail…

Gist 718a9dfea4f5678607c3

This example shows the number of ways to reach a target integer (40) by adding fixed step sizes of 2, 3, 6, 7, or 8, where negative values contribute zero and zero contributes one. The code defines a recursive function `furtburl` and wraps it with a custom `memoize` decorator that caches results by argument tuple, avoiding redundant re-computation. It uses plain Python with a dictionary cache and function decoration, then calls `furtburl(40)` to compute the count. The visualization displays the resulting integer value, though no graphical library or rendering is involved.

Mar 1, 2016
Loading thumbnail…

Gist 2f7ca9d9aa2634f57b35

This example visualizes a collection of humorous quotes attributed to Asim, rendered as individual text snippets. The visualization presents each quote as a distinct visual element, likely a card or a label, arranged in a grid or list format. It uses the D3.js library to handle the layout and rendering of the text-based data points. The source data is hardcoded as an array of strings within the code, and the display appears to use standard SVG text elements.

Feb 25, 2016
Loading thumbnail…

Gist f6017501c4c3249dbb32

This example parses a data-transfer log line from Aspera’s ASCP protocol, converting its space-delimited key/value pairs into a structured JSON object. It demonstrates a pure Scala regex-based parser, processing each field (bandwidth, retransmission, delay) for downstream analysis. The code uses Scala’s `scala.util.matching.Regex` and `String` methods to extract and format the metrics, serving as a first step toward a streaming Spark pipeline.

Dec 24, 2015
Loading thumbnail…

Gist bfd5f48411d371e896e1

This visualization maps the speech patterns of 2016 U.S. presidential candidates by scraping and parsing transcripts from the blog What The Folly. The author uses Bash commands with `wget`, `grep`, `sed`, and `awk` to extract article text, then organizes files by candidate. The resulting dataset supports comparative analysis of candidate rhetoric, though the code shown focuses on data collection and file management rather than visual rendering, with no charting libraries or display techniques specified.

Dec 19, 2015
Loading thumbnail…

Gist 9ea11dbcc52b4bb1c048

This example shows performance analysis for a data engineering capstone project, comparing a legacy Python log parser against a proposed Scala implementation on Spark and Mesos. The visualization tracks transfer metrics from ASCP log data, specifically examining throughput and packet rates. Using d3.js for charting, it evaluates how efficiently the new streaming solution handles regex parsing of unstructured logs. The project also demonstrates integration with Redis for persistent storage and FaspStream for live data ingestion, with the D3 visualizations presenting benchmark results from test log datasets.

Dec 17, 2015
Loading thumbnail…

Some little programming puzzle I found. Apparently Facebook asked this sometime. A message containing letters from A-Z is being encoded to numbers using the following mapping: a -> 1, b -> 2, ... etc. How many decodings of some given number. Takes an input of numeral characters.

This example demonstrates a recursive solution to the classic Facebook interview puzzle of counting possible letter-to-number decodings for a given numeral string. It shows how the algorithm branches by treating each string as either a single digit or a two-digit pair, with base cases for lengths zero, one, and two. The code relies on Python’s `sys.argv` to read input from the command line and uses custom helper functions `howMany` and `isValid` to handle recursion and validate two-digit codes against the 1–26 mapping. The rendering approach is purely console-based, printing the final count directly.

Dec 6, 2013